Bug 1367970 - when switching panels quickly, the auto-resize workaround can cause wonky animations. Clear the timeout when a new animation starts. r=Gijs
authorMike de Boer <mdeboer@mozilla.com>
Tue, 06 Jun 2017 18:18:42 +0200
changeset 413085 c27161891c66b52f2771e483f683290ff058710c
parent 413084 aa36ffe32ddc2afb9d80f232694c65ec86923644
child 413086 6a8333a5941e8c5ef68607fd70e0746af872c57d
push id1490
push usermtabara@mozilla.com
push dateMon, 31 Jul 2017 14:08:16 +0000
treeherdermozilla-release@70e32e6bf15e [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersGijs
bugs1367970
milestone55.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 1367970 - when switching panels quickly, the auto-resize workaround can cause wonky animations. Clear the timeout when a new animation starts. r=Gijs MozReview-Commit-ID: CpQFjDDm2BR
browser/components/customizableui/PanelMultiView.jsm
--- a/browser/components/customizableui/PanelMultiView.jsm
+++ b/browser/components/customizableui/PanelMultiView.jsm
@@ -527,16 +527,18 @@ this.PanelMultiView = class {
         }
 
         if (aAnchor)
           aAnchor.setAttribute("open", true);
         this._viewContainer.style.height = Math.max(previousRect.height, this._mainViewHeight) + "px";
         this._viewContainer.style.width = previousRect.width + "px";
 
         this._transitioning = true;
+        if (this._autoResizeWorkaroundTimer)
+          window.clearTimeout(this._autoResizeWorkaroundTimer);
         this._viewContainer.setAttribute("transition-reverse", reverse);
         let nodeToAnimate = reverse ? previousViewNode : viewNode;
 
         if (!reverse) {
           // We set the margin here to make sure the view is positioned next
           // to the view that is currently visible. The animation is taken
           // care of by transitioning the `transform: translateX()` property
           // instead.
@@ -599,17 +601,17 @@ this.PanelMultiView = class {
             onTransitionEnd();
             this._transitioning = false;
             this._resetKeyNavigation(previousViewNode);
 
             // Myeah, panel layout auto-resizing is a funky thing. We'll wait
             // another few milliseconds to remove the width and height 'fixtures',
             // to be sure we don't flicker annoyingly.
             // NB: HACK! Bug 1363756 is there to fix this.
-            window.setTimeout(() => {
+            this._autoResizeWorkaroundTimer = window.setTimeout(() => {
               // Only remove the height when the view is larger than the main
               // view, otherwise it'll snap back to its own height.
               if (viewNode == this._mainView || viewRect.height > this._mainViewHeight)
                 this._viewContainer.style.removeProperty("height");
               this._viewContainer.style.removeProperty("width");
             }, 500);
 
             // Take another breather, just like before, to wait for the 'current'