[css-view-transitions-2] Conditionally choose participating elements when onscreen in both DOM states #9354
Description
Consider the following case:
- There is a header in the old DOM which may or may not be onscreen in the new DOM. For example, the page is scrolled because its a fragment navigation.
- If the header is in both DOMs, you want a position animation between the 2.
- If the header is only in the old DOM, you want it to animate with its parent. As if it was never tagged with a name.
The above is very difficult to achieve. Once you've tagged something in the old DOM, it will generate its own ::view-transition-group and will be in a separate snapshot. Authors could try to set a custom animation so the group for the header, making it as-if it's still embedded in its parent's snapshot. But that's very hard, you need to replicate a bunch of animations (transform, opacity, filter) being applied to the VT pseudo displaying the parent's snapshot.
We can add a new CSS property to have the browser do this. Even if it captured a child as a separate snapshot, don't generate pseudos for it unless the name is on both sides. And render it as-if its still embedded within its parent's snapshot.