--- a/dom/animation/EffectCompositor.cpp
+++ b/dom/animation/EffectCompositor.cpp
@@ -227,16 +227,20 @@ EffectCompositor::UpdateEffectProperties
                                          dom::Element* aElement,
                                          CSSPseudoElementType aPseudoType)
 {
   EffectSet* effectSet = EffectSet::GetEffectSet(aElement, aPseudoType);
   if (!effectSet) {
     return;
   }
 
+  // Style context change might cause CSS cascade level,
+  // e.g removing !important, so we should update the cascading result.
+  effectSet->MarkCascadeNeedsUpdate();
+
   for (KeyframeEffectReadOnly* effect : *effectSet) {
     effect->UpdateProperties(aStyleContext);
   }
 }
 
 void
 EffectCompositor::MaybeUpdateAnimationRule(dom::Element* aElement,
                                            CSSPseudoElementType aPseudoType,

--- a/dom/animation/test/chrome/test_running_on_compositor.html
+++ b/dom/animation/test/chrome/test_running_on_compositor.html
@@ -510,10 +510,30 @@ promise_test(function(t) {
   }).then(function() {
     assert_equals(animation.isRunningOnCompositor, omtaEnabled,
                   '100% opacity animation set by using setKeyframes reports ' +
                   'that it is running on the compositor');
   });
 }, '100% opacity animation set up by converting an existing animation with ' +
    'cannot be run on the compositor, is running on the compositor');
 
+promise_test(function(t) {
+  var div = addDiv(t, { style: "opacity: 1 ! important" });
+
+  var animation = div.animate({ opacity: [0, 1] }, 100 * MS_PER_SEC);
+
+  return animation.ready.then(function() {
+    assert_equals(animation.isRunningOnCompositor, false,
+      'Opacity animation on an element which has 100% opacity style with ' +
+      '!important flag reports that it is not running on the compositor');
+    // Clear important flag from the opacity style on the target element.
+    div.style.setProperty("opacity", "1", "");
+    return waitForFrame();
+  }).then(function() {
+    assert_equals(animation.isRunningOnCompositor, omtaEnabled,
+      'Opacity animation reports that it is running on the compositor after '
+      + 'clearing the !important flag');
+  });
+}, 'Clearing *important* opacity style on the target element sends the ' +
+   'animation to the compositor');
+
 </script>
 </body>