Join GitHub today
GitHub is home to over 28 million developers working together to host and review code, manage projects, and build software together.Sign up
Fix overscroll issues locking scroll up on long pages. #10227
This, I think, fixes #8603.
I wasn't able to reproduce the exact issue, but I was able to reproduce a different one which I think is the same minus some browser behavior differences.
Essentially, when you don't scroll the
Steps to reproduce:
Observe that you're not scrolling anywhere, or you're invoking overscroll bounces.
Step 4 is crucial — it is BECAUSE we start by scrolling downwards that the browser decides to try and scroll the body element instead of the element we mean to scroll (
This PR fixes that.
This POTENTIALLY also fixes issues reported in #8383 (comment).
referenced this pull request
Sep 28, 2018
To be clear: this bug only exists in Blink/WebKit-based browsers from my testing. This bug doesn't happen at all on Firefox in MacOS because it doesn't rubber-band when scrolling past the end of content.
So to reproduce you at least need Chrome or Safari on MacOS. Maybe it happens elsewhere, but not in my testing.
While this bug happens in both Chrome and Safari, it seems the fix only works in Chrome.
So it's better than before, but presumably this bug exists on mobile Safari too and wouldn't be fixed if not fixed on desktop. I'm on a plane right now so can't really test on my actual phone... but I think this needs more work to fix it across browsers.
Looks like Safari doesn't support this CSS... is there something else we can use to get this working on Safari? I guess if not it makes sense to ship this for at least Chrome users.
Actually, looks like Safari isn't supporting this anytime soon and it's just hacks to fix it.
Let's get this in to fix Chrome and mobile Firefox. https://caniuse.com/#feat=css-overscroll-behavior says Edge will support it out-of-the-box soon too.