search

hello-pangea / dnd

💅 Beautiful and accessible drag and drop for lists with React. ⭐️ Star to support our work!
https://dnd.hellopangea.com
Other
2.31k stars 90 forks source link

Error: Invariant failed: Cannot find droppable entry with id [#] (using virtuoso with nested lists) #411

Closed vbgarciag closed 2 years ago

vbgarciag commented 2 years ago

Expected behavior

Being able to move an element from a sublist nested in a list to another sublist using virtualization (react-virtuoso)

Actual behavior

I have a main list which each item has a sublist, when I move a draggable item from sublist to another sublist and while scrolling down I get this error: Error: Invariant failed: Cannot find droppable entry with id [#], I assume the droppable component of the source sublist is unmounted when the item of virtualized list disappears and due to that the error is shown but I'm not sure if this is a real bug, it's worth mentioning that this behavior works perfectly if I don't use a virtual list

Steps to reproduce

Create a list and per each item create a sublist, apply virtualization to the main list and try to move an item of any sublist to another sublist (preferably to a sublist far from source sublist) the error happens when the sublist item container is unmounted by the virtualization

Suggested solution?

What version of React are you using?

(Currently it is "^17.0.2")

What version of @hello-pangea/dnd are you running?

(Currently it is "^15.0.0")

What browser are you using?

Demo

https://codesandbox.io/s/silent-currying-2ffv1m?file=/src/index.js

Merynek commented 2 years ago

The problem is that you render/remove new Droppable component during drag. Its no supported in react-beautiful-dnd. Virtualization can be use only when is only one droppable content and many draggable items. Mby library @hello-pangea/dnd fix this problem in future.

100terres commented 2 years ago

Hi @vbgarciag,

Sadly, as mentioned by @Merynek, @hello-pangea/dnd does not support what you are trying to do, but we might try to investigate and fix this issue in the future.

vbgarciag commented 2 years ago

@100terres Thanks, I really appreciate your answer 👍 I hope this can be fixed in the future.