plotly.js icon indicating copy to clipboard operation
plotly.js copied to clipboard

Purging and removing element while hovering causes "undefined is not an object"

Open hex2f opened this issue 4 years ago • 1 comments

So, I'm unsure if this issue is with the react library or this one. But the responsible code resides in this repository so I'll try my luck here.

If you unmount a plot rendered in react while hovering your mouse over it, maindrag.onmouseout gets triggered before all event handlers are completely unregistered.

This causes the error undefined is not an object (evaluating 'gd._fullLayout._hoversubplot = null') at plotly.js:148662==graph_interact.js:79. I looked into it with a breakpoint and the issue seems to be that _fullLayout doesn't exist anymore on gd.

A simple fix (assuming this is an issue with plotly.js and not react-plotly.js) could be to just add || !dg._fullLayout to graph_interact.js:74. If it isn't an issue with plotly itself, it may still be a good idea to wrap the event handlers with try/catch and log a warning about not unmounting correctly instead of a flat out error.

hex2f avatar Nov 30 '21 19:11 hex2f

Good find @leahlundqvist - seems like this may apply to any mouseout handlers (if there are any others) and yes, I think detecting that gd has been purged and short circuiting is the right solution. I’m worried there may be an even more problematic situation if the element is unmounted mid-drag on the plotting area or any other element that creates a dragCover, because these are attached to the DOM outside the main graph div.

alexcjohnson avatar Nov 30 '21 22:11 alexcjohnson