Uncaught error thrown in StyleManager.verifySheet

[Dev-Lan]

When I call taggle.setOverviewMode(...) I get an error thrown in the console:

The trace is:

taggle.setOverviewMode(...) →
updateLodRules →
GridStyleManager.updateRule →
StyleManager.verifySheet →
sheet.deleteRule()

The last line is where the error is thrown. https://github.com/lineupjs/lineupengine/blob/main/src/style/StyleManager.ts#L86

This appears to be caused by incorrectly deleting all the items in a list with a for loop.

const rules = sheet.cssRules;
...
const l = rules.length;
for (let i = 0; i < l; i += 1) { sheet.deleteRule(i); }

Suggested Fix
I have not tested this, but changing the loop logic should fix this.

while (sheet.cssRules.length > 0) { sheet.deleteRule(0); }

Screenshots
Notice how the error repeats, but the index listed is cut in half. This matches what I say above, half the items are deleted before getting to the end of the array, Then something (I don't know what) retriggered the code, and half the rules are deleted again.

Context

• Version: 4.6.0
• Browser: Chrome

Additional context

The ability to call setOverviewMode from a taggle object is new functionality, introduced in lineupjs/lineupjs#552. That might have exposed this error, but it is possible this could be triggered some other way.

[Dev-Lan]

Some more context.

I did find a couple of other actions that trigger the same error.

In overview mode selecting some rows:

In overview mode scrolling horizontally:

Repeating the user actions a few times will eventually clear out the cssRules, and things then appear to work correctly.

I was not able to trigger these when I used the overview toggle checkmark in the sidebar.