-
Notifications
You must be signed in to change notification settings - Fork 46.5k
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
Bug: Re-rendering nested components breaks event listeners on parent #27618
Comments
Figured out the issue is specific to re-rendering nested components. Still seems like unexpected behavior, so I'm reopening the issue with appropriate edits. Definitely possible that I'm overlooking something obvious, so please feel free to reply with your thoughts |
Hello @greebl3 , looks like the onTouchEnd event listener breaks as soon as the nested component is re-rendered for the first time. |
Thanks for looking into it @MarceloSpessoto. I feel like this is not a niche issue and/or has implications on a lot of production builds so it would be nice to get more visibility on this. As a stop-gap, I wrapped the extracted child component in a |
A more visual example: https://codesandbox.io/p/sandbox/re-rendering-breaks-event-listener-forked-p5kqck See the console log:
|
It doesn't look like In the example you provided, calling |
I can find time to investigate this issue in the evenings of these few days. |
Encountering a similar issue (will be opening an issue). Event handlers across the entire window break when re-rendering a nested conditional component. (Edited) |
This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize it yet. If you have any new additional information, please include it with your comment! |
bumping |
This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize it yet. If you have any new additional information, please include it with your comment! |
Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please create a new issue with up-to-date information. Thank you! |
Re-rendering nested components breaks event-handlers; wrapping handler functions in
useCallback
makes no differenceReact version: 18.2
Link to code example: https://codesandbox.io/s/re-rendering-breaks-event-listener-2dxjhz
Note: The repro makes use of
Touch
events, so open the Sandbox link on a mobile deviceThe current behavior
onTouchEnd
does not fire when re-rendering a nested component, even when caching handler-functions withuseCallback
The expected behavior
Re-rendering a nested component should have no effect on its parent's event-listeners
The text was updated successfully, but these errors were encountered: