Skip to content

Commit

Permalink
ColumnSet: Aspect Tree#expand to recompute scrollLeft
Browse files Browse the repository at this point in the history
This resolves an issue where skew occurs (until you scroll again) if you
expand a row, collapse it, scroll a column set, then re-expand it.

Thanks to @jdonaghue for help with porting and debugging this.

(cherry picked from commit 1122212)

Conflicts:
	test/intern/mixins/ColumnSet.js
  • Loading branch information
Kenneth G. Franqueiro committed Jun 9, 2015
1 parent 4d16df8 commit 3354df6
Show file tree
Hide file tree
Showing 2 changed files with 95 additions and 4 deletions.
20 changes: 18 additions & 2 deletions ColumnSet.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,9 +19,11 @@ define([

var colsetidAttr = 'data-dgrid-column-set-id';

function adjustScrollLeft(grid, row) {
function adjustScrollLeft(grid, root) {
// Adjusts the scroll position of each column set in each row under the given root.
// (root can be a row, or e.g. a tree parent row element's connected property to adjust children)
var scrollLefts = grid._columnSetScrollLefts;
query('.dgrid-column-set', row).forEach(function (element) {
query('.dgrid-column-set', root).forEach(function (element) {
element.scrollLeft = scrollLefts[element.getAttribute(colsetidAttr)];
});
}
Expand Down Expand Up @@ -183,6 +185,20 @@ define([
this.on('.dgrid-column-set:dgrid-cellfocusin', function (event) {
self._onColumnSetCellFocus(event, this);
});

if (typeof this.expand === 'function') {
aspect.after(this, 'expand', function (promise, args) {
promise.then(function () {
var row = self.row(args[0]);
if (self._expanded[row.id]) {
// scrollLeft changes can't take effect on collapsed child rows;
// ensure they are properly updated once re-expanded.
adjustScrollLeft(self, row.element.connected);
}
});
return promise;
});
}
},

columnSets: [],
Expand Down
79 changes: 77 additions & 2 deletions test/intern/mixins/ColumnSet.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,12 +3,17 @@ define([
'intern/chai!assert',
'dojo/_base/declare',
'dojo/aspect',
'dojo/Deferred',
'dojo/query',
'dgrid/test/data/createSyncStore',
'dgrid/test/data/createHierarchicalStore',
'dgrid/OnDemandGrid',
'dgrid/ColumnSet',
'dgrid/Keyboard'
], function (test, assert, declare, aspect, query, createSyncStore, OnDemandGrid, ColumnSet, Keyboard) {
'dgrid/Keyboard',
'dgrid/Tree'
], function (test, assert, declare, aspect, Deferred, query, createSyncStore, createHierarchicalStore,
OnDemandGrid, ColumnSet, Keyboard, Tree) {

var grid;
var handles;

Expand Down Expand Up @@ -93,4 +98,74 @@ define([
grid.focus(grid.cell(1, '1-0-1'));
});
});

test.suite('ColumnSet + Tree mixins', function () {
test.beforeEach(function () {
var TreeColumnSetGrid = declare([ OnDemandGrid, ColumnSet, Tree ]);
var data = [];

for (var i = 0; i < 5; i++) {
var parentId = '' + i;
data.push({
id: parentId,
name: 'Root ' + i
});
for (var k = 0; k < 5; k++) {
data.push({
id: i + ':' + k,
parent: parentId,
name: 'Child ' + k,
hasChildren: false
});
}
}

var store = createHierarchicalStore({
data: data
});

grid = new TreeColumnSetGrid({
collection: store,
enableTreeTransitions: false,
columnSets: [ [
[ { renderExpando: true, label: 'Name', field: 'name', sortable: false } ]
] ]
});

document.body.appendChild(grid.domNode);
grid.startup();
});

test.afterEach(function () {
for (var i = handles.length; i--;) {
handles[i].remove();
}
grid.destroy();
});

test.test('re-expand after horizontal scroll should restore correct scrollLeft', function () {
var scrollAmount = 250;
grid.styleColumn('0-0-0', 'width: 10000px;');

return grid.expand(0, true).then(function () {
return grid.expand(0, false);
}).then(function () {
var scrollDfd = new Deferred();
handles.push(aspect.after(grid, '_onColumnSetScroll', function () {
scrollDfd.resolve();
}));

grid._scrollColumnSet('0', scrollAmount);
return scrollDfd.promise;
}).then(function () {
return grid.expand(0, true);
}).then(function () {
var element = query('.dgrid-column-set-0 [data-dgrid-column-set-id="0"]',
grid.row('0:0').element)[0];

assert.strictEqual(element.scrollLeft, scrollAmount,
'Column Set should have expected scroll position for re-expanded rows');
});
});
});
});

0 comments on commit 3354df6

Please sign in to comment.