Resize position doesn't work properly in NextJs 14 and React concurrent mode
shuo-hiwintech opened this issue · 1 comments
Overview of the problem
I'm using react-rnd version [10.4.11]
My browser is: Chrome
I am sure this issue is not a duplicate?yes
Reproduced project
https://codesandbox.io/p/sandbox/interesting-archimedes-5cwk3x?file=%2Fsrc%2Findex.js%3A5%2C1
Description
When I use react-rnd in React 18 Concurrent Mode as well as in Next JS 14, I find that whenever I trigger the onResize event on the Rnd component, the value of position.x I get is not accurate. However, in the same case, if I change to React 18 Legacy Mode, i.e. rendering my item using ReactDOM.render(), I am able to get the position.x value correctly.
Steps to Reproduce
- click here https://codesandbox.io/p/sandbox/interesting-archimedes-5cwk3x?file=%2Fsrc%2Findex.js%3A5%2C1
- Open src/index.js and switch to Concurrent Mode.
- Resize the page element to the left and check the console, you will see that even if you resize to the leftmost position.x will not be 0, but if you go back to src/index.js and try again after switching to Legacy Mode, everything will be fine.
Expected behavior
position.x gets the correct value
Actual behavior
position.x gets an incorrect value
This is not a problem in react-rnd@10.4.9, but onResize is called back an unusually high number of times