Bug 259048

Summary: File Input — Moving file selector button keep the place under it
Product: WebKit Reporter: imagoiq
Component: CSSAssignee: Nobody <webkit-unassigned>
Status: NEW ---    
Severity: Normal CC: akeerthi, ap, simon.fraser, webkit-bug-importer, zalan
Priority: P2 Keywords: InRadar
Version: Other   
Hardware: Unspecified   
OS: Unspecified   
Attachments:
Description Flags
screenshot from STP 165
none
testcase
none
Screenshot from chrome 114 none

Description imagoiq 2023-07-10 02:38:57 PDT 
Created attachment 466998 [details]
screenshot from STP 165

When we move the file selector button from an input file, the space taken by the button is left in the document and cannot be hidden in anyways.
It impacts both::-webkit-file-upload-button and ::file-selector-button.

This seems to be a long-time issue (It was already here with Safari 10), so the issue might be already present in the backlog.

https://codepen.io/imagoiq/pen/wvQPrJP?editors=1000

It might be linked to https://bugs.webkit.org/show_bug.cgi?id=253463
Comment 1 imagoiq 2023-07-10 02:39:14 PDT 
Created attachment 466999 [details]
testcase
Comment 2 Alexey Proskuryakov 2023-07-10 12:50:14 PDT 
Thank you for the report! Could you please clarify what the issue is? The test case seems to work the same in Safari and in Chrome, for what it's worth.

> screenshot from STP 165

Please note that STP 165 is very old, the current version is 173. No difference in this case, though.
Comment 3 imagoiq 2023-07-11 00:32:57 PDT 
Created attachment 467020 [details]
Screenshot from chrome 114
Comment 4 imagoiq 2023-07-11 00:34:54 PDT 
Yes, if you look at the "no file selected" in Safari or the "No file chosen" label on Chrome, you can see that the one in Safari has some space before that is unwanted and not possible to remove. The space looks like to be the same size as the file selector button.
Comment 5 Radar WebKit Bug Importer 2023-07-17 02:39:18 PDT 
<rdar://problem/112390362>