xyflow
xyflow copied to clipboard
`onViewportChange` Function Not Updated When Dependencies Change in useEffect Hook
What platform were you using when you found the bug?
- React Flow / Svelte Flow version: 12.1.1
- Browser and version: n/a
- OS and version: n/a
Live code example
https://codesandbox.io/p/sandbox/cocky-leftpad-w9z9nz
Describe the Bug
There is a bug in the useEffect
hook within the zoomPane
setup code where the onViewportChange
function is used. The useEffect
hook does not include onViewportChange
in its dependency array. As a result, if the onViewportChange
function is updated, the effect continues to reference the stale closure of the function, leading to unexpected behavior where the old version of the function is called instead of the new one.
Steps to reproduce the bug or issue
- Open sandbox and run preview
- Click "Use ViewportStore2" Button
- Try to move or zoom the pane
Expected behavior
The pane should move. But since the stale onViewportChange
changes the ViewportStore1, all changes will be applied to that. When you switch back you will see exactly that.
Screenshots or Videos
No response
Additional context
No response