search

reppners / ngx-drag-drop

Angular directives using the native HTML Drag And Drop API
https://reppners.github.io/ngx-drag-drop/
BSD 3-Clause "New" or "Revised" License
299 stars 118 forks source link

Cannot read property 'removeChild' of null #37

Closed sebek64 closed 5 years ago

sebek64 commented 5 years ago

Describe the bug Sometimes "Cannot read property 'removeChild' of null" appears in the console.

To Reproduce It is quite possible to reproduce it in official demo: https://reppners.github.io/ngx-drag-drop/ Switch to lists tab, and rapidly move elements between first two lists. Then, after a few tries, this appers in the console:

polyfills.ee8636f875…53b14dd.bundle.js:1 Uncaught TypeError: Cannot read property 'removeChild' of null
    at Yl.cleanupDragoverState (main.eeb7da7….bundle.js:1)
    at Yl.onDragLeave (main.eeb7da7….bundle.js:1)
    at HTMLElement.Yl.dragLeaveEventHandler.t (main.eeb7da7….bundle.js:1)
    at t.invokeTask (polyfills.ee8636f875…53b14dd.bundle.js:1)
    at e.runTask (polyfills.ee8636f875…53b14dd.bundle.js:1)
    at e.invokeTask [as invoke] (polyfills.ee8636f875…53b14dd.bundle.js:1)
    at m (polyfills.ee8636f875…53b14dd.bundle.js:1)
    at HTMLElement.b (polyfills.ee8636f875…53b14dd.bundle.js:1)

I can also reproduce the same on my project, where in devel mode, one can see a better stacktrace:

zone.js:192 Uncaught TypeError: Cannot read property 'removeChild' of null
    at DndDropzoneDirective.push../node_modules/ngx-drag-drop/ngx-drag-drop.es5.js.DndDropzoneDirective.cleanupDragoverState (ngx-drag-drop.es5.js:713)
    at DndDropzoneDirective.push../node_modules/ngx-drag-drop/ngx-drag-drop.es5.js.DndDropzoneDirective.onDragLeave (ngx-drag-drop.es5.js:620)
    at HTMLDivElement.DndDropzoneDirective.dragLeaveEventHandler (ngx-drag-drop.es5.js:473)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188)
    at ZoneTask.push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask [as invoke] (zone.js:496)
    at invokeTask (zone.js:1540)
    at HTMLDivElement.globalZoneAwareCallback (zone.js:1566)

Expected behavior This error should not happen.

Desktop (please complete the following information):

I'm running the latest version: 2.0.0-rc.1.

reppners commented 5 years ago

Welcome and thanks for the detailed bugreport!

Will look into it the next couple of days.

sebek64 commented 5 years ago

Just to add more information, I've encountered this bug with a bit different stack trace:

ERROR TypeError: Cannot read property 'removeChild' of null
    at DndDropzoneDirective.push../node_modules/ngx-drag-drop/ngx-drag-drop.es5.js.DndDropzoneDirective.cleanupDragoverState (ngx-drag-drop.es5.js:713)
    at DndDropzoneDirective.push../node_modules/ngx-drag-drop/ngx-drag-drop.es5.js.DndDropzoneDirective.onDrop (ngx-drag-drop.es5.js:604)
...
krixerx commented 5 years ago

We have same error:

ERROR TypeError: Cannot read property 'removeChild' of null at DndDropzoneDirective.push../node_modules/ngx-drag-drop/ngx-drag-drop.es5.js.DndDropzoneDirective.ngAfterViewInit (ngx-drag-drop.es5.js:499) at callProviderLifecycles (core.js:9567) at callElementProvidersLifecycles (core.js:9541) at callLifecycleHooksChildrenFirst (core.js:9531) at checkAndUpdateView (core.js:10467) at callViewAction (core.js:10699) at execComponentViewsAction (core.js:10641) at checkAndUpdateView (core.js:10464) at callViewAction (core.js:10699) at execEmbeddedViewsAction (core.js:10662)

Everything itself looks working but error in console is scary. Angular 6, ngx-drag-drop@next

reppners commented 5 years ago

Please check out 2.0.0-rc.2 available as next. It should fix this bug.

sebek64 commented 5 years ago

Thanks for fixing. I'm no longer able to reproduce this problem with rc.2.

krixerx commented 5 years ago

Yes, we don't see this exception in console anymore too. Thanks!