HTML element under the drawer is clicked when the button on the drawer is clicked #7480
Description
Provide a general summary of the issue here
we are struggling with such a problem: we open a drawer with a close button placed exactly over the div container with an onClick handler on the main page.
when we open the page in a new tab, turn on dev tools (responsive Desktop mode (touch), and click the drawer closing button, the onClick event is intercepted by the div handler (red box).
link to a small example where you can repeat the behavior:
https://2njszr.csb.app/
note, that refreshing the page makes everything work correctly.
🤔 Expected Behavior?
clicking on a button on a drawer should not trigger the onClick of the element under it.
😯 Current Behavior
the onClick handler on the element under the drawer is clicked
💁 Possible Solution
No response
🔦 Context
No response
🖥️ Steps to Reproduce
- open https://2njszr.csb.app/
- turn on developer tools, click Toggle Device Toolbar
- choose Responsive - Desktop (touch) mode
- click Open drawer button
- click Close button on a drawer
- onClick handler (alert) is fired
Version
react-aria-components 1.5.0
What browsers are you seeing the problem on?
Chrome (Version 131.0.6778.86 (Official Build) (arm64))
If other, please specify.
No response
What operating system are you using?
MacOS
🧢 Your Company/Team
No response
🕷 Tracking Issue
No response