motiondivision / motiondivision/motion
[BUG] scroll()/useScroll report elastic overscroll as forward scroll
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 33.7k
- Forks
- 1.4k
- Avg merge
- 1d 10h
- Merged PRs (30d)
- 14
Description
2. Describe the bug
During elastic overscroll at the top of the page (Safari's rubber-band, macOS and iOS), window.scrollY goes negative but useScroll().scrollY / info.y.current report the unsigned magnitude, so a 25px pull reads as 25px of forward scroll. Cause: the unconditional Math.abs in updateAxisInfo (added in abaf16e for #3340's reverse-direction containers) also folds the sign of transient overscroll in normal containers.
3. CodeSandbox reproduction
https://codesandbox.io/p/sandbox/3dmxgc
4. Steps to reproduce
- Open the sandbox preview in Safari, scrolled to the top.
- Pull up so the page rubber-bands.
- The readout shows
window.scrollYnegative whileinfo.y.currentreports it positive.
5. Expected behavior
Normal containers keep the signed offset, matching window.scrollY; reverse-direction containers keep the normalized values from #3340; progress stays within [0, 1].
6. Video or screenshots
https://github.com/user-attachments/assets/f510241f-bf39-4c55-88cd-954eef0c29d1
Covered by the sandbox readout.
7. Environment details
motion 12.43.0, also present on current main. Reproduced in Safari on macOS.
Fix branch linked in the comment below.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start at the unconditional Math.abs in updateAxisInfo and reproduce the behavior with the linked CodeSandbox in Safari. Preserve signed offsets for normal containers while retaining normalized reverse-direction values, keep progress within [0, 1], and verify that the sandbox readout matches window.scrollY during elastic overscroll.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Quiet
- Clarity
- Clearly specified
- Newbie friendliness
- 42/100