Bug 1406478 - Reintroduce browser.tabs.tabMinWidth hidden pref and set it to 76. r=jaws
authorDão Gottwald <dao@mozilla.com>
Wed, 11 Oct 2017 11:56:38 +0200
changeset 432354 22a065a6a5fe7f01fdda155e74969d85ac0fa6bc
parent 432353 b8bd3c282f179ea97261ba343639666ae9a67c48
child 432355 cdbd605ca994f0becfd8105468fdfd4233b77dbf
push id7944
push userdgottwald@mozilla.com
push dateWed, 11 Oct 2017 09:58:53 +0000
treeherdermozilla-beta@0aac8b210514 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersjaws
bugs1406478
milestone57.0
Bug 1406478 - Reintroduce browser.tabs.tabMinWidth hidden pref and set it to 76. r=jaws
browser/app/profile/firefox.js
browser/base/content/browser.css
browser/base/content/tabbrowser.xml
browser/themes/shared/tabs.inc.css
--- a/browser/app/profile/firefox.js
+++ b/browser/app/profile/firefox.js
@@ -450,16 +450,17 @@ pref("browser.tabs.warnOnCloseOtherTabs"
 pref("browser.tabs.warnOnOpen", true);
 pref("browser.tabs.maxOpenBeforeWarn", 15);
 pref("browser.tabs.loadInBackground", true);
 pref("browser.tabs.opentabfor.middleclick", true);
 pref("browser.tabs.loadDivertedInBackground", false);
 pref("browser.tabs.loadBookmarksInBackground", false);
 pref("browser.tabs.loadBookmarksInTabs", false);
 pref("browser.tabs.tabClipWidth", 140);
+pref("browser.tabs.tabMinWidth", 76);
 #ifdef UNIX_BUT_NOT_MAC
 pref("browser.tabs.drawInTitlebar", false);
 #else
 pref("browser.tabs.drawInTitlebar", true);
 #endif
 
 // Offer additional drag space to the user. The drag space
 // will only be shown if browser.tabs.drawInTitlebar is true.
--- a/browser/base/content/browser.css
+++ b/browser/base/content/browser.css
@@ -127,22 +127,27 @@ tabbrowser {
 
 .tabbrowser-tab {
   -moz-binding: url("chrome://browser/content/tabbrowser.xml#tabbrowser-tab");
 }
 
 .tabbrowser-tab:not([pinned]) {
   -moz-box-flex: 100;
   max-width: 225px;
-  min-width: 100px;
+  min-width: var(--tab-min-width);
   width: 0;
   transition: min-width 100ms ease-out,
               max-width 100ms ease-out;
 }
 
+:root[uidensity=touch] .tabbrowser-tab:not([pinned]) {
+  /* Touch mode needs additional space for the close button. */
+  min-width: calc(var(--tab-min-width) + 10px);
+}
+
 .tabbrowser-tab:not([pinned]):not([fadein]) {
   max-width: 0.1px;
   min-width: 0.1px;
   visibility: hidden;
 }
 
 .tab-close-button,
 .tab-background {
--- a/browser/base/content/tabbrowser.xml
+++ b/browser/base/content/tabbrowser.xml
@@ -5860,16 +5860,25 @@
       <method name="onAreaReset">
         <parameter name="aArea"/>
         <parameter name="aContainer"/>
         <body><![CDATA[
           this.onAreaNodeRegistered(aArea, aContainer);
         ]]></body>
       </method>
 
+      <field name="_tabMinWidthLimit">50</field>
+      <property name="tabMinWidth">
+        <setter><![CDATA[
+          let root = document.documentElement;
+          root.style.setProperty("--tab-min-width", val + "px");
+          return val;
+        ]]></setter>
+      </property>
+
       <constructor>
         <![CDATA[
           this.mCurrentBrowser = document.getAnonymousElementByAttribute(this, "anonid", "initialBrowser");
           this.mCurrentBrowser.permanentKey = {};
 
           CustomizableUI.addListener(this);
           this._updateNewTabVisibility();
 
@@ -5953,16 +5962,23 @@
           XPCOMUtils.defineLazyPreferenceGetter(this, "animationsEnabled",
                                                 "toolkit.cosmeticAnimations.enabled", true);
           XPCOMUtils.defineLazyPreferenceGetter(this, "tabWarmingEnabled",
                                                 "browser.tabs.remote.warmup.enabled", false);
           XPCOMUtils.defineLazyPreferenceGetter(this, "tabWarmingMax",
                                                 "browser.tabs.remote.warmup.maxTabs", 3);
           XPCOMUtils.defineLazyPreferenceGetter(this, "tabWarmingUnloadDelay" /* ms */,
                                                 "browser.tabs.remote.warmup.unloadDelayMs", 2000);
+          XPCOMUtils.defineLazyPreferenceGetter(this, "tabMinWidthPref",
+                                                "browser.tabs.tabMinWidth", this._tabMinWidthLimit,
+            (pref, prevValue, newValue) => this.tabMinWidth = newValue,
+            newValue => Math.max(newValue, this._tabMinWidthLimit),
+          );
+
+          this.tabMinWidth = this.tabMinWidthPref;
         ]]>
       </constructor>
 
       <method name="_generateUniquePanelID">
         <body><![CDATA[
           if (!this._uniquePanelIDCounter) {
             this._uniquePanelIDCounter = 0;
           }
--- a/browser/themes/shared/tabs.inc.css
+++ b/browser/themes/shared/tabs.inc.css
@@ -4,16 +4,17 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 %endif
 %filter substitution
 %define horizontalTabPadding 9px
 
 :root {
   --tab-toolbar-navbar-overlap: 1px;
   --tab-min-height: 33px;
+  --tab-min-width: 76px;
   --tab-loading-fill: #0A84FF;
 }
 
 :root[uidensity=compact] {
   --tab-min-height: 29px;
 }
 
 :root[uidensity=touch] {