Bug 1503824 - Migrate the treecols binding into a custom element. r=bgrins

Author: Victor Porof

layout/generic/crashtests/crashtests.list

@@ -115,7 +115,7 @@ load 382199-1.html
 load 382208-1.xhtml
 load 382262-1.html
 load 382396-1.xhtml
-asserts(1) load 382745-1.xhtml # Bug 758695
+load 382745-1.xhtml # Bug 758695
 load 383089-1.html
 load 385265-1.xhtml
 load 385295-1.xhtml

toolkit/content/widgets/tree.js

@@ -410,4 +410,30 @@
 
   customElements.define("treecol", MozTreecol);
 
+  class MozTreecols extends MozElements.BaseControl {
+    connectedCallback() {
+      if (this.delayConnectedCallback()) {
+        return;
+      }
+
+      if (!this.querySelector("treecolpicker")) {
+        this.appendChild(MozXULElement.parseXULToFragment(`
+          <treecolpicker class="treecol-image" fixed="true"></treecolpicker>
+        `));
+      }
+
+      let treecolpicker = this.querySelector("treecolpicker");
+      this.inheritAttribute(treecolpicker, "tooltiptext=pickertooltiptext");
+
+      // Set resizeafter="farthest" on the splitters if nothing else has been
+      // specified.
+      Array.forEach(this.getElementsByTagName("splitter"), function(splitter) {
+        if (!splitter.hasAttribute("resizeafter"))
+          splitter.setAttribute("resizeafter", "farthest");
+      });
+    }
+  }
+
+  customElements.define("treecols", MozTreecols);
+
 }

toolkit/content/widgets/tree.xml

@@ -884,25 +884,6 @@
     </handlers>
   </binding>
 
-  <binding id="treecols">
-    <content orient="horizontal">
-      <xul:hbox class="tree-scrollable-columns" flex="1">
-        <children includes="treecol|splitter"/>
-      </xul:hbox>
-      <xul:treecolpicker class="treecol-image" fixed="true" xbl:inherits="tooltiptext=pickertooltiptext"/>
-    </content>
-    <implementation>
-      <constructor><![CDATA[
-        // Set resizeafter="farthest" on the splitters if nothing else has been
-        // specified.
-        Array.forEach(this.getElementsByTagName("splitter"), function(splitter) {
-          if (!splitter.hasAttribute("resizeafter"))
-            splitter.setAttribute("resizeafter", "farthest");
-        });
-      ]]></constructor>
-    </implementation>
-  </binding>
-
   <binding id="treerows" extends="chrome://global/content/bindings/general.xml#basecontrol">
     <content>
       <xul:hbox flex="1" class="tree-bodybox">
@@ -1008,6 +989,7 @@
             var menuitem = document.getAnonymousElementByAttribute(this, "anonid", "menuitem");
             if (event.originalTarget == menuitem) {
               tree.columns.restoreNaturalOrder();
+              this.removeAttribute("ordinal");
               tree._ensureColumnOrder();
             } else {
               var colindex = event.originalTarget.getAttribute("colindex");

toolkit/content/xul.css

@@ -438,11 +438,7 @@ tree {
   -moz-binding: url("chrome://global/content/bindings/tree.xml#tree");
 }
 
-treecols {
-  -moz-binding: url("chrome://global/content/bindings/tree.xml#treecols");
-}
-
-treecol {
+treecolpicker {
   -moz-box-ordinal-group: 2147483646;
 }
 
@@ -481,11 +477,6 @@ treecol[hidden="true"] {
   display: -moz-box;
 }
 
-.tree-scrollable-columns {
-  /* Yes, Virginia, this makes it scrollable */
-  overflow: hidden;
-}
-
 /* ::::: lines connecting cells ::::: */
 tree:not([treelines="true"]) > treechildren::-moz-tree-line {
   visibility: hidden;