Backed out 2 changesets (bug 1278136) for failures in no-stacking-context-opacity-removing-animation-in-delay.html
authorPhil Ringnalda <philringnalda@gmail.com>
Tue, 11 Oct 2016 20:40:36 -0700
changeset 317481 fdf29e912685ecd840014334094ba5be7d9ef274
parent 317480 2b520bbe1d527b1102233cb91b52dcc77f2f89eb
child 317482 aa789d732c6c2a7c17bf96dff3fecddc91afc3ab
push id82673
push userphilringnalda@gmail.com
push dateWed, 12 Oct 2016 03:40:51 +0000
treeherdermozilla-inbound@fdf29e912685 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
bugs1278136
milestone52.0a1
backs out62cf4a7d6007e3f0b1da0f0590c81a17791ec898
5f2db29e67ca5e8542675bf41b795eb107fda262
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Backed out 2 changesets (bug 1278136) for failures in no-stacking-context-opacity-removing-animation-in-delay.html Backed out changeset 62cf4a7d6007 (bug 1278136) Backed out changeset 5f2db29e67ca (bug 1278136) MozReview-Commit-ID: K9WcZFjL2XB
dom/animation/EffectCompositor.cpp
dom/animation/KeyframeEffectReadOnly.cpp
dom/animation/KeyframeEffectReadOnly.h
layout/base/RestyleManager.cpp
layout/base/nsDisplayList.cpp
layout/base/nsLayoutUtils.cpp
layout/base/nsLayoutUtils.h
layout/generic/nsFrame.cpp
layout/reftests/bugs/reftest.list
layout/reftests/css-animations/no-stacking-context-opacity-removing-animation-in-delay.html
layout/reftests/css-animations/no-stacking-context-transform-removing-animation-in-delay.html
layout/reftests/css-animations/reftest.list
layout/reftests/css-animations/stacking-context-lose-opacity-1.html
layout/reftests/css-animations/stacking-context-lose-transform-none.html
layout/reftests/css-animations/stacking-context-opacity-removing-important-in-delay.html
layout/reftests/css-animations/stacking-context-opacity-win-in-delay-on-main-thread.html
layout/reftests/css-animations/stacking-context-opacity-win-in-delay.html
layout/reftests/css-animations/stacking-context-opacity-wins-over-transition.html
layout/reftests/css-animations/stacking-context-transform-removing-important-in-delay.html
layout/reftests/css-animations/stacking-context-transform-win-in-delay-on-main-thread.html
layout/reftests/css-animations/stacking-context-transform-win-in-delay.html
layout/reftests/css-animations/stacking-context-transform-wins-over-transition.html
layout/reftests/css-transitions/no-stacking-context-transition-ref.html
layout/reftests/css-transitions/reftest.list
layout/reftests/css-transitions/stacking-context-opacity-lose-to-animation.html
layout/reftests/css-transitions/stacking-context-opacity-wins-over-important-style.html
layout/reftests/css-transitions/stacking-context-transform-lose-to-animation.html
layout/reftests/css-transitions/stacking-context-transform-wins-over-important-style.html
layout/reftests/css-transitions/stacking-context-transition-ref.html
layout/reftests/web-animations/reftest.list
layout/reftests/web-animations/stacking-context-opacity-losing-css-animation-in-delay.html
layout/reftests/web-animations/stacking-context-transform-losing-css-animation-in-delay.html
--- a/dom/animation/EffectCompositor.cpp
+++ b/dom/animation/EffectCompositor.cpp
@@ -143,17 +143,17 @@ FindAnimationsForCompositor(const nsIFra
         aMatches->Clear();
       }
       EffectCompositor::SetPerformanceWarning(
         aFrame, aProperty,
         AnimationPerformanceWarning(warningType));
       return false;
     }
 
-    if (!effect->HasEffectiveAnimationOfProperty(aProperty)) {
+    if (!effect->HasAnimationOfProperty(aProperty)) {
       continue;
     }
 
     if (aMatches) {
       aMatches->AppendElement(animation);
     }
     foundSome = true;
   }
--- a/dom/animation/KeyframeEffectReadOnly.cpp
+++ b/dom/animation/KeyframeEffectReadOnly.cpp
@@ -187,18 +187,17 @@ KeyframeEffectReadOnly::SetKeyframes(nsT
 
   if (aStyleContext) {
     UpdateProperties(aStyleContext);
     MaybeUpdateFrameForCompositor();
   }
 }
 
 const AnimationProperty*
-KeyframeEffectReadOnly::GetEffectiveAnimationOfProperty(
-  nsCSSPropertyID aProperty) const
+KeyframeEffectReadOnly::GetAnimationOfProperty(nsCSSPropertyID aProperty) const
 {
   if (!IsInEffect()) {
     return nullptr;
   }
 
   EffectSet* effectSet =
     EffectSet::GetEffectSet(mTarget->mElement, mTarget->mPseudoType);
   for (size_t propIdx = 0, propEnd = mProperties.Length();
@@ -215,27 +214,16 @@ KeyframeEffectReadOnly::GetEffectiveAnim
         result = nullptr;
       }
       return result;
     }
   }
   return nullptr;
 }
 
-bool
-KeyframeEffectReadOnly::HasAnimationOfProperty(nsCSSPropertyID aProperty) const
-{
-  for (const AnimationProperty& property : mProperties) {
-    if (property.mProperty == aProperty) {
-      return true;
-    }
-  }
-  return false;
-}
-
 #ifdef DEBUG
 bool
 SpecifiedKeyframeArraysAreEqual(const nsTArray<Keyframe>& aA,
                                 const nsTArray<Keyframe>& aB)
 {
   if (aA.Length() != aB.Length()) {
     return false;
   }
@@ -933,22 +921,20 @@ KeyframeEffectReadOnly::CanThrottle() co
   }
 
   // First we need to check layer generation and transform overflow
   // prior to the property.mIsRunningOnCompositor check because we should
   // occasionally unthrottle these animations even if the animations are
   // already running on compositor.
   for (const LayerAnimationInfo::Record& record :
         LayerAnimationInfo::sRecords) {
-    // Skip properties that are overridden by !important rules.
-    // (GetEffectiveAnimationOfProperty, as called by
-    // HasEffectiveAnimationOfProperty, only returns a property which is
-    // neither overridden by !important rules nor overridden by other
-    // animation.)
-    if (!HasEffectiveAnimationOfProperty(record.mProperty)) {
+    // Skip properties that are overridden in the cascade.
+    // (GetAnimationOfProperty, as called by HasAnimationOfProperty,
+    // only returns an animation if it currently wins in the cascade.)
+    if (!HasAnimationOfProperty(record.mProperty)) {
       continue;
     }
 
     EffectSet* effectSet = EffectSet::GetEffectSet(mTarget->mElement,
                                                    mTarget->mPseudoType);
     MOZ_ASSERT(effectSet, "CanThrottle should be called on an effect "
                           "associated with a target element");
     layers::Layer* layer =
--- a/dom/animation/KeyframeEffectReadOnly.h
+++ b/dom/animation/KeyframeEffectReadOnly.h
@@ -230,35 +230,22 @@ public:
   void NotifyAnimationTimingUpdated();
 
   void SetAnimation(Animation* aAnimation) override;
 
   void SetKeyframes(JSContext* aContext, JS::Handle<JSObject*> aKeyframes,
                     ErrorResult& aRv);
   void SetKeyframes(nsTArray<Keyframe>&& aKeyframes,
                     nsStyleContext* aStyleContext);
-
-  // Returns true if the effect includes |aProperty| regardless of whether the
-  // property is overridden by !important rule.
-  bool HasAnimationOfProperty(nsCSSPropertyID aProperty) const;
-
-  // GetEffectiveAnimationOfProperty returns AnimationProperty corresponding
-  // to a given CSS property if the effect includes the property and the
-  // property is not overridden by !important rules.
-  // Also EffectiveAnimationOfProperty returns true under the same condition.
-  //
-  // NOTE: We don't currently check for !important rules for properties that
-  // can't run on the compositor.
-  bool HasEffectiveAnimationOfProperty(nsCSSPropertyID aProperty) const
+  const AnimationProperty*
+  GetAnimationOfProperty(nsCSSPropertyID aProperty) const;
+  bool HasAnimationOfProperty(nsCSSPropertyID aProperty) const
   {
-    return GetEffectiveAnimationOfProperty(aProperty) != nullptr;
+    return GetAnimationOfProperty(aProperty) != nullptr;
   }
-  const AnimationProperty* GetEffectiveAnimationOfProperty(
-    nsCSSPropertyID aProperty) const;
-
   const InfallibleTArray<AnimationProperty>& Properties() const
   {
     return mProperties;
   }
 
   // Update |mProperties| by recalculating from |mKeyframes| using
   // |aStyleContext| to resolve specified values.
   void UpdateProperties(nsStyleContext* aStyleContext);
--- a/layout/base/RestyleManager.cpp
+++ b/layout/base/RestyleManager.cpp
@@ -1564,17 +1564,18 @@ ElementRestyler::AddLayerChangesForAnima
     // hint for such animations in each tick, i.e. restyles in each tick. As
     // a result, we usually do restyles for such animations in every tick on
     // the main-thread.  The only animations which will be affected by this
     // explicit change hint are animations that have opacity/transform but did
     // not have those properies just before. e.g,  setting transform by
     // setKeyframes or changing target element from other target which prevents
     // running on the compositor, etc.
     if (!layer &&
-        nsLayoutUtils::HasEffectiveAnimation(mFrame, layerInfo.mProperty)) {
+        nsLayoutUtils::HasRelevantAnimationOfProperty(mFrame,
+                                                      layerInfo.mProperty)) {
       hint |= layerInfo.mChangeHint;
     }
   }
   if (hint) {
     mChangeList->AppendChange(mFrame, mContent, hint);
   }
 }
 
--- a/layout/base/nsDisplayList.cpp
+++ b/layout/base/nsDisplayList.cpp
@@ -482,31 +482,31 @@ AddAnimationsForProperty(nsIFrame* aFram
       continue;
     }
 
     dom::KeyframeEffectReadOnly* keyframeEffect =
       anim->GetEffect() ? anim->GetEffect()->AsKeyframeEffect() : nullptr;
     MOZ_ASSERT(keyframeEffect,
                "A playing animation should have a keyframe effect");
     const AnimationProperty* property =
-      keyframeEffect->GetEffectiveAnimationOfProperty(aProperty);
+      keyframeEffect->GetAnimationOfProperty(aProperty);
     if (!property) {
       continue;
     }
 
     // Note that if the property is overridden by !important rules,
-    // GetEffectiveAnimationOfProperty returns null instead.
+    // GetAnimationOfProperty returns null instead.
     // This is what we want, since if we have animations overridden by
     // !important rules, we don't want to send them to the compositor.
     MOZ_ASSERT(anim->CascadeLevel() !=
                  EffectCompositor::CascadeLevel::Animations ||
                !effects->PropertiesWithImportantRules()
                   .HasProperty(aProperty),
-               "GetEffectiveAnimationOfProperty already tested the property "
-               "is not overridden by !important rules");
+               "GetAnimationOfProperty already tested the property is not "
+               "overridden by !important rules");
 
     // Don't add animations that are pending if their timeline does not
     // track wallclock time. This is because any pending animations on layers
     // will have their start time updated with the current wallclock time.
     // If we can't convert that wallclock time back to an equivalent timeline
     // time, we won't be able to update the content animation and it will end
     // up being out of sync with the layer animation.
     //
--- a/layout/base/nsLayoutUtils.cpp
+++ b/layout/base/nsLayoutUtils.cpp
@@ -478,17 +478,17 @@ HasMatchingAnimations(const nsIFrame* aF
 bool
 nsLayoutUtils::HasActiveAnimationOfProperty(const nsIFrame* aFrame,
                                             nsCSSPropertyID aProperty)
 {
   return HasMatchingAnimations(aFrame,
     [&aProperty](KeyframeEffectReadOnly& aEffect)
     {
       return aEffect.IsCurrent() && aEffect.IsInEffect() &&
-        aEffect.HasEffectiveAnimationOfProperty(aProperty);
+        aEffect.HasAnimationOfProperty(aProperty);
     }
   );
 }
 
 bool
 nsLayoutUtils::HasCurrentTransitions(const nsIFrame* aFrame)
 {
   return HasMatchingAnimations(aFrame,
@@ -497,41 +497,28 @@ nsLayoutUtils::HasCurrentTransitions(con
       // Since |aEffect| is current, it must have an associated Animation
       // so we don't need to null-check the result of GetAnimation().
       return aEffect.IsCurrent() && aEffect.GetAnimation()->AsCSSTransition();
     }
   );
 }
 
 bool
-nsLayoutUtils::HasAnimationOfProperty(const nsIFrame* aFrame,
-                                      nsCSSPropertyID aProperty)
+nsLayoutUtils::HasRelevantAnimationOfProperty(const nsIFrame* aFrame,
+                                              nsCSSPropertyID aProperty)
 {
   return HasMatchingAnimations(aFrame,
     [&aProperty](KeyframeEffectReadOnly& aEffect)
     {
       return (aEffect.IsInEffect() || aEffect.IsCurrent()) &&
              aEffect.HasAnimationOfProperty(aProperty);
     }
   );
 }
 
-bool
-nsLayoutUtils::HasEffectiveAnimation(const nsIFrame* aFrame,
-                                     nsCSSPropertyID aProperty)
-{
-  return HasMatchingAnimations(aFrame,
-    [&aProperty](KeyframeEffectReadOnly& aEffect)
-    {
-      return (aEffect.IsInEffect() || aEffect.IsCurrent()) &&
-             aEffect.HasEffectiveAnimationOfProperty(aProperty);
-    }
-  );
-}
-
 static float
 GetSuitableScale(float aMaxScale, float aMinScale,
                  nscoord aVisibleDimension, nscoord aDisplayDimension)
 {
   float displayVisibleRatio = float(aDisplayDimension) /
                               float(aVisibleDimension);
   // We want to rasterize based on the largest scale used during the
   // transform animation, unless that would make us rasterize something
--- a/layout/base/nsLayoutUtils.h
+++ b/layout/base/nsLayoutUtils.h
@@ -2239,28 +2239,22 @@ public:
   /**
    * Returns true if the frame has any current CSS transitions.
    * A current transition is any transition that has not yet finished playing
    * including paused transitions.
    */
   static bool HasCurrentTransitions(const nsIFrame* aFrame);
 
   /**
-   * Returns true if |aFrame| has an animation of |aProperty| regardless of
-   * whether the property is overridden by !important rule.
+   * Returns true if the frame has current or in-effect (i.e. in before phase,
+   * running or filling) animations or transitions for the
+   * property.
    */
-  static bool HasAnimationOfProperty(const nsIFrame* aFrame,
-                                     nsCSSPropertyID aProperty);
-
-  /**
-   * Returns true if |aFrame| has an animation of |aProperty| which is
-   * not overridden by !important rules.
-   */
-  static bool HasEffectiveAnimation(const nsIFrame* aFrame,
-                                    nsCSSPropertyID aProperty);
+  static bool HasRelevantAnimationOfProperty(const nsIFrame* aFrame,
+                                             nsCSSPropertyID aProperty);
 
   /**
    * Checks if off-main-thread animations are enabled.
    */
   static bool AreAsyncAnimationsEnabled();
 
   /**
    * Checks if we should warn about animations that can't be async
--- a/layout/generic/nsFrame.cpp
+++ b/layout/generic/nsFrame.cpp
@@ -549,17 +549,18 @@ nsFrame::Init(nsIContent*       aContent
 
     if (HasAnyStateBits(NS_FRAME_IN_POPUP) && TrackingVisibility()) {
       // Assume all frames in popups are visible.
       IncApproximateVisibleCount();
     }
   }
   const nsStyleDisplay *disp = StyleDisplay();
   if (disp->HasTransform(this) ||
-      nsLayoutUtils::HasAnimationOfProperty(this, eCSSProperty_transform)) {
+      nsLayoutUtils::HasRelevantAnimationOfProperty(this,
+                                                    eCSSProperty_transform)) {
     // The frame gets reconstructed if we toggle the -moz-transform
     // property, so we can set this bit here and then ignore it.
     mState |= NS_FRAME_MAY_BE_TRANSFORMED;
   }
   if (disp->mPosition == NS_STYLE_POSITION_STICKY &&
       !aPrevInFlow &&
       !(mState & NS_FRAME_IS_NONDISPLAY) &&
       !disp->IsInnerTableStyle()) {
@@ -1134,30 +1135,31 @@ nsIFrame::GetMarginRectRelativeToSelf() 
 
 bool
 nsIFrame::IsTransformed() const
 {
   return ((mState & NS_FRAME_MAY_BE_TRANSFORMED) &&
           (StyleDisplay()->HasTransform(this) ||
            IsSVGTransformed() ||
            (mContent &&
-            nsLayoutUtils::HasAnimationOfProperty(this,
-                                                  eCSSProperty_transform) &&
+            nsLayoutUtils::HasRelevantAnimationOfProperty(
+              this, eCSSProperty_transform) &&
             IsFrameOfType(eSupportsCSSTransforms) &&
             mContent->GetPrimaryFrame() == this)));
 }
 
 bool
 nsIFrame::HasOpacityInternal(float aThreshold) const
 {
   MOZ_ASSERT(0.0 <= aThreshold && aThreshold <= 1.0, "Invalid argument");
   return StyleEffects()->mOpacity < aThreshold ||
          (StyleDisplay()->mWillChangeBitField & NS_STYLE_WILL_CHANGE_OPACITY) ||
          (mContent &&
-           nsLayoutUtils::HasAnimationOfProperty(this, eCSSProperty_opacity) &&
+           nsLayoutUtils::HasRelevantAnimationOfProperty(
+             this, eCSSProperty_opacity) &&
            mContent->GetPrimaryFrame() == this);
 }
 
 bool
 nsIFrame::IsSVGTransformed(gfx::Matrix *aOwnTransforms,
                            gfx::Matrix *aFromParentTransforms) const
 {
   return false;
@@ -2108,17 +2110,18 @@ nsIFrame::BuildDisplayListForStackingCon
   // need to have display items built for them.
   bool needEventRegions =
     aBuilder->IsBuildingLayerEventRegions() &&
     StyleUserInterface()->GetEffectivePointerEvents(this) !=
       NS_STYLE_POINTER_EVENTS_NONE;
   bool opacityItemForEventsAndPluginsOnly = false;
   if (effects->mOpacity == 0.0 && aBuilder->IsForPainting() &&
       !(disp->mWillChangeBitField & NS_STYLE_WILL_CHANGE_OPACITY) &&
-      !nsLayoutUtils::HasAnimationOfProperty(this, eCSSProperty_opacity)) {
+      !nsLayoutUtils::HasActiveAnimationOfProperty(this,
+                                                   eCSSProperty_opacity)) {
     if (needEventRegions ||
         aBuilder->WillComputePluginGeometry()) {
       opacityItemForEventsAndPluginsOnly = true;
     } else {
       return;
     }
   }
 
--- a/layout/reftests/bugs/reftest.list
+++ b/layout/reftests/bugs/reftest.list
@@ -804,17 +804,17 @@ fuzzy-if(skiaContent,1,600) == 393649-1.
 == 393671-2.html 393671-2-ref.html
 == 393671-3.html 393671-3-ref.html
 == 393760-1.xml 393760-1-ref.xml
 fuzzy-if(skiaContent,1,500) == 393760-2.xml 393760-2-ref.xml
 == 394111-1.html about:blank  # Really an assertion test rather than a rendering test
 == 394534-1.html 394534-1-ref.html
 == 394676-1.xhtml 394676-1-ref.xhtml
 == 395107-1.html 395107-1-ref.html
-fuzzy-if(Android,4,2) == 395107-2.html 395107-2-ref.html
+== 395107-2.html 395107-2-ref.html
 fuzzy-if(skiaContent,1,118) == 395107-3.html 395107-3-ref.html
 == 395107-4.html 395107-4-ref.html
 == 395107-5.html 395107-5-ref.html
 == 395130-1.html 395130-1-ref.html
 == 395130-2.html 395130-2-ref.html
 == 395331-1.xml 395331-1-ref.xml
 == 395390-1.html 395390-1-ref.html
 == 396286-1.html about:blank  # crash test
deleted file mode 100644
--- a/layout/reftests/css-animations/no-stacking-context-opacity-removing-animation-in-delay.html
+++ /dev/null
@@ -1,41 +0,0 @@
-<!DOCTYPE html>
-<html class="reftest-wait">
-<title>
-Removing CSS animation in delay phase destroys a stacking context
-</title>
-<style>
-span {
-  height: 100px;
-  width: 100px;
-  position: fixed;
-  background: green;
-  top: 50px;
-}
-@keyframes Opacity0 {
-  from, to { opacity: 0 }
-}
-#test {
-  width: 100px; height: 100px;
-  background: blue;
-  opacity: 1 ! important;
-}
-</style>
-<span></span>
-<div id="test"></div>
-<script>
-window.addEventListener("load", () => {
-  var target = document.getElementById("test");
-  target.style.animation = "Opacity0 100s 100s";
-  requestAnimationFrame(() => {
-    // Here we have CSS animation on 100% opacity style element, so
-    // there should be a stacking context.
-
-    target.style.animation = "";
-    requestAnimationFrame(() => {
-      // Now we have only 100% opacity style, so we should not create any
-      // stacking context.
-      document.documentElement.classList.remove("reftest-wait");
-    });
-  });
-});
-</script>
deleted file mode 100644
--- a/layout/reftests/css-animations/no-stacking-context-transform-removing-animation-in-delay.html
+++ /dev/null
@@ -1,42 +0,0 @@
-<!DOCTYPE html>
-<html class="reftest-wait">
-<title>
-Removing CSS animation in delay phase destroys stacking context
-</title>
-<style>
-span {
-  height: 100px;
-  width: 100px;
-  position: fixed;
-  background: green;
-  top: 50px;
-}
-@keyframes TransformNone {
-  from, to { transform: none }
-}
-#test {
-  width: 100px; height: 100px;
-  background: blue;
-  transform: none ! important;
-}
-</style>
-<span></span>
-<div id="test"></div>
-<script>
-window.addEventListener("load", () => {
-  var target = document.getElementById("test");
-  target.style.animation = "TransformNone 100s 100s";
-
-  requestAnimationFrame(() => {
-    // Here we have CSS animation on transform:none style element, so
-    // there should be a stacking context.
-
-    target.style.animation = "";
-    requestAnimationFrame(() => {
-      // Now we have only transform:none style, so we should not create any
-      // stacking context.
-      document.documentElement.classList.remove("reftest-wait");
-    });
-  });
-});
-</script>
--- a/layout/reftests/css-animations/reftest.list
+++ b/layout/reftests/css-animations/reftest.list
@@ -7,37 +7,27 @@ fails != print-no-animations.html print-
 == in-visibility-hidden-animation.html in-visibility-hidden-animation-ref.html
 == in-visibility-hidden-animation-pseudo-element.html in-visibility-hidden-animation-pseudo-element-ref.html
 == partially-out-of-view-animation.html partially-out-of-view-animation-ref.html
 == animate-display-table-opacity.html animate-display-table-opacity-ref.html
 # We need to run 100% opacity test case when OMTA is disabled to check that the animation creates a stacking context even if the animation is not running on the compositor
 test-pref(layers.offmainthreadcomposition.async-animations,false) == stacking-context-opacity-1-animation.html stacking-context-animation-ref.html
 # We need to run transform:none test case when OMTA is disabled to check that the animation creates a stacking context even if the animation is not running on the compositor
 test-pref(layers.offmainthreadcomposition.async-animations,false) == stacking-context-transform-none-animation.html stacking-context-animation-ref.html
-== no-stacking-context-opacity-removing-animation-in-delay.html no-stacking-context-animation-ref.html
-== no-stacking-context-transform-removing-animation-in-delay.html no-stacking-context-animation-ref.html
-== stacking-context-lose-opacity-1.html stacking-context-animation-ref.html
-== stacking-context-lose-transform-none.html stacking-context-animation-ref.html
-== stacking-context-opacity-win-in-delay.html stacking-context-animation-ref.html
-== stacking-context-opacity-win-in-delay-on-main-thread.html stacking-context-animation-ref.html
-== stacking-context-opacity-wins-over-transition.html stacking-context-animation-ref.html
-== stacking-context-transform-win-in-delay.html stacking-context-animation-ref.html
-== stacking-context-transform-win-in-delay-on-main-thread.html stacking-context-animation-ref.html
-== stacking-context-transform-wins-over-transition.html stacking-context-animation-ref.html
+== stacking-context-lose-opacity-1.html no-stacking-context-animation-ref.html
+== stacking-context-lose-transform-none.html no-stacking-context-animation-ref.html
 == stacking-context-opacity-1-animation.html stacking-context-animation-ref.html
 == stacking-context-opacity-1-with-fill-backwards.html stacking-context-animation-ref.html
 == stacking-context-opacity-1-with-fill-forwards.html stacking-context-animation-ref.html
 == stacking-context-paused-on-opacity-1.html stacking-context-animation-ref.html
 == stacking-context-paused-on-transform-none.html stacking-context-animation-ref.html
 == stacking-context-transform-none-animation.html stacking-context-animation-ref.html
 == stacking-context-transform-none-animation-on-svg.html  stacking-context-animation-ref.html
 == stacking-context-transform-none-animation-with-backface-visibility.html stacking-context-animation-ref.html
 == stacking-context-transform-none-animation-with-preserve-3d.html stacking-context-animation-ref.html
 == stacking-context-transform-none-with-fill-backwards.html stacking-context-animation-ref.html
 == stacking-context-transform-none-with-fill-forwards.html stacking-context-animation-ref.html
-== stacking-context-opacity-1-in-delay.html stacking-context-animation-ref.html
-== stacking-context-opacity-removing-important-in-delay.html stacking-context-animation-ref.html
-== stacking-context-transform-none-in-delay.html stacking-context-animation-ref.html
-== stacking-context-transform-removing-important-in-delay.html stacking-context-animation-ref.html
+fails == stacking-context-opacity-1-in-delay.html stacking-context-animation-ref.html # bug 1278136 and bug 1279403
+fails == stacking-context-transform-none-in-delay.html stacking-context-animation-ref.html # bug 1278136 and bug 1279403
 == background-position-in-delay.html background-position-ref.html
 == background-position-after-finish.html background-position-ref.html
 fails == background-position-running.html background-position-ref.html # This test fails the reftest-opaque-layer check since animating background-position currently creates an active layer, and reftest-opaque-layer only handles items assigned to PaintedLayers.
 fails == background-position-important.html background-position-ref.html # This test fails the reftest-opaque-layer check since animating background-position overridden by a non-animated !important style also creates an active layer, and reftest-opaque-layer only handles items that are assigned to PaintedLayers.
--- a/layout/reftests/css-animations/stacking-context-lose-opacity-1.html
+++ b/layout/reftests/css-animations/stacking-context-lose-opacity-1.html
@@ -1,12 +1,11 @@
 <!DOCTYPE html>
 <title>
-Opacity animation creates a stacking context even if the opacity property
-is overridden by an !important rule
+Opacity animation losing in cascade doesn't create stacking context
 </title>
 <style>
 span {
   height: 100px;
   width: 100px;
   position: fixed;
   background: green;
   top: 50px;
--- a/layout/reftests/css-animations/stacking-context-lose-transform-none.html
+++ b/layout/reftests/css-animations/stacking-context-lose-transform-none.html
@@ -1,12 +1,11 @@
 <!DOCTYPE html>
 <title>
-Transform animation creates a stacking context even if the transform property
-is overridden by an !important rule
+Transform animation losing in cascade doesn't create stacking context
 </title>
 <style>
 span {
   height: 100px;
   width: 100px;
   position: fixed;
   background: green;
   top: 50px;
deleted file mode 100644
--- a/layout/reftests/css-animations/stacking-context-opacity-removing-important-in-delay.html
+++ /dev/null
@@ -1,43 +0,0 @@
-<!DOCTYPE html>
-<html class="reftest-wait">
-<title>
-Removing !important rule during delay phase of animation creates
-a stack context for correct style
-</title>
-<style>
-span {
-  height: 100px;
-  width: 100px;
-  position: fixed;
-  background: green;
-  top: 50px;
-}
-@keyframes Opacity0 {
-  from, to { opacity: 0 }
-}
-#test {
-  width: 100px; height: 100px;
-  background: blue;
-  animation: Opacity0 100s 100s;
-}
-</style>
-<span></span>
-<div id="test"></div>
-<script>
-window.addEventListener("load", () => {
-  var target = document.getElementById("test");
-  target.style.setProperty("opacity", "0.1", "important");
-
-  requestAnimationFrame(() => {
-    // Now the target opacity style should be 0.1 because of !important rule.
-
-    // Apply 100% opacity without important directive.
-    target.style.setProperty("opacity", "1", "");
-    requestAnimationFrame(() => {
-      // The CSS animation is no longer overridden but it's still in delay
-      // phase, so we should create a stacking context for 100% opacity style.
-      document.documentElement.classList.remove("reftest-wait");
-    });
-  });
-});
-</script>
deleted file mode 100644
--- a/layout/reftests/css-animations/stacking-context-opacity-win-in-delay-on-main-thread.html
+++ /dev/null
@@ -1,31 +0,0 @@
-<!DOCTYPE html>
-<title>
-Opacity animation winning over another opacity animation in delay phase
-on the main-thread creates a stacking context
-</title>
-<style>
-span {
-  height: 100px;
-  width: 100px;
-  position: fixed;
-  background: green;
-  top: 50px;
-}
-@keyframes Opacity1 {
-  from, to { opacity: 1; }
-}
-@keyframes Opacity0 {
-  from, to { opacity: 0; }
-}
-// For preventing running on the compositor.
-@keyframes Width {
-  from, to { width: 100px; }
-}
-#test {
-  width: 100px; height: 100px;
-  background: blue;
-  animation: Opacity0 100s 100s, Opacity1 100s, Width 100s;
-}
-</style>
-<span></span>
-<div id="test"></div>
deleted file mode 100644
--- a/layout/reftests/css-animations/stacking-context-opacity-win-in-delay.html
+++ /dev/null
@@ -1,27 +0,0 @@
-<!DOCTYPE html>
-<title>
-Opacity animation winning over another opacity animation in delay phase
-creates a stacking context
-</title>
-<style>
-span {
-  height: 100px;
-  width: 100px;
-  position: fixed;
-  background: green;
-  top: 50px;
-}
-@keyframes Opacity1 {
-  from, to { opacity: 1; }
-}
-@keyframes Opacity0 {
-  from, to { opacity: 0; }
-}
-#test {
-  width: 100px; height: 100px;
-  background: blue;
-  animation: Opacity0 100s 100s, Opacity1 100s;
-}
-</style>
-<span></span>
-<div id="test"></div>
deleted file mode 100644
--- a/layout/reftests/css-animations/stacking-context-opacity-wins-over-transition.html
+++ /dev/null
@@ -1,40 +0,0 @@
-<!DOCTYPE html>
-<html class="reftest-wait">
-<title>
-Opacity animation winning over opacity transition creates a stacking context
-for correct style.
-</title>
-<style>
-span {
-  height: 100px;
-  width: 100px;
-  position: fixed;
-  background: green;
-  top: 50px;
-}
-@keyframes Opacity1 {
-  from, to { opacity: 1; }
-}
-#test {
-  width: 100px; height: 100px;
-  background: blue;
-  opacity: 1;
-  transition: opacity 100s steps(1, start);
-  animation: Opacity1 100s;
-}
-</style>
-<span></span>
-<div id="test"></div>
-<script>
-window.addEventListener("load", () => {
-  var target = document.getElementById("test");
-  getComputedStyle(target).opacity;
-
-  // CSS animation wins over transitions, so transition won't be visible during
-  // the CSS animation.
-  target.style.opacity = 0;
-  requestAnimationFrame(() => {
-    document.documentElement.classList.remove("reftest-wait");
-  });
-});
-</script>
deleted file mode 100644
--- a/layout/reftests/css-animations/stacking-context-transform-removing-important-in-delay.html
+++ /dev/null
@@ -1,44 +0,0 @@
-<!DOCTYPE html>
-<html class="reftest-wait">
-<title>
-Removing !important rule during delay phase of animation creates
-a stack context for correct style
-</title>
-<style>
-span {
-  height: 100px;
-  width: 100px;
-  position: fixed;
-  background: green;
-  top: 50px;
-}
-@keyframes Transform100px {
-  from, to { transform: translate(100px) }
-}
-#test {
-  width: 100px; height: 100px;
-  background: blue;
-  animation: Transform100px 100s 100s;
-}
-</style>
-<span></span>
-<div id="test"></div>
-<script>
-window.addEventListener("load", () => {
-  var target = document.getElementById("test");
-  target.style.setProperty("transform", "translateX(200px)", "important");
-
-  requestAnimationFrame(() => {
-    // Now the target transform style should be translateX(200px) because of
-    // !important rule.
-
-    // Apply transform:none without important directive.
-    target.style.setProperty("transform", "none", "");
-    requestAnimationFrame(() => {
-      // The CSS animation is no longer overridden but it's still in delay
-      // phase, so we should create a stacking context for transform:none style.
-      document.documentElement.classList.remove("reftest-wait");
-    });
-  });
-});
-</script>
deleted file mode 100644
--- a/layout/reftests/css-animations/stacking-context-transform-win-in-delay-on-main-thread.html
+++ /dev/null
@@ -1,31 +0,0 @@
-<!DOCTYPE html>
-<title>
-Transform animation winning over another transform animation in delay phase
-on the main-thread creates a stacking context
-</title>
-<style>
-span {
-  height: 100px;
-  width: 100px;
-  position: fixed;
-  background: green;
-  top: 50px;
-}
-@keyframes TransformNone {
-  from, to { transform: none; }
-}
-@keyframes Transform100px {
-  from, to { transform: translateX(100px); }
-}
-// For preventing running on the compositor.
-@keyframes Width {
-  from, to { width: 100px; }
-}
-#test {
-  width: 100px; height: 100px;
-  background: blue;
-  animation: Transform100px 100s 100s, TransformNone 100s, Width 100s;
-}
-</style>
-<span></span>
-<div id="test"></div>
deleted file mode 100644
--- a/layout/reftests/css-animations/stacking-context-transform-win-in-delay.html
+++ /dev/null
@@ -1,27 +0,0 @@
-<!DOCTYPE html>
-<title>
-Transform animation winning over another transform animation in delay phase
-creates a stacking context
-</title>
-<style>
-span {
-  height: 100px;
-  width: 100px;
-  position: fixed;
-  background: green;
-  top: 50px;
-}
-@keyframes TransformNone {
-  from, to { transform: none; }
-}
-@keyframes Transform100px {
-  from, to { transform: translateX(100px); }
-}
-#test {
-  width: 100px; height: 100px;
-  background: blue;
-  animation: Transform100px 100s 100s, TransformNone 100s;
-}
-</style>
-<span></span>
-<div id="test"></div>
deleted file mode 100644
--- a/layout/reftests/css-animations/stacking-context-transform-wins-over-transition.html
+++ /dev/null
@@ -1,40 +0,0 @@
-<!DOCTYPE html>
-<html class="reftest-wait">
-<title>
-Transform animation winning over transition creates a stacking context
-for correct style
-</title>
-<style>
-span {
-  height: 100px;
-  width: 100px;
-  position: fixed;
-  background: green;
-  top: 50px;
-}
-@keyframes TransformNone {
-  from, to { transform: none; }
-}
-#test {
-  width: 100px; height: 100px;
-  background: blue;
-  transform: translateX(200px);
-  transition: transform 100s steps(1, start);
-  animation: TransformNone 100s;
-}
-</style>
-<span></span>
-<div id="test"></div>
-<script>
-window.addEventListener("load", () => {
-  var target = document.getElementById("test");
-  getComputedStyle(target).transform;
-
-  // CSS animation wins over transition, so transition won't be visible during
-  // the CSS animation.
-  target.style.transform = "translateX(100px)";
-  requestAnimationFrame(() => {
-    document.documentElement.classList.remove("reftest-wait");
-  });
-});
-</script>
deleted file mode 100644
--- a/layout/reftests/css-transitions/no-stacking-context-transition-ref.html
+++ /dev/null
@@ -1,20 +0,0 @@
-<!DOCTYPE html>
-<title>
-Reference of testcases which don't create a stacking context for bug 1278136
-</title>
-<style>
-span {
-  height: 100px;
-  width: 100px;
-  background: green;
-  position: fixed;
-  top: 50px;
-}
-#test {
-  height: 100px;
-  width: 100px;
-  background: blue;
-}
-</style>
-<span></span>
-<div id="test"></div>
--- a/layout/reftests/css-transitions/reftest.list
+++ b/layout/reftests/css-transitions/reftest.list
@@ -1,8 +1,4 @@
 == transitions-inline-already-wrapped-1.html transitions-inline-ref.html
 == transitions-inline-already-wrapped-2.html transitions-inline-ref.html
 == transitions-inline-rewrap-1.html transitions-inline-ref.html
 == transitions-inline-rewrap-2.html transitions-inline-ref.html
-== stacking-context-opacity-lose-to-animation.html stacking-context-transition-ref.html
-== stacking-context-transform-lose-to-animation.html stacking-context-transition-ref.html
-== stacking-context-opacity-wins-over-important-style.html stacking-context-transition-ref.html
-== stacking-context-transform-wins-over-important-style.html stacking-context-transition-ref.html
deleted file mode 100644
--- a/layout/reftests/css-transitions/stacking-context-opacity-lose-to-animation.html
+++ /dev/null
@@ -1,45 +0,0 @@
-<!DOCTYPE html>
-<html class="reftest-wait">
-<title>
-Opacity transition and animation overridden by !important rule creates a
-stacking context
-</title>
-<style>
-span {
-  height: 100px;
-  width: 100px;
-  position: fixed;
-  background: green;
-  top: 50px;
-}
-@keyframes Opacity0 {
-  from, to { opacity: 0; }
-}
-#test {
-  width: 100px; height: 100px;
-  background: blue;
-  opacity: 0 ! important;
-  transition: opacity 100s steps(1, start);
-  animation: Opacity0 100s;
-}
-</style>
-<span></span>
-<div id="test"></div>
-<script>
-window.addEventListener("load", () => {
-  var target = document.getElementById("test");
-  getComputedStyle(target).opacity;
-
-  // Change the opacity style to 100%.
-  target.style.setProperty("opacity", "1", "important");
-  // Important style is changed but there is a CSS animation,
-  // so transition won't be visible and the CSS animation is overridden by
-  // the !important rule. As a result opacity style here should be 100%
-  // specified by the important rule, but we should create a stacking
-  // context for it because there are animations.
-
-  requestAnimationFrame(() => {
-    document.documentElement.classList.remove("reftest-wait");
-  });
-});
-</script>
deleted file mode 100644
--- a/layout/reftests/css-transitions/stacking-context-opacity-wins-over-important-style.html
+++ /dev/null
@@ -1,35 +0,0 @@
-<!DOCTYPE html>
-<html class="reftest-wait">
-<title>
-Opacity transition winning over !important rule creates a stacking context
-</title>
-<style>
-span {
-  height: 100px;
-  width: 100px;
-  position: fixed;
-  background: green;
-  top: 50px;
-}
-#test {
-  width: 100px; height: 100px;
-  background: blue;
-  transition: opacity 100s steps(1, start);
-  opacity: 0 ! important;
-}
-</style>
-<span></span>
-<div id="test"></div>
-<script>
-window.addEventListener("load", () => {
-  var target = document.getElementById("test");
-  getComputedStyle(target).opacity;
-
-  target.style.setProperty("opacity", "1", "important");
-  getComputedStyle(target).opacity;
-
-  requestAnimationFrame(() => {
-    document.documentElement.classList.remove("reftest-wait");
-  });
-});
-</script>
deleted file mode 100644
--- a/layout/reftests/css-transitions/stacking-context-transform-lose-to-animation.html
+++ /dev/null
@@ -1,45 +0,0 @@
-<!DOCTYPE html>
-<html class="reftest-wait">
-<title>
-Transform transition and animation overridden by !important rule create
-a stacking context
-</title>
-<style>
-span {
-  height: 100px;
-  width: 100px;
-  position: fixed;
-  background: green;
-  top: 50px;
-}
-@keyframes Transform100px {
-  from, to { transform: translateX(100px); }
-}
-#test {
-  width: 100px; height: 100px;
-  background: blue;
-  transform: translateX(200px) ! important;
-  transition: transform 100s steps(1, start);
-  animation: Transform100px 100s;
-}
-</style>
-<span></span>
-<div id="test"></div>
-<script>
-window.addEventListener("load", () => {
-  var target = document.getElementById("test");
-  getComputedStyle(target).transform;
-
-  // Change the transform style to 'none'.
-  target.style.setProperty("transform", "none", "important");
-  // Important style is changed but there is a CSS animation,
-  // so transition won't be visible and the CSS animation is overridden by
-  // the !important rule. As a result transform style here should be 'none'
-  // specified by the important rule, but we should create a stacking
-  // context for it because there are animations.
-
-  requestAnimationFrame(() => {
-    document.documentElement.classList.remove("reftest-wait");
-  });
-});
-</script>
deleted file mode 100644
--- a/layout/reftests/css-transitions/stacking-context-transform-wins-over-important-style.html
+++ /dev/null
@@ -1,35 +0,0 @@
-<!DOCTYPE html>
-<html class="reftest-wait">
-<title>
-Transform transition winning over !important rule creates a stacking context
-</title>
-<style>
-span {
-  height: 100px;
-  width: 100px;
-  position: fixed;
-  background: green;
-  top: 50px;
-}
-#test {
-  width: 100px; height: 100px;
-  background: blue;
-  transition: transform 100s steps(1, start);
-  transform: translateX(200px) ! important;
-}
-</style>
-<span></span>
-<div id="test"></div>
-<script>
-window.addEventListener("load", () => {
-  var target = document.getElementById("test");
-  getComputedStyle(target).transform;
-
-  target.style.setProperty("transform", "none", "important");
-  getComputedStyle(target).transform;
-
-  requestAnimationFrame(() => {
-    document.documentElement.classList.remove("reftest-wait");
-  });
-});
-</script>
deleted file mode 100644
--- a/layout/reftests/css-transitions/stacking-context-transition-ref.html
+++ /dev/null
@@ -1,19 +0,0 @@
-<!DOCTYPE html>
-<title>Reference of testcases for bug 1273042</title>
-<style>
-span {
-  height: 100px;
-  width: 100px;
-  background: green;
-  position: fixed;
-  top: 50px;
-  z-index: -1;
-}
-#test {
-  height: 100px;
-  width: 100px;
-  background: blue;
-}
-</style>
-<span></span>
-<div id="test"></div>
--- a/layout/reftests/web-animations/reftest.list
+++ b/layout/reftests/web-animations/reftest.list
@@ -1,16 +1,14 @@
 test-pref(dom.animations-api.core.enabled,true) == 1246046-1.html green-box.html
 test-pref(dom.animations-api.core.enabled,true) == 1267937-1.html 1267937-ref.html
 test-pref(dom.animations-api.core.enabled,true) == 1298742-1.html 1298742-ref.html
 test-pref(dom.animations-api.core.enabled,true) == stacking-context-transform-none-animation-before-appending-element.html stacking-context-animation-ref.html
 test-pref(dom.animations-api.core.enabled,true) == stacking-context-opacity-changing-keyframe.html stacking-context-animation-ref.html
 test-pref(dom.animations-api.core.enabled,true) == stacking-context-opacity-changing-target.html stacking-context-animation-changing-target-ref.html
 test-pref(dom.animations-api.core.enabled,true) == stacking-context-opacity-changing-effect.html stacking-context-animation-ref.html
-test-pref(dom.animations-api.core.enabled,true) == stacking-context-opacity-losing-css-animation-in-delay.html stacking-context-animation-ref.html
 test-pref(dom.animations-api.core.enabled,true) == stacking-context-transform-changing-keyframe.html stacking-context-animation-ref.html
 test-pref(dom.animations-api.core.enabled,true) == stacking-context-transform-changing-target.html stacking-context-animation-changing-target-ref.html
 test-pref(dom.animations-api.core.enabled,true) == stacking-context-transform-changing-effect.html stacking-context-animation-ref.html
 test-pref(dom.animations-api.core.enabled,true) == stacking-context-transform-changing-display-property.html stacking-context-animation-ref.html
-test-pref(dom.animations-api.core.enabled,true) == stacking-context-transform-losing-css-animation-in-delay.html stacking-context-animation-ref.html
 test-pref(dom.animations-api.core.enabled,true) == style-updates-on-iteration-composition-changed-from-accumulate-to-replace.html style-updates-for-iteration-composite-ref.html
 test-pref(dom.animations-api.core.enabled,true) == style-updates-on-iteration-composition-changed-from-replace-to-accumulate.html style-updates-for-iteration-composite-ref.html
 test-pref(dom.animations-api.core.enabled,true) == style-updates-on-current-iteration-changed.html style-updates-for-iteration-composite-ref.html
deleted file mode 100644
--- a/layout/reftests/web-animations/stacking-context-opacity-losing-css-animation-in-delay.html
+++ /dev/null
@@ -1,32 +0,0 @@
-<!DOCTYPE html>
-<title>
-CSS opacity animation winning over web animation in delay phase creates
-a stacking context
-</title>
-<style>
-span {
-  height: 100px;
-  width: 100px;
-  position: fixed;
-  background: green;
-  top: 50px;
-}
-@keyframes Opacity1 {
-  from, to { opacity: 1; }
-}
-#test {
-  width: 100px; height: 100px;
-  background: blue;
-  animation: Opacity1 100s;
-}
-</style>
-<span></span>
-<div id="test"></div>
-<script>
-  document.getElementById("test")
-    .animate({ opacity: [0.1, 0.1] }, { duration: 100000, delay: 100000 });
-
-  requestAnimationFrame(function() {
-    document.documentElement.classList.remove("reftest-wait");
-  });
-</script>
deleted file mode 100644
--- a/layout/reftests/web-animations/stacking-context-transform-losing-css-animation-in-delay.html
+++ /dev/null
@@ -1,33 +0,0 @@
-<!DOCTYPE html>
-<title>
-CSS transform animation winning over web animation in delay phase creates
-a stacking context
-</title>
-<style>
-span {
-  height: 100px;
-  width: 100px;
-  position: fixed;
-  background: green;
-  top: 50px;
-}
-@keyframes TransformNone {
-  from, to { transform: none; }
-}
-#test {
-  width: 100px; height: 100px;
-  background: blue;
-  animation: TransformNone 100s;
-}
-</style>
-<span></span>
-<div id="test"></div>
-<script>
-  document.getElementById("test")
-    .animate({ transform: ['translateX(100px)', 'translate(100px)'] },
-             { duration: 100000, delay: 100000 });
-
-  requestAnimationFrame(function() {
-    document.documentElement.classList.remove("reftest-wait");
-  });
-</script>