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

Listen to onScroll during hydration #19803

Merged
merged 1 commit into from
Sep 10, 2020
Merged

Conversation

gaearon
Copy link
Collaborator

@gaearon gaearon commented Sep 10, 2020

This might explain the regression we're seeing with the eager listener flag. Concretely, I missed one of the places where onScroll event should be attached (as it doesn't get delegated). I attached it correctly on first render and updates, but I missed the hydration case. This PR fixes it and adds a regression test that previously failed. It also adds a second test for the update case for better coverage (but that one wasn't broken in the first place).

@facebook-github-bot facebook-github-bot added CLA Signed React Core Team Opened by a member of the React Core Team labels Sep 10, 2020
@@ -797,4 +799,108 @@ describe('ReactDOMEventListener', () => {
document.body.removeChild(container);
}
});

it('should subscribe to scroll during updates', () => {
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This wasn't failing previously but I added for completeness.

});

// Regression test.
it('should subscribe to scroll during hydration', () => {
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This one fails on master with the eager flag, but passes here.

@@ -1086,6 +1086,8 @@ export function diffHydratedProperties(
}
if (!enableEagerRootListeners) {
ensureListeningTo(rootContainerElement, propKey, domElement);
} else if (propKey === 'onScroll') {
listenToNonDelegatedEvent('scroll', domElement);
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The fix. This mirrors similar branches in two other places in this file.

@codesandbox-ci
Copy link

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit d6cf12e:

Sandbox Source
React Configuration

@sizebot
Copy link

sizebot commented Sep 10, 2020

No significant bundle size changes to report.

Size changes (experimental)

Generated by 🚫 dangerJS against d6cf12e

@sizebot
Copy link

sizebot commented Sep 10, 2020

No significant bundle size changes to report.

Size changes (stable)

Generated by 🚫 dangerJS against d6cf12e

@gaearon gaearon merged commit a08ae9f into facebook:master Sep 10, 2020
koto pushed a commit to koto/react that referenced this pull request Jun 15, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed React Core Team Opened by a member of the React Core Team
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

5 participants