Bug 1442582 - Remove the tabbrowser-tabpanels binding. r=dao

MozReview-Commit-ID: HcQgRbvcdiV

--HG--
extra : rebase_source : 4eaebcb9e651f5e5e90a5082cb04678b4739e585

browser/base/content/browser.xul

@@ -1242,8 +1242,7 @@
         <tabbox id="tabbrowser-tabbox"
                 flex="1" eventnode="document" tabcontainer="tabbrowser-tabs">
           <tabpanels id="tabbrowser-tabpanels"
-                     flex="1" class="plain" selectedIndex="0"
-                     onselect="if (event.target == this) gBrowser.updateCurrentBrowser();">
+                     flex="1" class="plain" selectedIndex="0">
             <notificationbox flex="1" notificationside="top">
               <!-- Set large flex to allow the devtools toolbox to set a flex attribute.
                    We don't want the toolbox to actually take up free space, but we do want it to collapse when the window shrinks, and with flex=0 it can't.

browser/base/content/tabbrowser.css

@@ -2,10 +2,6 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
-.tabbrowser-tabpanels {
-  -moz-binding: url("chrome://browser/content/tabbrowser.xml#tabbrowser-tabpanels");
-}
-
 .tabbrowser-arrowscrollbox {
   -moz-binding: url("chrome://browser/content/tabbrowser.xml#tabbrowser-arrowscrollbox");
 }

browser/base/content/tabbrowser.js

@@ -51,10 +51,6 @@ window._gBrowser = {
       messageManager.addMessageListener("DOMWindowClose", this);
       window.messageManager.addMessageListener("contextmenu", this);
       messageManager.addMessageListener("Browser:Init", this);
-
-      // If this window has remote tabs, switch to our tabpanels fork
-      // which does asynchronous tab switching.
-      this.tabpanels.classList.add("tabbrowser-tabpanels");
     } else {
       this._outerWindowIDBrowserMap.set(this.selectedBrowser.outerWindowID,
         this.selectedBrowser);
@@ -4184,6 +4180,18 @@ window._gBrowser = {
   },
 
   _setupEventListeners() {
+    this.tabpanels.addEventListener("select", event => {
+      if (event.target == this.tabpanels) {
+        this.updateCurrentBrowser();
+      }
+    });
+
+    this.tabpanels.addEventListener("preselect", event => {
+      if (gMultiProcessBrowser) {
+        this._getSwitcher().requestTab(event.detail);
+      }
+    });
+
     this.addEventListener("DOMWindowClose", (event) => {
       if (!event.isTrusted)
         return;

browser/base/content/tabbrowser.xml

@@ -2098,45 +2098,6 @@
     </handlers>
   </binding>
 
-  <binding id="tabbrowser-tabpanels"
-           extends="chrome://global/content/bindings/tabbox.xml#tabpanels">
-    <implementation>
-      <field name="_selectedIndex">0</field>
-
-      <property name="selectedIndex">
-        <getter>
-        <![CDATA[
-          return this._selectedIndex;
-        ]]>
-        </getter>
-
-        <setter>
-        <![CDATA[
-          if (val < 0 || val >= this.childNodes.length)
-            return val;
-
-          let toTab = this.getRelatedElement(this.childNodes[val]);
-
-          gBrowser._getSwitcher().requestTab(toTab);
-
-          var panel = this._selectedPanel;
-          var newPanel = this.childNodes[val];
-          this._selectedPanel = newPanel;
-          if (this._selectedPanel != panel) {
-            var event = document.createEvent("Events");
-            event.initEvent("select", true, true);
-            this.dispatchEvent(event);
-
-            this._selectedIndex = val;
-          }
-
-          return val;
-        ]]>
-        </setter>
-      </property>
-    </implementation>
-  </binding>
-
   <binding id="tabbrowser-browser"
            extends="chrome://global/content/bindings/browser.xml#browser">
     <implementation>

testing/mochitest/browser-test.js

@@ -244,8 +244,9 @@ function takeInstrumentation() {
 
   // The selector for just this element
   function immediateSelector(element) {
-    if (element.localName == "notificationbox" && element.parentNode &&
-        element.parentNode.classList.contains("tabbrowser-tabpanels")) {
+    if (element.localName == "notificationbox" &&
+        element.parentNode &&
+        element.parentNode.id == "tabbrowser-tabpanels") {
       // Don't do a full selector for a tabpanel's notificationbox
       return element.localName;
     }

toolkit/content/widgets/tabbox.xml

@@ -614,6 +614,12 @@
         <![CDATA[
           if (val < 0 || val >= this.childNodes.length)
             return val;
+
+          // Give the tabbrowser a chance to run logic regardless of
+          // whether the panel is going to change:
+          this.dispatchEvent(new CustomEvent("preselect",
+            { detail: this.getRelatedElement(this.childNodes[val]) }));
+
           var panel = this._selectedPanel;
           this._selectedPanel = this.childNodes[val];
           this.setAttribute("selectedIndex", val);