Plotly table hijacks page scrolling

[anikets43]

I implemented as per https://plot.ly/javascript/table/

Issue: When we have full width table, page scrolling doesn't work even the table scrolls end. This completely creates confusion and looks like page is hanged.

[AbdealiLoKo]

I've faced the same issue and can reproduce in the examples on that page too.

[alexcjohnson]

Thanks @anikets43 - agreed, this is a bug.

[alexcjohnson]

FWIW scrollable legends do not have this issue: when you reach the end of a legend, the page does start scrolling.

[AbdealiLoKo]

@alexcjohnson by any chance is there a workaround for this?
I have a few pages which need to predominantly render tables and if I go to that section of my webpage I'm basically stuck and unable to do anything. Need to find some margin at the extreme corner.

Got a few bug reports from users that the webpage is stuck and hanging their browser =P

[alexcjohnson]

@etpinard let's try to address this for 1.43 - even staticPlot doesn't avoid it.

[AbdealiLoKo]

Do let me know if I can help in any way. I'm not adept in js (I use plotly.py ...) otherwise would have attempted a PR...
If I can help by providing debug info or testing or something else pleas feel free to ping me

[anikets43]

@alexcjohnson
In my aplication too this is a major blocker as we have a huge full page table and can't scroll on that page.
Is there a way for me to comment out this event blocking in my server where I am using plotly ? Could you point me to where this event bubbling chain stops ? I'd like to try commenting out the e.preventDefault() or whatever is causing this scroll hijack and see whether it fixes it for my table.

[alexcjohnson]

This looks like the relevant handler:

plotly.js/src/traces/table/plot.js

Lines 59 to 66 in 7bb5daa

	.on('mousewheel', function(d) {
	if(d.scrollbarState.wheeling) return;
	d.scrollbarState.wheeling = true;
	d3.event.stopPropagation();
	d3.event.preventDefault();
	makeDragRow(gd, tableControlView, null, d.scrollY + d3.event.deltaY)(d);
	d.scrollbarState.wheeling = false;
	})

[anikets43]

Thanks @alexcjohnson
This would work for now :)