Contact emailsfuth...@chromium.org

Explainer
https://github.com/chrishtr/rendering/blob/master/entry-exit-animations.md

Specification
https://drafts.csswg.org/css-transitions-2/#defining-before-change-style-the-starting-style-rule

Summary

Allow authors to start CSS transitions on first style update CSS
transitions do not trigger transitions from initial styles on the first
style update for an element, or when the display type changes from 'none'
to some other type. That is done to avoid unexpected transitions from
initial styles. If the author wants to start a transition from the first
style update, that can now be done by applying styles from within a
@starting-style rule. If there is no pre-existing style for an element, but
there are selectors inside @starting-style rules that match the element, a
style is computed with rules inside @starting-style matching, before the
actual style is computed without @starting-style rules matching. Any
differences in computed style for transitioned properties will trigger
transitions between the styles with and without @starting-style rules
applied. Example which starts a background-color transition from green to
lime on the first style update for a div: div { transition:
background-color 0.5s; background-color: lime; } @starting-style div {
background-color: green; } }


Blink componentBlink>CSS
<https://bugs.chromium.org/p/chromium/issues/list?q=component:Blink%3ECSS>

TAG reviewhttps://github.com/w3ctag/design-reviews/issues/829

TAG review statusPending

Risks


Interoperability and Compatibility



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

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

*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?



Debuggability



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

Is this feature fully tested by web-platform-tests
<https://chromium.googlesource.com/chromium/src/+/main/docs/testing/web_platform_tests.md>
?Yes

https://wpt.live/css/css-transitions/starting-style-cascade.html
https://wpt.live/css/css-transitions/starting-style-name-defining-rules.html
https://wpt.live/css/css-transitions/starting-style-rule-basic.html
https://wpt.live/css/css-transitions/starting-style-rule-none.html
https://wpt.live/css/css-transitions/starting-style-rule-pseudo-elements.html
https://wpt.live/css/css-transitions/starting-style-size-container.html

Flag name#enable-experimental-web-platform-features

Requires code in //chrome?False

Tracking bughttps://crbug.com/1412851

Measurement
https://chromestatus.com/metrics/feature/popularity#CSSAtRuleStartingStyle

Estimated milestones
Shipping on desktop 117
DevTrial on desktop 115
Shipping on Android 117
DevTrial on Android 115

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).


Link to entry on the Chrome Platform Status
https://chromestatus.com/feature/4515377717968896

Links to previous Intent discussionsIntent to prototype:
https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CACuPfeS2468yfK2EzrnmiKrnyScCYfbiSF7C6aC3pix7G_XOkQ%40mail.gmail.com

This intent message was generated by Chrome Platform Status
<https://chromestatus.com/>.

-- 
Rune Lillesveen

-- 
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+unsubscr...@chromium.org.
To view this discussion on the web visit 
https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CACuPfeRwqi%2BMg3_pCTR48N8UCnuNhQh_r7gFFmsCszp-ArAGcQ%40mail.gmail.com.

Reply via email to