Bug 1778983 - Ensure we cancel transitions without the need of an extra flush. r=boris

When something switches to display: none, right now we rely on
StopAnimationsForElementsWithoutFrames(), which posts a restyle and the
previous ProcessPendingRestyles call was papering over it.

For other elements in the display none subtree it doesn't matter,
because we don't keep their styles around, but for the display: none
element themselves we do need to update transitions on time.

We could, possibly more generally, remove
StopAnimationsForElementsWithoutFrames() altogether and cancel
animations when we clear style data, perhaps... But that's probably
worth a follow-up.

Differential Revision: https://phabricator.services.mozilla.com/D151600

layout/style/nsAnimationManager.cpp

@@ -32,7 +32,6 @@
 using namespace mozilla;
 using namespace mozilla::css;
 using mozilla::dom::Animation;
-using mozilla::dom::AnimationEffect;
 using mozilla::dom::AnimationPlayState;
 using mozilla::dom::CSSAnimation;
 using mozilla::dom::Element;

layout/style/nsTransitionManager.cpp

@@ -59,6 +59,11 @@ bool nsTransitionManager::UpdateTransitions(dom::Element* aElement,
     return false;
   }
 
+  if (aNewStyle.StyleDisplay()->mDisplay == StyleDisplay::None) {
+    StopAnimationsForElement(aElement, aPseudoType);
+    return false;
+  }
+
   CSSTransitionCollection* collection =
       CSSTransitionCollection::GetAnimationCollection(aElement, aPseudoType);
   return DoUpdateTransitions(*aNewStyle.StyleUIReset(), aElement, aPseudoType,

servo/components/style/gecko/wrapper.rs

@@ -1650,6 +1650,12 @@ impl<'le> TElement for GeckoElement<'le> {
 
         let after_change_ui_style = after_change_style.get_ui();
         let existing_transitions = self.css_transitions_info();
+
+        if after_change_style.get_box().clone_display().is_none() {
+            // We need to cancel existing transitions.
+            return !existing_transitions.is_empty();
+        }
+
         let mut transitions_to_keep = LonghandIdSet::new();
         for transition_property in after_change_style.transition_properties() {
             let physical_longhand = transition_property

servo/components/style/matching.rs

@@ -347,7 +347,7 @@ trait PrivateMatchMethods: TElement {
             return false;
         }
 
-        if new_style.clone_display().is_none() || old_style.clone_display().is_none() {
+        if old_style.clone_display().is_none() {
             return false;
         }