Drag and drop regression in 4.0.4

[dmitriylyner]

With 4.0.4 (which included drop ability for external files) I am having issues dragging files already present in the tree. Haven't looked into it too deep yet but have a feeling regression was caused during this change: 4f2eef4.

I am receiving the following error (come from touch start) when dragging a file in the tree:

Full stack trace (triggered from

inspire-tree-dom/src/dom/list-item.js

Line 289 in 2755240

const exported = node.remove(true);

-> onDrop @ inspire-tree-dom.js:3001):
console.trace (anonymous) @ VM89474:1 handleEvent @ inspire-tree-dom.js:374 patchProp @ inspire-tree-dom.js:898 patchElement @ inspire-tree-dom.js:1438 patch @ inspire-tree-dom.js:1381 patchChildren @ inspire-tree-dom.js:1486 patchElement @ inspire-tree-dom.js:1457 patch @ inspire-tree-dom.js:1381 patchKeyedChildren @ inspire-tree-dom.js:1729 patchChildren @ inspire-tree-dom.js:1523 patchElement @ inspire-tree-dom.js:1457 patch @ inspire-tree-dom.js:1381 updateClassComponent @ inspire-tree-dom.js:1596 patchComponent @ inspire-tree-dom.js:1624 patch @ inspire-tree-dom.js:1384 updateClassComponent @ inspire-tree-dom.js:1596 patchComponent @ inspire-tree-dom.js:1624 patch @ inspire-tree-dom.js:1384 render @ inspire-tree-dom.js:1985 renderNodes @ inspire-tree-dom.js:3690 (anonymous) @ inspire-tree-dom.js:3332 EventEmitter.emit @ inspire-tree.js:4795 InspireTree.tree.emit @ inspire-tree.js:5391 applyChanges @ inspire-tree.js:5460 end @ inspire-tree.js:5820 baseStateChange @ inspire-tree.js:154 blur @ inspire-tree.js:2938 blur @ inspire-tree-dom.js:2546 removeChild @ inspire-tree-dom.js:361 remove @ inspire-tree-dom.js:701 patchKeyedChildren @ inspire-tree-dom.js:1772 patchChildren @ inspire-tree-dom.js:1523 patchElement @ inspire-tree-dom.js:1457 patch @ inspire-tree-dom.js:1381 updateClassComponent @ inspire-tree-dom.js:1596 patchComponent @ inspire-tree-dom.js:1624 patch @ inspire-tree-dom.js:1384 patchKeyedChildren @ inspire-tree-dom.js:1729 patchChildren @ inspire-tree-dom.js:1523 patchElement @ inspire-tree-dom.js:1457 patch @ inspire-tree-dom.js:1381 updateClassComponent @ inspire-tree-dom.js:1596 patchComponent @ inspire-tree-dom.js:1624 patch @ inspire-tree-dom.js:1384 patchKeyedChildren @ inspire-tree-dom.js:1729 patchChildren @ inspire-tree-dom.js:1523 patchElement @ inspire-tree-dom.js:1457 patch @ inspire-tree-dom.js:1381 updateClassComponent @ inspire-tree-dom.js:1596 patchComponent @ inspire-tree-dom.js:1624 patch @ inspire-tree-dom.js:1384 patchKeyedChildren @ inspire-tree-dom.js:1729 patchChildren @ inspire-tree-dom.js:1523 patchElement @ inspire-tree-dom.js:1457 patch @ inspire-tree-dom.js:1381 updateClassComponent @ inspire-tree-dom.js:1596 patchComponent @ inspire-tree-dom.js:1624 patch @ inspire-tree-dom.js:1384 patchKeyedChildren @ inspire-tree-dom.js:1729 patchChildren @ inspire-tree-dom.js:1523 patchElement @ inspire-tree-dom.js:1457 patch @ inspire-tree-dom.js:1381 updateClassComponent @ inspire-tree-dom.js:1596 patchComponent @ inspire-tree-dom.js:1624 patch @ inspire-tree-dom.js:1384 updateClassComponent @ inspire-tree-dom.js:1596 patchComponent @ inspire-tree-dom.js:1624 patch @ inspire-tree-dom.js:1384 render @ inspire-tree-dom.js:1985 renderNodes @ inspire-tree-dom.js:3690 (anonymous) @ inspire-tree-dom.js:3332 EventEmitter.emit @ inspire-tree.js:4795 InspireTree.tree.emit @ inspire-tree.js:5391 applyChanges @ inspire-tree.js:5460 remove @ inspire-tree.js:3948 onDrop @ inspire-tree-dom.js:3001

[dmitriylyner]

Maybe this was caused by inferno upgrade.

[viveleroi]

Can you provide a reproduction repo/codepen? I didn't encounter any issues when I tested so it sounds like there are specific steps needed.

[dmitriylyner]

[Possible user error] Maybe something was weird in my environment. Currently works as expected after wiping packages and reinstalling but I have seen this recently as well. I'll be working with drag and drop for the next few days and will keep an eye on it.

[dmitriylyner]

@viveleroi I'm still running into the same issue. Would you be able to update http://www.inspire-tree.com/demos/drag-and-drop.html to use 4.0.4?

[viveleroi]

Should be updated now.

[dmitriylyner]

@viveleroi The issue occurs with editable: true. Repro here: https://codepen.io/dmitriylyner/project/editor/Xbbeby

[dmitriylyner]

@viveleroi Any idea if this is solveable from inspire-tree-dom or is it a deeper issue? My use case requires me to have my own context menu so I am disabling editing but it makes me nervous that there may be a deeper stability issue.

[viveleroi]

Sorry I've been effectively without internet for a week now and likely will be for several days so I haven't had a chance to look. It sounds like it's an inferno issue but I need to look to see if there's something in inspire-tree causing it.

[viveleroi]

I think this just boils down to inferno not correctly handling state changes after the dom has changed via the native drag and drop API.

This only happens with editable=true because it places the "Add node" anchor in there (I've tried changing where in the DOM it appears, with no luck). For some reason, inferno just happens to misread the DOM when an element is present there.

This issue only happens though when the tree node is removed from it's current location anytime after drag start. I can't be sure exactly why, but I'd have to dig more on the inferno side. It's definitely drag related though, because when you remove a node via the edit toolbar, this doesn't occur.