Merge pull request #2107 from plotly/table-restyle-squashed

Improvements to table: `restyle` fix, 0 row/column and misc. fixes; jasmine tests

Author: monfera

src/traces/table/attributes.js

@@ -48,7 +48,10 @@ module.exports = overrideAll({
         arrayOk: true,
         dflt: null,
         role: 'style',
-        description: 'The width of cells.'
+        description: [
+            'The width of columns expressed as a ratio. Columns fill the available width',
+            'in proportion of their specified column widths.'
+        ].join(' ')
     },
 
     columnorder: {

src/traces/table/data_preparation_helper.js

@@ -16,11 +16,12 @@ module.exports = function calc(gd, trace) {
     var headerValues = trace.header.values.map(function(c) {
         return Array.isArray(c) ? c : [c];
     });
+    var cellsValues = trace.cells.values;
     var domain = trace.domain;
     var groupWidth = Math.floor(gd._fullLayout._size.w * (domain.x[1] - domain.x[0]));
     var groupHeight = Math.floor(gd._fullLayout._size.h * (domain.y[1] - domain.y[0]));
-    var headerRowHeights = headerValues[0].map(function() {return trace.header.height;});
-    var rowHeights = trace.cells.values[0].map(function() {return trace.cells.height;});
+    var headerRowHeights = headerValues.length ? headerValues[0].map(function() {return trace.header.height;}) : [];
+    var rowHeights = cellsValues.length ? cellsValues[0].map(function() {return trace.cells.height;}) : [];
     var headerHeight = headerRowHeights.reduce(function(a, b) {return a + b;}, 0);
     var scrollHeight = groupHeight - headerHeight;
     var minimumFillHeight = scrollHeight + c.uplift;

src/traces/table/defaults.js

@@ -11,9 +11,9 @@
 var Lib = require('../../lib');
 var attributes = require('./attributes');
 
-function defaultColumnOrder(traceIn, coerce) {
-    var specifiedColumnOrder = traceIn.columnorder || [];
-    var commonLength = traceIn.header.values.length;
+function defaultColumnOrder(traceOut, coerce) {
+    var specifiedColumnOrder = traceOut.columnorder || [];
+    var commonLength = traceOut.header.values.length;
     var truncated = specifiedColumnOrder.slice(0, commonLength);
     var sorted = truncated.slice().sort(function(a, b) {return a - b;});
     var oneStepped = truncated.map(function(d) {return sorted.indexOf(d);});
@@ -28,28 +28,10 @@ module.exports = function supplyDefaults(traceIn, traceOut, defaultColor, layout
         return Lib.coerce(traceIn, traceOut, attributes, attr, dflt);
     }
 
-    var fontDflt = {
-        family: layout.font.family,
-        size: layout.font.size,
-        color: layout.font.color
-    };
-
     coerce('domain.x');
     coerce('domain.y');
 
     coerce('columnwidth');
-    defaultColumnOrder(traceIn, coerce);
-
-    coerce('cells.values');
-    coerce('cells.format');
-    coerce('cells.align');
-    coerce('cells.prefix');
-    coerce('cells.suffix');
-    coerce('cells.height');
-    coerce('cells.line.width');
-    coerce('cells.line.color');
-    coerce('cells.fill.color');
-    Lib.coerceFont(coerce, 'cells.font', fontDflt);
 
     coerce('header.values');
     coerce('header.format');
@@ -61,5 +43,18 @@ module.exports = function supplyDefaults(traceIn, traceOut, defaultColor, layout
     coerce('header.line.width');
     coerce('header.line.color');
     coerce('header.fill.color');
-    Lib.coerceFont(coerce, 'header.font', fontDflt);
+    Lib.coerceFont(coerce, 'header.font', Lib.extendFlat({}, layout.font));
+
+    defaultColumnOrder(traceOut, coerce);
+
+    coerce('cells.values');
+    coerce('cells.format');
+    coerce('cells.align');
+    coerce('cells.prefix');
+    coerce('cells.suffix');
+    coerce('cells.height');
+    coerce('cells.line.width');
+    coerce('cells.line.color');
+    coerce('cells.fill.color');
+    Lib.coerceFont(coerce, 'cells.font', Lib.extendFlat({}, layout.font));
 };

src/traces/table/index.js

@@ -18,7 +18,7 @@ Table.plot = require('./plot');
 Table.moduleType = 'trace';
 Table.name = 'table';
 Table.basePlotModule = require('./base_plot');
-Table.categories = [];
+Table.categories = ['noOpacity'];
 Table.meta = {
     description: [
         'Table view for detailed data viewing.',

src/traces/table/plot.js

@@ -93,6 +93,8 @@ module.exports = function plot(gd, wrappedTraceHolders) {
         .append('g')
         .classed(c.cn.yColumn, true);
 
+    yColumn.exit().remove();
+
     yColumn
         .attr('transform', function(d) {return 'translate(' + d.x + ' 0)';})
         .call(d3.behavior.drag()
@@ -242,7 +244,7 @@ function renderScrollbarKit(tableControlView, gd, bypassVisibleBar) {
 
     function calcTotalHeight(d) {
         var blocks = d.rowBlocks;
-        return firstRowAnchor(blocks, blocks.length - 1) + rowsHeight(blocks[blocks.length - 1], Infinity);
+        return firstRowAnchor(blocks, blocks.length - 1) + (blocks.length ? rowsHeight(blocks[blocks.length - 1], Infinity) : 1);
     }
 
     var scrollbarKit = tableControlView.selectAll('.' + c.cn.scrollbarKit)
@@ -288,7 +290,7 @@ function renderScrollbarKit(tableControlView, gd, bypassVisibleBar) {
 
     scrollbarSlider
         .attr('transform', function(d) {
-            return 'translate(0 ' + d.scrollbarState.topY + ')';
+            return 'translate(0 ' + (d.scrollbarState.topY || 0) + ')';
         });
 
     var scrollbarGlyph = scrollbarSlider.selectAll('.' + c.cn.scrollbarGlyph)
@@ -603,7 +605,7 @@ function headerBlock(d) {return d.type === 'header';}
  */
 
 function headerHeight(d) {
-    var headerBlocks = d.rowBlocks[0].auxiliaryBlocks;
+    var headerBlocks = d.rowBlocks.length ? d.rowBlocks[0].auxiliaryBlocks : [];
     return headerBlocks.reduce(function(p, n) {return p + rowsHeight(n, Infinity);}, 0);
 }
 
@@ -643,6 +645,7 @@ function findPagesAndCacheHeights(blocks, scrollY, scrollHeight) {
 
 function updateBlockYPosition(gd, cellsColumnBlock, tableControlView) {
     var d = flatData(cellsColumnBlock)[0];
+    if(d === undefined) return;
     var blocks = d.rowBlocks;
     var calcdata = d.calcdata;