--- a/layout/base/RestyleManager.cpp
+++ b/layout/base/RestyleManager.cpp
@@ -2610,17 +2610,17 @@ ElementRestyler::Restyle(nsRestyleHint a
   // List of descendant elements of mContent we know we will eventually need to
   // restyle.  Before we return from this function, we call
   // RestyleTracker::AddRestyleRootsIfAwaitingRestyle to ensure they get
   // restyled in RestyleTracker::DoProcessRestyles.
   nsTArray<nsRefPtr<Element>> descendants;
 
   nsRestyleHint hintToRestore = nsRestyleHint(0);
   if (mContent && mContent->IsElement() &&
-      // If we're we're resolving from the root of the frame tree (which
+      // If we're resolving from the root of the frame tree (which
       // we do in DoRebuildAllStyleData), we need to avoid getting the
       // root's restyle data until we get to its primary frame, since
       // it's the primary frame that has the styles for the root element
       // (rather than the ancestors of the primary frame whose mContent
       // is the root node but which have different styles).  If we use
       // up the hint for one of the ancestors that we hit first, then
       // we'll fail to do the restyling we need to do.
       (mContent->GetParent() || mContent->GetPrimaryFrame() == mFrame)) {
@@ -2631,22 +2631,16 @@ ElementRestyler::Restyle(nsRestyleHint a
         mChangeList->AppendChange(mFrame, mContent, restyleData->mChangeHint);
       }
       hintToRestore = restyleData->mRestyleHint;
       aRestyleHint = nsRestyleHint(aRestyleHint | restyleData->mRestyleHint);
       descendants.SwapElements(restyleData->mDescendants);
     }
   }
 
-  // Some changes to animations don't affect the computed style and yet still
-  // require the layer to be updated. For example, pausing an animation via
-  // the Web Animations API won't affect an element's style but still
-  // requires us to pull the animation off the layer.
-  AddLayerChangesForAnimation();
-
   // If we are restyling this frame with eRestyle_Self or weaker hints,
   // we restyle children with nsRestyleHint(0).  But we pass the
   // eRestyle_ChangeAnimationPhaseDescendants and eRestyle_ForceDescendants
   // flags down too.
   nsRestyleHint childRestyleHint =
     nsRestyleHint(aRestyleHint & (eRestyle_Subtree |
                                   eRestyle_ChangeAnimationPhaseDescendants |
                                   eRestyle_ForceDescendants));
@@ -2689,16 +2683,29 @@ ElementRestyler::Restyle(nsRestyleHint a
       // with this frame and its descendants.  Higher RestyleResult values
       // represent a superset of the work done by lower values.
       result = thisResult;
     }
 
     f = GetNextContinuationWithSameStyle(f, oldContext, &haveMoreContinuations);
   }
 
+  // Some changes to animations don't affect the computed style and yet still
+  // require the layer to be updated. For example, pausing an animation via
+  // the Web Animations API won't affect an element's style but still
+  // requires us to pull the animation off the layer.
+  //
+  // Although we only expect this code path to be called when computed style
+  // is not changing, we can sometimes reach this at the end of a transition
+  // when the animated style is being removed. Since
+  // AddLayerChangesForAnimation checks if mFrame has a transform style or not,
+  // we need to call it *after* calling RestyleSelf to ensure the animated
+  // transform has been removed first.
+  AddLayerChangesForAnimation();
+
   if (haveMoreContinuations && hintToRestore) {
     // If we have more continuations with different style (e.g., because
     // we're inside a ::first-letter or ::first-line), put the restyle
     // hint back.
     mRestyleTracker.AddPendingRestyleToTable(mContent->AsElement(),
                                              hintToRestore, nsChangeHint(0));
   }