Scroll bar moves erratically when flipping components.

[samgoulden28]

Hey, I really like this library and have found it incredibly easy to implement.

At this point I have not included it in my app because I am finding that when I swap my component positions, the window scrolls up to the top of the page very briefly before then scrolling back down to bring the components into view. It looks extremely jarring.

It might well be due to the fact that I am using React DND as well (https://react-dnd.github.io/react-dnd/examples) but I cant be sure. This is definitely a huge aesthetic issue however and until I can get it resolved wont be able to use the library or recommend it.

I did not see this issue with react-flip-move however I cannot use that either due to it using an unsafe componentWillReceiveProps method.

[jlkiri]

Could you make a codesandbox or something with the minimal reproduction?

[samgoulden28]

Just created this:

https://codesandbox.io/s/brave-jepsen-f8msr?file=/src/MyCard.js

Please scroll to the middle of the page around about card 13 or 14 and then drag and swap the cards. You will see the scroll wheel move up and down.

[jlkiri]

It is probably not react-dnd: I see some scrolling issues in a similar setting with no libraries used.
What's weird is that it's not react-easy-flip either!

Maybe this is a React problem? Here's another example with simple shuffle (press X to shuffle) - it does not use any library, but occasionally scrolls to top if shuffled when scrolled to bottom, for example.

https://codesandbox.io/s/weird-shuffle-problem-egmpf?file=/src/App.js