- From: Bramus via GitHub <noreply@w3.org>
- Date: Wed, 28 Jan 2026 22:51:36 +0000
- To: public-css-archive@w3.org
bramus has just created a new issue for https://github.com/w3c/csswg-drafts:
== [css-view-transitions-1] WAAPI-created animations on view transition pseudos don’t get cleared when the view transition gets skipped ==
In https://codepen.io/bramus/pen/JoKMaEd/5b12099cd1f907ac44d63e13a0aacce1 I am animating the `::view-transition-group(box)` pseudo using the Web Animations API instead of using CSS.
The code is as follows:
```css
::view-transition-group(box) {
animation-name: none;
}
```
```js
document.addEventListener('click', async (e) => {
const t = document.startViewTransition(() => {});
await t.ready;
document.documentElement.animate(
{
translate: [
`0px 0px`,
`100px 0px`,
],
},
{
duration: 1000,
easing: 'ease',
pseudoElement: '::view-transition-group(box)',
}
);
});
```
What caught me off guard here is that when an ongoing view transition gets interrupted, the animations keep on existing. You can do that in the demo by doing consecutive clicks.
My expectation here would be that whenever a new View Transition gets started, the (WAAPI) animations added to the pseudos of the previous View Transition would be cleared as well, as it is a different View Transition (and the `view-transition-name` could be set on a totally different element).
I talked to @emilio about this, and this apparently is the general way how pseudos work because the originating element of those pseudos remains the same. Perhaps for View Transitions we need to change this behavior and anchor things on the VT instance instead of the originating element? I.e. this would clear the WAAPI-created animations when a different VT starts.
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/13409 using your GitHub account
--
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Wednesday, 28 January 2026 22:51:37 UTC