Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

useRootClose and stopPropagation on React 17 #944

Open
ricardozv28 opened this issue May 7, 2021 · 1 comment
Open

useRootClose and stopPropagation on React 17 #944

ricardozv28 opened this issue May 7, 2021 · 1 comment

Comments

@ricardozv28
Copy link

ricardozv28 commented May 7, 2021

When updating a project from React16 to React17 run into an "issue" with the useRootClose.

Currently, the project has various buttons/icons that are getting used to trigger the show/hide of different Popovers, the Popovers are being displayed only one at a time, and I am using the useRootClose to close the popover on click events outside of them
I need to stop the propagation of the events when the user clicks the triggers (buttons/icons).
If the user clicks another trigger while a popover is open, the open popover is getting closed and the new one is displayed, with the changes to event delegation introduced in React17, this is no longer happening since the stopPropagation() is doing what it supposed to do.

Here are some examples
React 16: https://codesandbox.io/s/rootclose-stoppropagation-react16-tp7p9
React 17: https://codesandbox.io/s/rootclose-stoppropagation-react17-wckle

Potential Fixes:
Adding an option to the useRootClose so the onRootClose method can be fired on the capture phase as suggested on Fixing Potential Issues

I haven't found any workaround for it yet, besides removing the stopPropagation() that will not work for my use case.

@lakerswgq
Copy link

any progress on this issue? having the same problem

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants