Bug 1477461 - Make sure tab locking freezes tab width animations until after the next flush. r=dao
authorMike Conley <mconley@mozilla.com>
Thu, 09 Aug 2018 08:47:44 +0000
changeset 485899 152ac3a5a10c4958a6040ab0e3ca1733066dd5b2
parent 485898 cbd1cebd5af9174c3e5be323c9e10b6d3a6089f2
child 485900 0260bc2917ddcb8166a498c6b37d643b20282276
push id9719
push userffxbld-merge
push dateFri, 24 Aug 2018 17:49:46 +0000
treeherdermozilla-beta@719ec98fba77 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersdao
bugs1477461
milestone63.0a1
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
Bug 1477461 - Make sure tab locking freezes tab width animations until after the next flush. r=dao Before, we were disabling the transitions, forcing a style flush, and then immediately re-enabling the transitions for the next flush. Now, we disable the transitions, wait until the next flush completes naturally, and then puts the transitions back during the next requestAnimationFrame. This lets us avoid the sync style flush, and also gets us the tab size locking behaviour. MozReview-Commit-ID: BU7AvBrhNxO Differential Revision: https://phabricator.services.mozilla.com/D2945
browser/base/content/tabbrowser.xml
--- a/browser/base/content/tabbrowser.xml
+++ b/browser/base/content/tabbrowser.xml
@@ -438,25 +438,36 @@
             if (isEndTab) {
               let numNormalTabs = tabs.length - numPinned;
               aTabWidth = aTabWidth * (numNormalTabs + 1) / numNormalTabs;
               if (aTabWidth > this._tabDefaultMaxWidth) {
                 aTabWidth = this._tabDefaultMaxWidth;
               }
             }
             aTabWidth += "px";
+            let tabsToReset = [];
             for (let i = numPinned; i < tabs.length; i++) {
               let tab = tabs[i];
               tab.style.setProperty("max-width", aTabWidth, "important");
               if (!isEndTab) { // keep tabs the same width
                 tab.style.transition = "none";
-                window.getComputedStyle(tab); // flush styles to skip animation; see bug 649247
-                tab.style.transition = "";
+                tabsToReset.push(tab);
               }
             }
+
+            if (tabsToReset.length) {
+              window.promiseDocumentFlushed(() => {}).then(() => {
+                window.requestAnimationFrame(() => {
+                  for (let tab of tabsToReset) {
+                    tab.style.transition = "";
+                  }
+                });
+              });
+            }
+
             this._hasTabTempMaxWidth = true;
             gBrowser.addEventListener("mousemove", this);
             window.addEventListener("mouseout", this);
           }
         ]]></body>
       </method>
 
       <method name="_expandSpacerBy">