Intent to Ship: Nested view transitions

[Chromestatus]

Contact emails

nrose...@chromium.org, vmp...@chromium.org

Explainer

https://github.com/WICG/view-transitions/blob/main/nested-explainer.md

Specification

https://www.w3.org/TR/css-view-transitions-2/#view-transition-group-prop

Summary

Allow view-transitions to generate a nested pseudo-element tree rather than a flat one. This allows the view transition to appear more in line with its original elements and visual intent, as it enables clipping, nested 3D transforms, and proper application of effects like opacity, masking and filters.

Blink component

Blink>CSS

TAG review

https://github.com/w3ctag/design-reviews/issues/1061

TAG review status

Pending

Risks

Interoperability and Compatibility

None

Gecko: No signal (https://github.com/mozilla/standards-positions/issues/1183)

WebKit: No signal (https://github.com/WebKit/standards-positions/issues/466)

Web developers: Positive This feature allows more expressiveness to view transitions and has been requested by some developers in order to support clipping of transitioning elements

Other signals:

Ergonomics

None

Activation

This feature can be used directly. The fallback case for non-supporting browsers would be a default View Transition, which does not have nesting. This can look visually wrong, but the use of `view-transition-group` can be feature detected and an appropriate style changes can be made to avoid the visual problems

Security

None

WebView application risks

Does this intent deprecate or change behavior of existing APIs, such that it has potentially high risk for Android WebView-based applications?

None

Debuggability

This feature is debuggable same as View Transitions (the pseudo tree) and as other CSS properties (view-transition-group property)

Will this feature be supported on all six Blink platforms (Windows, Mac, Linux, ChromeOS, Android, and Android WebView)?

Yes

Is this feature fully tested by web-platform-tests?

Yes

https://wpt.fyi/results/css/css-view-transitions/nested?label=master&label=experimental&aligned

Flag name on about://flags

NestedViewTransition

Finch feature name

None

Non-finch justification

None

Requires code in //chrome?

False

Tracking bug

https://issuetracker.google.com/399431227

Measurement

Use counted as a CSS property

Estimated milestones

Shipping on desktop	136
Shipping on Android	136
Shipping on WebView	136

Anticipated spec changes

Open questions about a feature may be a source of future web compat or interop issues. Please list open issues (e.g. links to known github issues in the project for the feature specification) whose resolution may introduce web compat/interop risk (e.g., changing to naming or structure of the API in a non-backward-compatible way).

None

Link to entry on the Chrome Platform Status

https://chromestatus.com/feature/5162799714795520?gate=5146067595952128

Links to previous Intent discussions

Intent to Prototype: https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CAJn%3DMYbbu3XBRsEsokxh0MhkAtaZijmN7%3Dd9yGVcWdFYYW8MJg%40mail.gmail.com

This intent message was generated by Chrome Platform Status.

[Dan Clark]

Something about the WPT results was surprising to me. It looks like Firefox is passing all of them, even in stable (https://wpt.fyi/results/css/css-view-transitions/nested?label=master&label=stable&aligned), despite not having shipped view transitions more generally yet: https://wpt.fyi/results/css/css-view-transitions?label=master&label=experimental&view=interop&q=label%3Ainterop-2025-view-transitions. I'm pretty sure Firefox hasn't shipped this, so is there an issue with the tests?

-- Dan

[Noam Rosenthal]

On Fri, Feb 28, 2025 at 10:18 PM 'Dan Clark' via blink-dev <blin...@chromium.org> wrote:

Something about the WPT results was surprising to me. It looks like Firefox is passing all of them, even in stable (https://wpt.fyi/results/css/css-view-transitions/nested?label=master&label=stable&aligned), despite not having shipped view transitions more generally yet: https://wpt.fyi/results/css/css-view-transitions?label=master&label=experimental&view=interop&q=label%3Ainterop-2025-view-transitions. I'm pretty sure Firefox hasn't shipped this, so is there an issue with the tests?

Yea, those tests pass when there is no view-transition support at all and fail when there is view-transition support without this additional feature on top.

They could definitely be improved to avoid this confusion.

I don't think this is material for the interoperability for this feature as no one would implement this before implementing classic flat view transition groups, but it should also be a simple fix to the tests.

[Chris Harrelson]

LGTM1

It'd be good to improve the tests.

--
You received this message because you are subscribed to the Google Groups "blink-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blink-dev+...@chromium.org.
To view this discussion visit https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CAJn%3DMYa0Q1%2BX6vj8mBU3ne6sJbUxRF7%3Dx7Ye6CYxDd_egVONGQ%40mail.gmail.com.

[Mike Taylor]

LGTM2.

Maybe toss something like assert_true(CSS.supports('selector(::view-transition)')) somewhere and call it a day.

To view this discussion visit https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CAOMQ%2Bw9e40kSnTzFKr196%3D655yrwQ5U2eaBysGED2KvQBXdF_Q%40mail.gmail.com.

[Noam Rosenthal]

On Mon, Mar 10, 2025 at 8:50 PM Mike Taylor <mike...@chromium.org> wrote:

LGTM2.

Maybe toss something like assert_true(CSS.supports('selector(::view-transition)')) somewhere and call it a day.

Re. the tests - it seems like a strange infra issue on the Firefox side, locally the tests fail as expected on firefox. I am checking this with the Firefox WPT infra folks.

[Noam Rosenthal]

Checked this with the Firefox folks, it's indeed a bug in the Firefox test harness. Filed https://bugzilla.mozilla.org/show_bug.cgi?id=1953210. 

[Yoav Weiss (@Shopify)]

LGTM3