Support pseudo-elements

[siddharth-kaushik]

Safari v17.5
Using named view-timeline on parent (larger than scroll-port) to animate one of the child with animation range.

Sometime seeing below errors (one or the other) on load in Safari. Sometimes loads just fine and works fine on Firefox 🤷‍♂️

👇 A

👇 B

[bramus]

As for B: are you animating a pseudo-element (::before or ::after) by any chance?

[siddharth-kaushik]

Yes, one of the element is a pseudo element.

Edit: The view-timeline is used by a regular element but the animation itself updates the css variables that is used by pseudo element after

Link:

[bramus]

OK, that would be the underlying problem that needs to get fixed. Core of the issue is that in JavaScript there is no proper API to get pseudo-elements. The Web Animations API has a workaround for this built-in, but that’s currently not used here.