[Bug]: OverlayTrigger can get stuck in a render loop causing page crash

[jcmitch]

Code of conduct

• I agree to follow this project's code of conduct.

Impacted component(s)

OverlayTrigger

Expected behavior

OverlayTrigger should render as expected regardless of quick successive updates to slot content.

Actual behavior

Been struggling with an issue related to OverlayTrigger for awhile so posting here to see if anyone more familiar with how it works might have some ideas of what might be happening.

We have an app that uses OverlayTrigger but when rendering it gets in an infinite render loop causing the page to crash. This only happens when upgrading to the newer (not really "new" anymore) overlay approach in SWC. I've been able to track it down to a few places in the SWC code. Basically, it gets stuck in a loop of update, render, updated that never exits. I've been able to place logs in the SWC code to see this.

The update method from lit provides the map of changed properties and it seems that sometimes it is empty and sometimes it has hoverContent (which is the trigger I'm attempting to use). It alternates between these two states but sometimes will see a few empty objects before hoverContent pops in again. This does happen on initial render where logs in my code (outside of SWC) show 3 quick successive renders as everything gets setup. It does quickly settle to what appears to be a stable state on my end but by this point overlay-trigger is stuck in the loop.

The loop seems like it could be caused by the fact that render calls renderHoverOverlay, which calls renderSlot, which listens slotchange event and when handled calls handleSlotContent, which sets hoverContent, which triggers update, which then triggers render, which seems to start to loop again. It seems like if the content in the "hover" slot isn't changing then it shouldn't be looping or at least only loop for the 3 initial renders I would expect to cause this update.
I've tried to repo this in a codesandbox but have been unsuccessful so far, everything appears to work fine outside of the app we're testing in. It seems like there is something specific about this setup that I'm missing when trying to isolate the issue.

Screenshots

No response

What browsers are you seeing the problem in?

Firefox, Chrome, Safari, Microsoft Edge

How can we reproduce this issue?

No response

Sample code or abstract reproduction which illustrates the problem

No response

Severity

SEV 2

Logs taken while reproducing problem

No response