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.