TableSort and new Series table

[unnecessarydave]

TableSort has multiple issues with the new Series table:

• clicking to sort a column displays a tsunami of tooltips
• cells are line wrapped when an Invite link is displayed during series break

[rferromoreno]

• clicking to sort a column displays a tsunami of tooltips

Had been trying to debug this, seems it's because the cloneElement logic and probably the hattrick-tooltip component mounting logic, or something with, Angular DOM manipulation. Maybe we should sync with HT Devs to fix this one. Or we could just manipulate the DOM by deleting duplicated tooltips and adding the hidden attribute to each of the elements, but honestly I do not like that solution

[unnecessarydave]

Thanks for taking the time to look at this.

So when we cloneElement it runs the constructor for hattrick's custom <hattrick-tooltip> element and that adds the duplicate <div id="tooltip"> maybe? Or Angular, as you say, which I assume has MutationObservers doing who knows what.

As per your comment I tried this out as a test

File: table-sort.js
122: 				// rows to be sorted
123: 				var rows = [];
124: 				for (let i = sortStart + 1; i < sortEnd; ++i) {
125: 					let row = table.rows[i];
126: 					let tooltips = row.querySelectorAll('#tooltip');
127: 					if (tooltips.length > 0)
128: 						tooltips.forEach(tt => tt.remove());
129: 					rows.push(Foxtrick.cloneElement(row, true));
130: 				}

On the surface this does work, but it doesn't totally solve the problem. With each successive click to sort it gets slower and slower. Possibly because Angular or something else still has references to all the deleted elements???