Document that using <input> inside a <label> triggers a 2nd click event
CWSites opened this issue · comments
It seems that this issue has been re-introduced. I am still getting this error in Chrome from version 10.2 up to the latest version. Reproduction: https://codesandbox.io/s/pedantic-leakey-61oo3?file=/src/App.js
If you click on label and close the dialog either by choosing a file or canceling, another file select dialog is open.
On closer inspection, this issue is solved by passing noClick: true to the useDropzone hook. Maybe this behaviour should be enabled by default when the root element is a label element?
Originally posted by @Stopa in #182 (comment)
@CWSites I'd appreciate it if you follow the issue template to describe what the issue is.
The issue with using a <label> is a known issue (it should be common knowledge to the average frontend dev - clicking a label triggers click on the <input> if it's nested under - see SO). I attempted a fix in #817, but that introduced other issues, so it got reverted in a159354.
I can add a note about this where the documentation already mentions using noClick to prevent such behaviour.
🎉 This issue has been resolved in version 11.6.0 🎉
The release is available on:
Your semantic-release bot 📦🚀