Intent to Ship: View transition pseudos inherit animation-delay.

[Chromestatus]

Contact emails

vmp...@chromium.org

Explainer

None

Specification

https://www.w3.org/TR/css-view-transitions-2

Summary

View Transitions project adds a tree of pseudo elements that have various animations applied to them. For ease of development and customization some niceties are provided, such as inheriting animation-duration. This feature adds another nicety: inherit animation-delay.

Blink component

Blink>ViewTransitions

TAG review

None

TAG review status

Not applicable

Risks

Interoperability and Compatibility

There's a small risk that developers rely on this properly not being inherited into the new/old pseudo elements from the group. However, it's unlikely since the animations are designed to work in unison. This is the reason for inheriting animation-duration, for example. This, and the fact that both Safari and Firefox are shipping this behavior makes me confident that the risk is minimal.

Gecko: Shipped/Shipping (https://github.com/w3c/csswg-drafts/issues/9817#issuecomment-2994352828)

WebKit: Shipped/Shipping (https://github.com/w3c/csswg-drafts/issues/9817#issuecomment-2994352828)

Web developers: No signals

Other signals:

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

None

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/style-inheritance.html?label=master&label=experimental&aligned (WebKit recently added animation-delay subtest which may not have been included in the results yet)

Flag name on about://flags

None

Finch feature name

ViewTransitionAnimationDelayInherit

Rollout plan

Will ship enabled for all users

Requires code in //chrome?

False

Estimated milestones

Shipping on desktop	140
Shipping on Android	140
Shipping on WebView	140

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/5424291457531904?gate=5271493935890432

This intent message was generated by Chrome Platform Status.

[Chris Harrelson]

LGTM1

--
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/685b4fa9.170a0220.3bfb97.0260.GAE%40google.com.

[Alex Russell]

LGTM2. Is there good documentation (e.g. in MDN) about which properties are inherited and from where? And how do CSS custom properties inherit in this parallel tree?

To unsubscribe from this group and stop receiving emails from it, send an email to blink-dev+unsubscribe@chromium.org.

[Vladimir Levin]

On Wednesday, June 25, 2025 at 11:28:33 AM UTC-4 Alex Russell wrote:

LGTM2. Is there good documentation (e.g. in MDN) about which properties are inherited and from where? And how do CSS custom properties inherit in this parallel tree?

Custom properties don't have any special treatment in this tree, so :root, which is the originating element can specify the custom props for this tree. I don't think there's currently good documentation. CSSWG is still working to resolve on further properties to be inherited through this (like timing function). When all of the obvious items are resolved on, I can take on an action item to ensure documentation is updated.

Thanks!

Vlad

[Mike Taylor]

LGTM3

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/79613ff4-3f94-4e06-8eaf-1242f6b41609n%40chromium.org.