Bug 254459

Summary: input with width:0 doesn't hide the file chooser button
Product: WebKit Reporter: Sam Sneddon [:gsnedders] <gsnedders>
Component: FormsAssignee: Nobody <webkit-unassigned>
Status: NEW ---    
Severity: Normal CC: akeerthi, cdumez, karlcow, webkit-bug-importer, wenson_hsieh
Priority: P2 Keywords: BrowserCompat, InRadar
Version: WebKit Nightly Build   
Hardware: Unspecified   
OS: Unspecified   
See Also: https://bugs.webkit.org/show_bug.cgi?id=253463
https://bugs.webkit.org/show_bug.cgi?id=259602
Attachments:
Description Flags
screenshot from STP 165 none

Description Sam Sneddon [:gsnedders] 2023-03-25 03:34:36 PDT 
Created attachment 465587 [details]
screenshot from STP 165

1. Upload PDF to https://www.deepl.com/translator/files
2. Wait for it to translate and offer download
3. A new download field appears, looking broken

Looks like it has a button trying to be drawn over an input, and this isn't working nicely in Safari.
Comment 1 Radar WebKit Bug Importer 2023-03-26 18:26:22 PDT 
<rdar://problem/107248208>
Comment 2 Karl Dubost 2023-03-26 18:26:36 PDT 
This looks very similar to Bug 253463 at first sight.
The technique in Bug 253463 was to used negative `text-indent` for making the button disappear.

In this case they use… `width: 0`

https://codepen.io/webcompat/pen/QWVYJER

OR 
data:text/html,<input%20type=file%20style="width:0">

It's very similar.
Comment 3 Aditya Keerthi 2023-03-27 14:21:06 PDT 
Could be the result of some custom logic in `RenderFileUploadControl`...
Comment 4 Aditya Keerthi 2023-03-27 14:22:20 PDT 
Note that the button is in the UA shadow tree, and has non-zero width.