Bug 1358387 - Avoid style flush when setting the statuspanel's current width as its min-width on status label changes. r?florian draft
authorDão Gottwald <dao@mozilla.com>
Sun, 28 May 2017 07:49:36 +0200
changeset 585677 0999d97a8b98c06e871fe0b1a0570fbdcc115097
parent 585328 bce03a8eac301bcd9408b22333b1a67c3eaed057
child 630780 daedf82fe8e1a531961e3de9a7c567414543476d
push id61174
push userdgottwald@mozilla.com
push dateSun, 28 May 2017 05:50:17 +0000
reviewersflorian
bugs1358387
milestone55.0a1
Bug 1358387 - Avoid style flush when setting the statuspanel's current width as its min-width on status label changes. r?florian MozReview-Commit-ID: 6eReuAxAwtK
browser/base/content/tabbrowser.xml
--- a/browser/base/content/tabbrowser.xml
+++ b/browser/base/content/tabbrowser.xml
@@ -7732,19 +7732,30 @@
 
       <property name="label">
         <setter><![CDATA[
           if (!this.label) {
             this.removeAttribute("mirror");
             this.removeAttribute("sizelimit");
           }
 
-          this.style.minWidth = this.getAttribute("type") == "status" &&
-                                this.getAttribute("previoustype") == "status"
-                                  ? getComputedStyle(this).width : "";
+          if (this.getAttribute("type") == "status" &&
+              this.getAttribute("previoustype") == "status") {
+            // Before updating the label, set the panel's current width as its
+            // min-width to let the panel grow but not shrink and prevent
+            // unnecessary flicker while loading pages. We only care about the
+            // panel's width once it has been painted, so we can do this
+            // without flushing layout.
+            this.style.minWidth =
+              window.QueryInterface(Ci.nsIInterfaceRequestor)
+                    .getInterface(Ci.nsIDOMWindowUtils)
+                    .getBoundsWithoutFlushing(this).width + "px";
+          } else {
+            this.style.minWidth = "";
+          }
 
           if (val) {
             this.setAttribute("label", val);
             this.removeAttribute("inactive");
             this._mouseTargetRect = null;
             MousePosTracker.addListener(this);
           } else {
             this.setAttribute("inactive", "true");