Re: [csswg-drafts] [css-view-transitions-1] Can we make the `::view-transition-old` and `::view-transition-new` pseudos “:has-allowed pseudo-element”s? (#12630)

Hi, just adding another concrete use‑case:

I’m working with View Transitions in an MPA, and I rely on selectors like:


```css
::view-transition-new(prototype-window):only-child {
  animation: vt-prototype-window-in 600ms var(--out-quart) forwards;
}
```

This works great for parent‑level “enter” animations, it only triggers when prototype-window is entering and is the only child in its group.

I’ve now added a nested group inside that element, and I want the child group to run the same “enter” animation only when the parent is also entering.

In other words:

I need to animate the child group conditionally, based on whether the parent has a ::view-transition-new state.

What I wish I could write is something like:


```css
::view-transition-group-children(prototype-window):has(
  ~ ::view-transition-image-pair(prototype-window)
    > ::view-transition-old(prototype-window):only-child
) {
  animation: vt-prototype-window-in ...
}
```

But since pseudo‑elements can’t be used inside :has(), this isn’t possible today.

Allowing these pseudos inside :has() would unlock conditional enter/exit animations for nested groups, which is really valuable for more complex View Transition setups.

-- 
GitHub Notification of comment by KevinGrajeda
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/12630#issuecomment-3657961934 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Monday, 15 December 2025 23:02:40 UTC