Table click and drag to select multiple rows?

its a bit janky, doesnt always seems to catch the start... but its something
its not drawing a sqaure though, that doesnt really work well with scrollable content

Summary
	
	code =  """<img style='display:none' src='/favicon.ico' onload=\"		
		let start;
		function onmousestart(ev){
			start = ev.target;
		};
		function onmousestop(ev){			
			let stop = ev.target;
			var clickEvent = new MouseEvent('click', {bubbles:true, shiftKey:true});						
			start.dispatchEvent(clickEvent);
			stop.dispatchEvent(clickEvent);
			start=null;
		};		
		const callbackTable = (mutationList, observer) => {		
			document.querySelectorAll('.tr-group.ia_table__rowGroup .content').forEach(e => {					
						e.onmouseup = onmousestop;
						e.onmousedown = onmousestart;										
					});	
		};
		const observerTable = new MutationObserver(callbackTable); 
		const tables = document.querySelectorAll('.ia_tableComponent .t.ia_table > .tb');
		tables.forEach(table => observerTable.observe(table, { attributes: false, childList: true, subtree: true }));	
		document.querySelectorAll('.tr-group.ia_table__rowGroup .content').forEach(e => {					
							e.onmouseup = onmousestop;
							e.onmousedown = onmousestart;													
						});	
				
	\"></img>""".replace("\n", "").replace("\t", "")
	return code
		

this adds in a cursor style too, to atleast see something while dragging.

Summary
	
	code =  """<img style='display:none' src='/favicon.ico' onload=\"		
		let start;
		const tables = document.querySelectorAll('.ia_tableComponent .t.ia_table > .tb');
		function onmousestart(ev){
			start = ev.target;
			tables.forEach(table=> table.style.cursor = 'row-resize');
		};
		function onmousestop(ev){			
			let stop = ev.target;
			var clickEvent = new MouseEvent('click', {bubbles:true, shiftKey:true});						
			start.dispatchEvent(clickEvent);
			stop.dispatchEvent(clickEvent);
			start=null;
			tables.forEach(table=> table.style.cursor = 'auto');
		};		
		const callbackTable = (mutationList, observer) => {		
			document.querySelectorAll('.tr-group.ia_table__rowGroup .content').forEach(e => {					
						e.onmouseup = onmousestop;
						e.onmousedown = onmousestart;										
					});	
		};
		const observerTable = new MutationObserver(callbackTable); 
		
		tables.forEach(table => observerTable.observe(table, { attributes: false, childList: true, subtree: true }));	
		document.querySelectorAll('.tr-group.ia_table__rowGroup .content').forEach(e => {					
							e.onmouseup = onmousestop;
							e.onmousedown = onmousestart;													
						});	
				
	\"></img>""".replace("\n", "").replace("\t", "")
	return code