Re: [csswg-drafts] [css-view-transitions-1] Should view transition names be tree scoped? (#10145)

> Thanks for sharing! Do your transitions cross shadow boundaries (an element in a shadow transitions into an element in another shadow/light DOM etc) or it's more like wanting transitions within the same shadow root to work?

The transitions cross shadow boundaries. `view-transition-name`s are set on components nested a few levels deep within a container's shadow root, and the same `view-transition-name` will be set on different elements, in different shadow roots, between the start and end state of the transition.

However, there is still a "transition container" element that contains every transitioned element within its shadow root (or its children's shadow roots, or their children's, etc). I feel like `::part` could still work within the "transition container" here, provided the correct chain of `exportparts` is used on the nested children. Then we would move all `view-transition-name`s definitions into the CSSStyleSheet that's adopted by the "transition container" element. (It would also be nice to define the transition itself in that same style sheet, but for now all `::view-transition-*` selectors have to be in a separate style sheet adopted by the document.)

The main pain point remains that we would also have to modify the whole chain of ancestor elements, from the "transition container" all the way up to the root of the document, to use `exportparts` on them as well to make things work with `document.startViewTransition`.

And it would make it harder to move the `view-transition-name`s between the start and end state of the transition: before Chrome 126, some JavaScript could directly set (or remove) the names (or CSS classes) on the appropriate elements during the View Transition update callback. Now, that JS would have to set (or remove) `part`s instead, and we'd have to make sure they're exported through all ancestors, and set the names from the document.

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


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

Received on Tuesday, 2 July 2024 06:50:24 UTC