Resize loop inside hierarchical view -> menu -> dropdown-tabs

[dlockhart]

This was noticed in the facet-filter-sort repo, which has a dropdown with both a menu inside and dropdown-tabs.

This exception is thrown in Safari only:

ResizeObserver loop completed with undelivered notifications

Safari only added support for ResizeObserver in January 2020, which could explain why we weren't seeing this before.

The explanation for that error is this:

If any changes are incurred during the callback, then layout happens again, but here, the system finds the shallowest at which depth a change occurred (measured in simple node depth from the root). Any changes that are related to something deeper down in the tree are delivered at once, while any that are not are queued up and delivered in the next frame, and an error message will be sent to the Web Inspector console: (ResizeObserver loop completed with undelivered notifications).

Digging deeper:

• This originates from hierarchical view's ResizeObserver which when triggered just fires a d2l-hierarchical-view-resize event
• That in turn is listened to by menu, which fires its own d2l-menu-resize event
• Lastly, dropdown-tabs is listening for that which re-positions itself and completes the cycle and triggers a new resize observation on the original hierarchical-view.

I can't figure out why Safari is complaining and the other browsers aren't... everything seems to be happening in the same sequence.

[svanherk]

This started failing in filter at the 1.150.1 version of core: v1.150.0...v1.150.1

However, digging into this, this code is just adjusting the width that's used and doesn't actually cause any more resizes than what was happening before. From what I can tell, this code somehow changes the timing and that is what is making the test fail. Removing other unrelated tests in the same file will make the failing test pass.

It seems like Safari's ResizeObserver reporter code gets mad if we try to close the dropdown or end the test before it's done telling us things. From my testing, this update will fix the test: BrightspaceUILabs/facet-filter-sort#85

But this issue may still be valid - it seems we run the resize code in dropdown three times with the same width.