Bug 1404465 - Add browser.tabs.tabMinWidth to control minimum tab width, and set to 50 by default. r=jaws

MozReview-Commit-ID: IK1hgAMyrYD

--HG--
extra : rebase_source : ce2a0d79626a38d3d56f9b669c3aa648eafb499f

browser/app/profile/firefox.js

@@ -487,6 +487,9 @@ pref("browser.tabs.showAudioPlayingIcon", true);
 // This should match Chromium's audio indicator delay.
 pref("browser.tabs.delayHidingAudioPlayingIconMS", 3000);
 
+// The minimum tab width in pixels
+pref("browser.tabs.tabMinWidth", 50);
+
 pref("browser.ctrlTab.previews", false);
 
 // By default, do not export HTML at shutdown.

browser/base/content/browser.css

@@ -10,6 +10,7 @@
   --lwt-additional-images: none;
   --lwt-background-alignment: right top;
   --lwt-background-tiling: no-repeat;
+  --tab-min-width: 50px;
 }
 
 :root:-moz-lwtheme {
@@ -132,7 +133,7 @@ tabbrowser {
 .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;

browser/base/content/tabbrowser.xml

@@ -5814,6 +5814,15 @@
         ]]></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");
@@ -5904,6 +5913,13 @@
                                                 "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>