Re: [csswg-drafts] [css-view-transitions-2] Distinguish between old and new DOM in CSS (#9424)

@noamr Yeah `pushState` is effectively for us like a multi-page app navigation. Many things can change and a page's contents might be getting composed by 3 or 4 different teams. Many times we use a server driven section based system, where we don't know ahead of time the page contents or even the container.

Think a product details page that might be different for plus, lux, experiences, etc or search through different things. It might be in search or in a product details page or a details preview embedded in another screen.

What we _do_ know generally during the triggering of the transition is the general semantic elements. Since a target shared element can be in 20+ animations and continue to grow, it's hard to be certain about a specific DOM structure. That's why the old/new switch is so nice for us.

That said, it's far from impossible. We make it work today. We do redefine startViewTransition to make this following snippet possible.

```tsx
${Transition.map({ screen: '--screen-panel' })}
${Transition.map({
  box: {
    old: '--box-pdp',
    new: '--box-checkout'
  }
})}
```

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


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

Received on Monday, 2 October 2023 16:34:00 UTC