Hover label bBox isn't right on this page in FF55

[etpinard]

See graphDiv2 heatmap in https://codepen.io/anon/pen/xXxOqG

First reported in https://community.plot.ly/t/firefox-only-hovertext-bounding-box-in-heatmap-chart-is-not-always-correct/5737

Works fine in Chrome 61

[alexcjohnson]

Wow, this is the weirdest one I've seen in a while. Simply calling Plotly.newPlot twice (with the same data into the same <div>) is enough to trigger this bug. Seems specific to heatmap, contour, and the 2d histogram types.

Sadly the FF debugger still can't seem to load our source files and nearly crashes my whole machine if I try...

Somehow it seems that the colorbar title is necessary to trigger the issue. Minimal example:

var data1 = [{
	  type: "heatmap",
	  z: [[10, 32], [55, null]],
	  colorbar: {title: "X"}
}];
Plotly.newPlot(graphDiv1, data1);
Plotly.newPlot(graphDiv1, data1);

Take out the title and it works correctly.

[rreusser]

Ouch. I can reproduce this. But if I open the firefox inspector and try to see what's going on with the SVG DOM, it suddenly appears correct. And if I close the inspector, it remains correct. That feels like the sort of thing you see when there's some rendering optimization that's not working quite right. But I'm not sure because it's hard to debug. 😞

[alexcjohnson]

I'm tempted to just get rid of all the getBoundingClientRect calls in fx/hover (use Drawing.bBox where necessary) and hope it fixes #888, #1902, and this.

[alexcjohnson]

FYI even unrelated traces have their hover labels messed up by the colorbar title.

var data1 = [{
	  type: "heatmap",
	  z: [[10, 32], [55, null]],
	  colorbar: {title: ""}
}, {y:[0, 1]}]; // that's a scatter trace

Gives me even more reason to think ^^ would fix it.

[alexcjohnson]

I can't reproduce this bug anymore, even in FF55. Can we close it? Of course the goal of removing getBoundingClientRect still stands, but the other issues should serve as impetus for that.

[etpinard]

Closing. Can't reproduce in FF60