clauderic / dnd-kit

The modern, lightweight, performant, accessible and extensible drag & drop toolkit for React.
http://dndkit.com
MIT License
12.61k stars 628 forks source link

Issue with `restrictToFirstScrollableAncestor` modifier when used with virtualized lists #94

Open aeroheim opened 3 years ago

aeroheim commented 3 years ago

I'm seeing an issue where DragOverlay incorrectly resets its position/styling when scrolling with virtualized lists.

I have a reproducible sandbox here: https://codesandbox.io/s/dnd-kit-drag-overlay-virtualized-scroll-clidu?file=/src/App.js

The sandbox uses react-window which is a fairly popular virtualization library. You should be able to reproduce the issue by repeatedly scrolling the list/down while dragging an item and then trying to drag the item past the boundaries of the list. It's also possible I might just be doing something wrong or missing something from the API, in which case help is greatly appreciated!

clauderic commented 3 years ago

This is indeed an issue, it's related to the use of the restrictToFirstScrollableAncestor modifier. As a workaround for now, you can avoid using that modifier until we can find a fix.