Adding a visibility property to cr.ui.table.TableColumn.

ui/webui/resources/js/cr/ui/table/table_header.js

Index: ui/webui/resources/js/cr/ui/table/table_header.js
diff --git a/ui/webui/resources/js/cr/ui/table/table_header.js b/ui/webui/resources/js/cr/ui/table/table_header.js
index a05b2644b508d0a4cbfef117f31ff2313c5345e0..00b291ba08da49d9a6fd774c1cb5108f70199887 100644
--- a/ui/webui/resources/js/cr/ui/table/table_header.js
+++ b/ui/webui/resources/js/cr/ui/table/table_header.js
@@ -95,6 +95,12 @@ cr.define('cr.ui.table', function() {
       for (var i = 0; i < cm.size; i++) {
         var cell = this.ownerDocument.createElement('div');
         cell.style.width = cm.getWidth(i) + 'px';
+        // Don't display cells for hidden columns.  Don't omit the cell

[Dan Beam, 2015/03/17 23:04:13]

\s\s -> \s

[Ben Kwa, 2015/03/18 16:13:50]

Done.

+        // completely, as it's much simpler if the number of cell elements and
+        // columns are in sync.
+        if (!cm.isVisible(i)) {

[Dan Beam, 2015/03/17 23:04:13]

no curlies

[Ben Kwa, 2015/03/18 16:13:51]

Done.

+          cell.style.display = 'none';
+        }
         cell.className = 'table-header-cell';
         if (dm.isSortable(cm.getId(i)))
           cell.addEventListener('click',
@@ -118,6 +124,12 @@ cr.define('cr.ui.table', function() {
         splitter.columnIndex = i;
         splitter.addEventListener('dblclick',
                               this.handleDblClick_.bind(this, i));

[Dan Beam, 2015/03/17 23:04:13]

splitter.addEventListener('dblclick',
                          this.handleDblClick_.bind(this, i));

[Ben Kwa, 2015/03/18 16:13:50]

Done.

+        // Don't display splitters for hidden columns.  Don't omit the splitter
+        // completely, as it's much simpler if the number of splitter elements
+        // and columns are in sync.
+        if (!cm.isVisible(i)) {
+          splitter.style.display = 'none';

[Dan Beam, 2015/03/17 23:04:13]

how exactly does this work?  this seems unintuitive depending on where/how
splitters work.

[Ben Kwa, 2015/03/18 02:48:11]

The arrays of splitters elements (and header cells, see above) are
index-corresponded with the array of columns in a number of places in this
class.  Rather than omit the hidden elements and then have to write special-case
iteration code, I figured it was easier to leave the elements in the DOM but
just hide them.

+        }
 
         this.headerInner_.appendChild(splitter);
         splitters.push(splitter);
@@ -211,7 +223,7 @@ cr.define('cr.ui.table', function() {
 
     /**
      * Handles the double click on a column separator event.
-     * Ajusts column width.
+     * Adjusts column width.
      * @param {number} index Column index.
      * @param {Event} e The double click event.
      */