Post

If you thought we were done with View Transitions, guess again! A feature Chrome is working on, is “Scoped View Transitions”, which allow you to scope a VT to a subtree of the DOM. This unlocks things like concurrent transitions and prevents layering issues. developer.chrome.com/blog/scoped-...

In the video you can see how document-scoped and element-scoped transitions behave. When using the latter, the blue dot remains clipped by the scope; the popover remains visible on top of the scope; and the rest of the DOM remains interactive.

You can try out Scoped View Transitions in Chrome 140+ with experimental web platform features. We are actively looking for feedback on this one. Find all info (and a list of known issues) in developer.chrome.com/blog/scoped-....

By design they should "just work" with the view-transition-name matching working only within the scope. I haven't tested this myself though.

iirc thats how it worked with regular view transitions, and then something changed and VTs broke in shadow roots 🙃

What happened is that we've made view-transition names shadow-scoped at some point, so after that you couldn't make document-scoped view-transition that pierce shadow roots, and have to use ::part for that. But if the whole view-transition is scoped inside the shadow you should be fine methinks.

shhh we don't talk about shadow roots

No we do. And apparently this is specifically the time to do it.