From 00aed5e8a2657f9a2d6288eb6b971c852280d3bb Mon Sep 17 00:00:00 2001 From: Manolo Carrasco Date: Wed, 28 Sep 2016 11:38:27 +0200 Subject: [PATCH] Disabling debounce optimization. - We can optimize this later. - But leaving the _updateCells refactoring. --- test/column.html | 76 +++++++++++++++----------------------- test/headers-footers.html | 9 ++--- vaadin-grid-table-row.html | 21 ++++------- 3 files changed, 42 insertions(+), 64 deletions(-) diff --git a/test/column.html b/test/column.html index 00d1d7528..8e222a6d7 100644 --- a/test/column.html +++ b/test/column.html @@ -99,39 +99,32 @@ expect(container.flex).to.eql(2); }); - it('should be bound to header cells', function(done) { + it('should be bound to header cells', function() { column.flex = 2; + var header = grid.$.scroller.$.header; - grid.async(function(){ - expect(header._rows[0].cells[0].style.flexGrow).to.eql('2'); - expect(header._rows[1].cells[0].style.flexGrow).to.eql('3'); // colspan 2 + 1 - done(); - }); + + expect(header._rows[0].cells[0].style.flexGrow).to.eql('2'); + expect(header._rows[1].cells[0].style.flexGrow).to.eql('3'); // colspan 2 + 1 }); - it('should be bound to row cells', function(done) { + it('should be bound to row cells', function() { column.flex = 2; - grid.async(function() { - expect(grid.$.scroller._physicalItems[0].cells[0].style.flexGrow).to.eql('2'); - done(); - }); + + expect(grid.$.scroller._physicalItems[0].cells[0].style.flexGrow).to.eql('2'); }); - it('should be bound to row cells on multiSelection', function(done) { + it('should be bound to row cells on multiSelection', function() { grid.multiSelection = true; column.flex = 2; - grid.async(function() { - expect(grid.$.scroller._physicalItems[0].cells[1].style.flexGrow).to.eql('2'); - done(); - }); + + expect(grid.$.scroller._physicalItems[0].cells[1].style.flexGrow).to.eql('2'); }); - it('should be bound to footer cells', function(done) { + it('should be bound to footer cells', function() { column.flex = 2; - grid.async(function() { - expect(grid.$.scroller.$.footer._rows[0].cells[0].style.flexGrow).to.eql('2'); - done(); - }); + + expect(grid.$.scroller.$.footer._rows[0].cells[0].style.flexGrow).to.eql('2'); }); }); @@ -140,46 +133,37 @@ expect(column.width).to.eql('100px'); }); - it('should notify changes to width', function(done) { + it('should notify changes to width', function() { column.width = '200px'; - grid.async(function() { - expect(container.width).to.eql('200px'); - done(); - }); + + expect(container.width).to.eql('200px'); }); - it('should be bound to header cells', function(done) { + it('should be bound to header cells', function() { column.width = '200px'; + var header = grid.$.scroller.$.header; - grid.async(function() { - expect(header._rows[0].cells[0].style.flexBasis).to.eql('calc(200px)'); - done(); - }); + + expect(header._rows[0].cells[0].style.flexBasis).to.eql('calc(200px)'); }); - it('should be bound to row cells', function(done) { + it('should be bound to row cells', function() { column.width = '200px'; - grid.async(function() { - expect(grid.$.scroller._physicalItems[0].cells[0].style.flexBasis).to.eql('calc(200px)'); - done(); - }); + + expect(grid.$.scroller._physicalItems[0].cells[0].style.flexBasis).to.eql('calc(200px)'); }); - it('should be bound to row cells on multiSelection', function(done) { + it('should be bound to row cells on multiSelection', function() { grid.multiSelection = true; column.width = '200px'; - grid.async(function() { - expect(grid.$.scroller._physicalItems[0].cells[1].style.flexBasis).to.eql('calc(200px)'); - done(); - }); + + expect(grid.$.scroller._physicalItems[0].cells[1].style.flexBasis).to.eql('calc(200px)'); }); - it('should be bound to footer cells', function(done) { + it('should be bound to footer cells', function() { column.width = '200px'; - grid.async(function() { - expect(grid.$.scroller.$.footer._rows[0].cells[0].style.flexBasis).to.eql('calc(200px)'); - done(); - }); + + expect(grid.$.scroller.$.footer._rows[0].cells[0].style.flexBasis).to.eql('calc(200px)'); }); }); }); diff --git a/test/headers-footers.html b/test/headers-footers.html index 8c6373bc5..66ad1d100 100644 --- a/test/headers-footers.html +++ b/test/headers-footers.html @@ -64,14 +64,11 @@ expect(getRowCells(headerRows[1])[0].colspan).to.equal(2); }); - it('should render colspan correctly', function(done) { + it('should render colspan correctly', function() { window.getComputedStyle(getRowCells(headerRows[1])[1]).display === 'none'; var firstRowCells = getRowCells(headerRows[0]); var combinedWidth = firstRowCells[0].clientWidth + firstRowCells[1].clientWidth; - grid.async(function() { - expect(getRowCells(headerRows[1])[0].clientWidth).to.equal(combinedWidth); - done(); - }); + expect(getRowCells(headerRows[1])[0].clientWidth).to.equal(combinedWidth); }); it('should have last row fully visible when scrolled to end', function(done) { @@ -83,6 +80,8 @@ done(); }); }); + + }); diff --git a/vaadin-grid-table-row.html b/vaadin-grid-table-row.html index 1acffbfb2..29508f690 100644 --- a/vaadin-grid-table-row.html +++ b/vaadin-grid-table-row.html @@ -99,31 +99,26 @@ }, _updateCells: function() { - // debouncing reduces the call - // - from 60 to 4 in a grid with 2 headers with 5 columns. - // - from 416 to 30 in the same grid with data and one footer. - this.debounce('_updateCells', function() { - // columns > cells means that there is an extra col for multiselection - var multiSel = this.columns.length > this.cells.length ? 1 : 0; - + if (this.columns.length == this.cells.length) { for (var i = 0, l = this.cells.length, colspan; i < l; i += colspan) { var cell = this.cells[i]; colspan = cell.colspan || 1; - var width = this.columns[i + multiSel].width; - var flex = this.columns[i + multiSel].flex; + var width = this.columns[i].width; + var flex = this.columns[i].flex; - // Visit colspanned cells to hide then and increase width and flex of parent + // Visit colspanned cells to hide them, and increase parent width and flex. for (var j = 1; j < colspan && i + j < l; j++) { this.cells[i + j].style.display = 'none'; - width = width + ' + ' + this.columns[i + multiSel + j].width; - flex += this.columns[i + multiSel + j].flex; + + width += ' + ' + this.columns[i + j].width; + flex += this.columns[i + j].flex; } cell.style.flexBasis = 'calc(' + width + ')'; cell.style.flexGrow = flex; cell.style.display = ''; } - }.bind(this)); + } }, _columnsChanged: function(e, target) {