--- a/browser/components/customizableui/CustomizeMode.jsm
+++ b/browser/components/customizableui/CustomizeMode.jsm
@@ -603,16 +603,22 @@ CustomizeMode.prototype = {
       }
 
       function resolveAnimationPromise() {
         animationNode.removeEventListener("animationend", cleanupWidgetAnimationEnd);
         animationNode.removeEventListener("customizationending", cleanupCustomizationExit);
         resolve();
       }
 
+      // Force a style flush to ensure we do start the animation.
+      // (We cannot use promiseLayoutFlushed here because the callback
+      // is not invoked until any actual reflow gets triggered, which
+      // may not always happen soonish enough. If we have a style flush
+      // observer, we can probably use that, though.)
+      this.window.getComputedStyle(animationNode).animationName;
       animationNode.classList.add("animate-out");
       animationNode.ownerGlobal.gNavToolbox.addEventListener("customizationending", cleanupCustomizationExit);
       animationNode.addEventListener("animationend", cleanupWidgetAnimationEnd);
     });
   },
 
   async addToToolbar(aNode) {
     aNode = this._getCustomizableChildForNode(aNode);