Devtools: DataGrid: do not render hidden columns.

Previous implementation used display:none to hide columns.
This caused UI glitches, tremble on resize and performance issues.

In new implementation hidden columns are not rendered at all.

BUG=372246

Review URL: https://codereview.chromium.org/297893003

git-svn-id: svn://svn.chromium.org/blink/trunk@175273 bbb929c8-8fbe-4397-9dbb-9b2b20218538

third_party/WebKit/LayoutTests/inspector/profiler/heap-snapshot-test.js

@@ -577,12 +577,13 @@ InspectorTest.columnContents = function(column, row)
 {
     // Make sure invisible nodes are removed from the view port.
     this._currentGrid().updateVisibleNodes();
+    var columnOrdinal = InspectorTest.viewColumns().indexOf(column);
     var result = [];
     var parent = row || this._currentGrid().rootNode();
     for (var node = parent.children[0]; node; node = node.traverseNextNode(true, parent, true)) {
         if (!node.selectable)
             continue;
-        var content = node.element.children[column.ordinal];
+        var content = node.element.children[columnOrdinal];
         // Do not inlcude percents
         if (content.firstElementChild)
             content = content.firstElementChild;

third_party/WebKit/Source/devtools/front_end/ui/ShowMoreDataGridNode.js

@@ -91,24 +91,30 @@ WebInspector.ShowMoreDataGridNode.prototype = {
         this.showAll.textContent = WebInspector.UIString("Show all %d", totalSize);
     },
 
+    /** override */
     createCells: function()
     {
-        var cell = document.createElement("td");
-        if (this.depth)
-            cell.style.setProperty("padding-left", (this.depth * this.dataGrid.indentWidth) + "px");
-        cell.appendChild(this.showNext);
-        cell.appendChild(this.showAll);
-        cell.appendChild(this.showLast);
-        this._element.appendChild(cell);
-
-        var columns = this.dataGrid.columns;
-        var count = 0;
-        for (var c in columns)
-            ++count;
-        while (--count > 0) {
-            cell = document.createElement("td");
-            this._element.appendChild(cell);
+        this._hasCells = false;
+        WebInspector.DataGridNode.prototype.createCells.call(this);
+    },
+
+    /**
+     * @override
+     * @param {string} columnIdentifier
+     * @return {!Element}
+     */
+    createCell: function(columnIdentifier)
+    {
+        var cell = this.createTD(columnIdentifier);
+        if (!this._hasCells) {
+            this._hasCells = true;
+            if (this.depth)
+                cell.style.setProperty("padding-left", (this.depth * this.dataGrid.indentWidth) + "px");
+            cell.appendChild(this.showNext);
+            cell.appendChild(this.showAll);
+            cell.appendChild(this.showLast);
         }
+        return cell;
     },
 
     /**