Summary:
Per CSSWG resolution, the `display` property is now discretely animatable, in both CSS animations and transitions. The resolution also specifies that an element animating to `display: none` continues running its own animations, while animations on its descendants are cancelled.
This lets developers write exit animations entirely in CSS: an element can animate out and then automatically become `display: none`, with no JavaScript needed to flip the property once the animation finishes.
Bug: Bug 1834877
Specification:
css-display-4 (animation type of display property)
Standards Body: CSSWG / W3C
Platform coverage: All.
Preference: layout.css.display-animations.enabled (defaults to false)
DevTools bug: N/A
Extensions bug: N/A
Use counter: N/A - wouldn't distinguish animated display from ordinary usage.
Standards-Positions Discussion: https://github.com/mozilla/standards-positions/issues/762
Other browsers:
web-platform-tests:
https://wpt.fyi/results/css/css-animations/display-none-dont-cancel-pseudo.tentative.html
https://wpt.fyi/results/css/css-animations/display-none-dont-cancel.tentative.html
https://wpt.fyi/results/css/css-transitions/CSSTransition-not-canceling.tentative.html