-
Notifications
You must be signed in to change notification settings - Fork 47.4k
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
[react-events] Ensure updateEventListeners updates in commit phase #16540
[react-events] Ensure updateEventListeners updates in commit phase #16540
Conversation
Details of bundled changes.Comparing: 507f0fb...22508f2 react-dom
react-art
Generated by 🚫 dangerJS |
const prevListeners = oldProps.listeners; | ||
const nextListeners = newProps.listeners; | ||
if (prevListeners !== nextListeners) { | ||
updateEventListeners(nextListeners, instance, finishedWork); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is the main change of this PR.
if (prevListeners !== nextListeners) { | ||
updateEventListeners( |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is where we used to update Event Responders
rootContainerInstance, | ||
workInProgress, | ||
); | ||
updateEventListeners(listeners, instance, workInProgress); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is where we mount Event Responders
rootContainerInstance, | ||
workInProgress, | ||
); | ||
updateEventListeners(listeners, instance, workInProgress); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is where we mount Event Responders
@@ -1258,156 +1229,4 @@ function completeWork( | |||
return null; | |||
} | |||
|
|||
function mountEventResponder( |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Moved this code block into ReactFiberEvents
Looks like when you added back the |
): ReactDOMEventResponderInstance { | ||
// Listen to events | ||
const doc = rootContainerInstance.ownerDocument; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I believe that we originally built the old event system around the rootContainerInstance
so that we had the option to move to a model where we attach the listeners on the rootContainerInstance
instead of the ownerDocument
. The idea was that if you attach it on the root, then it doesn't interfere with siblings trees and stopping propagation can stop it to non-React parents. That's why rootContainerInstance
is passed around everywhere even though it doesn't really matter much which one is used (other than for portals into iframes).
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I know, but we never actually use it and it saves having to store the rootContainerInstance
somewhere to be be passed in during the commit phase (which is why I removed it, as I couldn't see an easy way to get it in the commit phase again).
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
You need to update ReactNativeHostConfig too before landing but the fundamentals here look right.
This is a follow up to the comment @sebmarkbage pointed out in #16532 (comment). Notably, we should only be updating EventResponder instances in the commit phase. EventResponder instances should continue to mount in the complete phase.
I also managed to resolve the issue that prevented us from moving the event fiber logic into the
ReactFiberEvents
file, as that logic is now shared between the complete and commit phase files.