Find a way to react on "display: none" and related style changes

[hmans]

trafficstars

...because some frameworks make use of this (eg Alpine.js), and it would be cool to have our elements react to this category of style changes.

[CodyJasonBennett]

To sync three events with this style, we'd have to toggle their events by not raycasting hidden elements. Not sure what else other than only traversing visible elements internally.

[hmans]

To sync three events with this style, we'd have to toggle their events by not raycasting hidden elements.

Yup, and probably a lot of other things! The first challenge is figuring out a good way to actually interact with the styles set on an element. I haven't tested this yet, but I'm assuming that the modification of a property of the style property -- like element.style.display = "none" -- will never trigger our attributeChangedCallback.

The most naive implementation I could think of would involve checking the property on every frame, but I'm not sure about the performance ramifications.

Maybe it might be possible to wrap an element's style property in a Proxy instance after instantiation?

Either way, I intend to do some experimenting with these ideas some time soon, once I find the time.