[bug]: On onRest Callback, not really arrives stand-still
Open
Nobody has claimed this yet.
area: core
kind: bug
- Dominant language
- TypeScript
- Stars
- 29.1k
- Forks
- 1.2k
- PR merge metrics
- No merged PRs in 30d
Description
Which react-spring target are you using?
-
@react-spring/web -
@react-spring/three -
@react-spring/native -
@react-spring/konva -
@react-spring/zdog
What version of react-spring are you using?
9.5.5
What's Wrong?
when on onRest callback, I expect "top" value to 100, but it is not.
const props = useSpring({
from: { top: 0 },
to: { top: 100 },
onRest: () => {
console.log(ref.current?.style.top); // Wrong: it is not 100, about like 99.7959px
window.requestAnimationFrame(() => {
console.log(ref.current?.style.top); // Right: it is 100
});
}
});
To Reproduce
See Codesandbox.
Expected Behaviour
See Codesandbox.
Link to repo
https://codesandbox.io/s/react-spring-onrest-xfsq1j?file=/src/App.js:240-246
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 with src/App.js in the linked CodeSandbox and reproduce the @react-spring/web example using useSpring and onRest. Compare ref.current.style.top inside onRest with its value in the next requestAnimationFrame, then trace the relevant callback and style-update path. Done means the callback behavior matches the expected value and the regression is covered by a test.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, react
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 50/100