Skip to content

Conversation

@adamraine
Copy link
Contributor

I was noticing that Chrome would (usually) scroll too far when clicking a category link on the summary page. This only happens when using {behavior: 'smooth'}.

Executing scrollIntoView in useEffect seems to have fixed the problem since the body is run after paint. We still want the scroll-to-top feature to execute before the first paint, so that is given it's own useLayoutEffect.

@adamraine adamraine requested a review from a team as a code owner November 3, 2021 20:38
@adamraine adamraine requested review from connorjclark and removed request for a team November 3, 2021 20:38
@google-cla google-cla bot added the cla: yes label Nov 3, 2021
@paulirish
Copy link
Member

paulirish commented Nov 10, 2021

what about just not using behavior:smooth?
This feels pretty finicky.

w/o behavior:smooth you'd be consistent with the existing scrollIntoView:

destEl.scrollIntoView();

@adamraine
Copy link
Contributor Author

what about just not using behavior:smooth?

We were trying to avoid the category looking like it's on its own page. That was speculation though, so we can remove the smooth scroll and see if confusion arrises at all.

@adamraine adamraine changed the title report(flow): prevent overscrolling anchor report(flow): remove smooth scrolling Nov 11, 2021
@adamraine adamraine merged commit 99bd2fa into master Nov 11, 2021
@adamraine adamraine deleted the flow-scroll-bug branch November 11, 2021 19:35
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants