[bug] Removing items while dragging causes multiple issues

[wdoug]

Describe the bug When you are dragging an item, if the list prop is updated such that it should remove the element you are dragging we have seen multiple bugs:

1. The element dragging should be removed, but it consistently wasn't
2. Multiple JavaScript errors were frequently thrown

To Reproduce Steps to reproduce the behavior:

1. Have a list of sortable elements in the <ReactSortableJS /> component
2. Start dragging an element
3. While you're dragging, have an event trigger updating the list prop so that the element you are dragging should be removed

Expected behavior The element you are dragging should be removed with no errors thrown and the state of things continuing to work properly

Information This is required. Issues without this critical information will be closed.

Versions - Look in your package.json for this information: react-sortablejs = 6.0.0 (also had seen this same behavior with an earlier version) react = 16.9.0

Additional context Hoping to set up a codesandbox example at some point, just wanted to start the conversation here first

[wdoug]

Here's a codesandbox to play around with: https://codesandbox.io/s/react-sortablejs-forked-oprbs?file=/src/index.js

I haven't been able to reproduce all the issues yet, but I've seen a few.

[wdoug]

Example 1 (Recorded on Chrome):

[wdoug]

Example 2 (Recorded on Firefox):

Error when dropping the element that should have already been removed. I didn't record it, but in this case, the element remains behind in the DOM after dropping even though React thinks it shouldn't be there and you can't interact with it.

[wdoug]

Example 3 (Recorded on Firefox):

Unfortunately, I didn't capture the second error here, but the same issue happened after closing that overlay where the element existed in the DOM but couldn't be interacted with anymore.

[wdoug]

Update: It turns out that at least some of these issues come from Sortablejs itself: https://github.com/SortableJS/sortablejs/issues/1943