Skip to content

Commit

Permalink
Disabling debounce optimization.
Browse files Browse the repository at this point in the history 
- We can optimize this later.
- But leaving the _updateCells refactoring.
  • Loading branch information
@manolo
manolo committed Sep 28, 2016
1 parent 40439ee commit 9262dc0
Show file tree
Hide file tree
Showing 3 changed files with 53 additions and 75 deletions.
76 changes: 30 additions & 46 deletions test/column.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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');
});
});

Expand All @@ -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)');
});
});
});
Expand Down
9 changes: 4 additions & 5 deletions test/headers-footers.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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) {
Expand All @@ -83,6 +80,8 @@
done();
});
});


});
</script>

Expand Down
43 changes: 19 additions & 24 deletions vaadin-grid-table-row.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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;

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;

// Visit colspanned cells to hide then and increase width and flex of parent
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;
}

cell.style.flexBasis = 'calc(' + width + ')';
cell.style.flexGrow = flex;
cell.style.display = '';
// columns > cells means that there is an extra col for multiselection
var multiSel = this.columns.length > this.cells.length ? 1 : 0;

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;

// Visit colspanned cells to hide then and increase width and flex of parent
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;
}
}.bind(this));

cell.style.flexBasis = 'calc(' + width + ')';
cell.style.flexGrow = flex;
cell.style.display = '';
}
},

_columnsChanged: function(e, target) {
Expand Down

0 comments on commit 9262dc0

Please sign in to comment.