Bug 844466 - Start tab opening animation synchronously. r=ttaubert

browser/base/content/tabbrowser.xml

@@ -1258,29 +1258,14 @@
             // When overflowing, new tabs are scrolled into view smoothly, which
             // doesn't go well together with the width transition. So we skip the
             // transition in that case.
-            if (aSkipAnimation ||
+            let animate = !aSkipAnimation &&
-                this.tabContainer.getAttribute("overflow") == "true" ||
+                          this.tabContainer.getAttribute("overflow") != "true" &&
-                !Services.prefs.getBoolPref("browser.tabs.animate")) {
+                          Services.prefs.getBoolPref("browser.tabs.animate");
+            if (!animate) {
               t.setAttribute("fadein", "true");
               setTimeout(function (tabContainer) {
                 tabContainer._handleNewTab(t);
               }, 0, this.tabContainer);
-            } else {
-              setTimeout(function (tabContainer) {
-                if (t.pinned)
-                  tabContainer._handleNewTab(t);
-                else {
-                  tabContainer._handleTabTelemetryStart(tabContainer, t, aURI);
-
-                  t.setAttribute("fadein", "true");
-
-                  // This call to adjustTabstrip is redundant but needed so that
-                  // when opening a second tab, the first tab's close buttons
-                  // appears immediately rather than when the transition ends.
-                  if (tabContainer.childNodes.length == 2)
-                    tabContainer.adjustTabstrip();
-                }
-              }, 0, this.tabContainer);
             }
 
             // invalidate caches
@@ -1443,6 +1428,20 @@
               this._lastRelatedTab = t;
             }
 
+            if (animate) {
+              this.tabContainer._handleTabTelemetryStart(this.tabContainer, t, aURI);
+
+              // kick the animation off
+              t.clientTop;
+              t.setAttribute("fadein", "true");
+
+              // This call to adjustTabstrip is redundant but needed so that
+              // when opening a second tab, the first tab's close buttons
+              // appears immediately rather than when the transition ends.
+              if (this.tabContainer.childNodes.length == 2)
+                this.tabContainer.adjustTabstrip();
+            }
+
             return t;
           ]]>
         </body>

browser/base/content/test/browser_bug585785.js

@@ -4,18 +4,13 @@ function test() {
   waitForExplicitFinish();
 
   tab = gBrowser.addTab();
-  isnot(tab.getAttribute("fadein"), "true", "newly opened tab is yet to fade in");
+  is(tab.getAttribute("fadein"), "true", "tab opening animation initiated");
 
   // Try to remove the tab right before the opening animation's first frame
   window.mozRequestAnimationFrame(checkAnimationState);
 }
 
 function checkAnimationState() {
-  if (tab.getAttribute("fadein") != "true") {
-    window.mozRequestAnimationFrame(checkAnimationState);
-    return;
-  }
-
   info(window.getComputedStyle(tab).maxWidth);
   gBrowser.removeTab(tab, { animate: true });
   if (!tab.parentNode) {