When you have a custom labelIdle prop specified, on Safari desktop in OSX at least it requires 2 clicks to get the OS file dialog prompt if you click the label itself.
It appears to be a Safari desktop specific bug (tested with version 17.4.1 on OSX 14.4.1).
On Chrome & Firefox is works as expected, requiring only a single click no matter where you click in the filepond component, this appears to be Safari specific.
I have not had the time to test on mobile, no other browsers not listed or other operating systems.
Reproduction
Have a react app which uses the component with a custom labelIdle prop
In Safari specifically, with filepond in an unfocused state, if I click the blank area around the labelIdle contents the OS file dialog prompt appears as expected
Try the same thing and click the labelIdle contents and it requires 2 clicks to get the OS file dialog prompt to appear
If you press escape and click the same label contents it will subsequently only require a single click
Unfocus from filepond, e.g., by selecting another form item, it will require 2 more clicks again
If you do not specify a custom labelIdle prop, then this bug does not manifest and Safari only requires a single click when clicking on the default filepond label contents.
The labelIdle prop used to test this bug was a simple string value (i.e., no HTML required and the presence of a <span class="filepond--label-action"> tag does not alter the behaviour of this issue).
Environment
- Device: Desktop
- OS: OSX 14.4.1 (Sonoma)
- Browser: Safari (17.4.1) this appears to be a Safari specific bug
Is there an existing issue for this?
Have you updated FilePond and its plugins?
Describe the bug
When you have a custom labelIdle prop specified, on Safari desktop in OSX at least it requires 2 clicks to get the OS file dialog prompt if you click the label itself.
It appears to be a Safari desktop specific bug (tested with version 17.4.1 on OSX 14.4.1).
On Chrome & Firefox is works as expected, requiring only a single click no matter where you click in the filepond component, this appears to be Safari specific.
I have not had the time to test on mobile, no other browsers not listed or other operating systems.
Reproduction
labelIdle
proplabelIdle
contents the OS file dialog prompt appears as expectedlabelIdle
contents and it requires 2 clicks to get the OS file dialog prompt to appearlabelIdle
prop, then this bug does not manifest and Safari only requires a single click when clicking on the default filepond label contents.The
labelIdle
prop used to test this bug was a simple string value (i.e., no HTML required and the presence of a<span class="filepond--label-action">
tag does not alter the behaviour of this issue).Environment