Bug 1364672 - take the padding of the views into account when calculating the height of each sub view. r=Gijs
authorMike de Boer <mdeboer@mozilla.com>
Wed, 17 May 2017 18:05:58 +0200
changeset 358784 4dfebbea38975129339eefcdb9f74ab271f7b9ac
parent 358783 ee2658ed3cfb205700f5e1b095bf5d5ede15c4b2
child 358785 7e04198f7bb6bb3b018e82e58bc5baaea14972ef
push id31838
push userkwierso@gmail.com
push dateWed, 17 May 2017 20:32:10 +0000
treeherdermozilla-central@b133ec74e3d0 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersGijs
bugs1364672
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 1364672 - take the padding of the views into account when calculating the height of each sub view. r=Gijs It's ok to cache the padding size of the main view and re-use it in this case, because the padding is maintained for each view consistently. The performance characteristics are therefore maintained. MozReview-Commit-ID: GYT59NIiBET
browser/components/customizableui/PanelMultiView.jsm
--- a/browser/components/customizableui/PanelMultiView.jsm
+++ b/browser/components/customizableui/PanelMultiView.jsm
@@ -206,18 +206,20 @@ this.PanelMultiView = class {
     if (this._panelViews)
       return this._panelViews;
 
     this._panelViews = new SlidingPanelViews();
     this._panelViews.push(...this.node.getElementsByTagName("panelview"));
     return this._panelViews;
   }
   get _dwu() {
-    return this.window.QueryInterface(Ci.nsIInterfaceRequestor)
-                      .getInterface(Ci.nsIDOMWindowUtils);
+    if (this.__dwu)
+      return this.__dwu;
+    return this.__dwu = this.window.QueryInterface(Ci.nsIInterfaceRequestor)
+                                   .getInterface(Ci.nsIDOMWindowUtils);
   }
   get _currentSubView() {
     return this.panelViews ? this.panelViews.currentView : this.__currentSubView;
   }
   set _currentSubView(panel) {
     if (this.panelViews)
       this.panelViews.currentView = panel;
     else
@@ -303,17 +305,17 @@ this.PanelMultiView = class {
       this._subViews.removeEventListener("overflow", this);
       this._mainViewContainer.removeEventListener("overflow", this);
       this._clickCapturer.removeEventListener("click", this);
     }
     this._panel.removeEventListener("popupshowing", this);
     this._panel.removeEventListener("popupshown", this);
     this._panel.removeEventListener("popuphidden", this);
     this.node = this._clickCapturer = this._viewContainer = this._mainViewContainer =
-      this._subViews = this._viewStack = null;
+      this._subViews = this._viewStack = this.__dwu = null;
   }
 
   goBack(target) {
     let [current, previous] = this.panelViews.back();
     return this.showSubView(current, target, previous);
   }
 
   setMainView(aNewMainView) {
@@ -381,18 +383,22 @@ this.PanelMultiView = class {
       let previousViewNode = aPreviousView || this._currentSubView;
       let playTransition = (!!previousViewNode && previousViewNode != viewNode);
 
       let dwu, previousRect;
       if (playTransition || this.panelViews) {
         dwu = this._dwu;
         previousRect = previousViewNode.__lastKnownBoundingRect =
           dwu.getBoundsWithoutFlushing(previousViewNode);
-        if (this.panelViews && !this._mainViewWidth)
+        if (this.panelViews && !this._mainViewWidth) {
           this._mainViewWidth = previousRect.width;
+          let top = dwu.getBoundsWithoutFlushing(previousViewNode.firstChild).top;
+          let bottom = dwu.getBoundsWithoutFlushing(previousViewNode.lastChild).bottom;
+          this._viewVerticalPadding = previousRect.height - (bottom - top);
+        }
       }
 
       // Emit the ViewShowing event so that the widget definition has a chance
       // to lazily populate the subview with things.
       let detail = {
         blockers: new Set(),
         addBlocker(aPromise) {
           this.blockers.add(aPromise);
@@ -503,17 +509,17 @@ this.PanelMultiView = class {
               // When showing two nodes at the same time (one partly out of view,
               // but that doesn't seem to make a difference in this case) inside
               // a XUL node container, the flexible box layout on the vertical
               // axis gets confused. I.e. it lies.
               // So what we need to resort to here is count the height of each
               // individual child element of the view.
               viewRect.height = [viewNode.header, ...viewNode.children].reduce((acc, node) => {
                 return acc + dwu.getBoundsWithoutFlushing(node).height;
-              }, 0);
+              }, this._viewVerticalPadding);
             }
           }
 
           // Set the viewContainer dimensions to make sure only the current view
           // is visible.
           this._viewContainer.style.height = viewRect.height + "px";
           this._viewContainer.style.width = viewRect.width + "px";