Skip to content

Commit d8700f4

Browse files
rmkrmkgedinakova
rmkrmk
authored and
gedinakova
committed
IgxTreeGrid - Adding more tests (#2910)
1 parent 6095aae commit d8700f4

File tree

2 files changed

+251
-16
lines changed

2 files changed

+251
-16
lines changed

‎projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid-expanding.spec.ts

+240-6
Original file line numberDiff line numberDiff line change
@@ -214,7 +214,22 @@ describe('IgxTreeGrid - Expanding / Collapsing', () => {
214214
expect(rows.length).toBe(4, 'root level row collapsing problem');
215215
});
216216

217-
it('should emits an event when expanding rows (API)', (done) => {
217+
it('should expand/collapse when using \'expandAll\' and \'collapseAll\' methods', () => {
218+
treeGrid.perPage = 50;
219+
220+
let rows = TreeGridFunctions.getAllRows(fix);
221+
expect(rows.length).toBe(4);
222+
223+
treeGrid.expandAll();
224+
rows = TreeGridFunctions.getAllRows(fix);
225+
expect(rows.length).toBe(12);
226+
227+
treeGrid.collapseAll();
228+
rows = TreeGridFunctions.getAllRows(fix);
229+
expect(rows.length).toBe(4);
230+
});
231+
232+
it('should emit an event when expanding rows (API)', (done) => {
218233
const aRow = treeGrid.getRowByIndex(0);
219234
treeGrid.onRowToggle.pipe(first()).subscribe((args) => {
220235
expect(args.cancel).toBe(false);
@@ -226,7 +241,7 @@ describe('IgxTreeGrid - Expanding / Collapsing', () => {
226241
aRow.expanded = true;
227242
});
228243

229-
it('should emits an event when collapsing rows (API)', (done) => {
244+
it('should emit an event when collapsing rows (API)', (done) => {
230245
const aRow = treeGrid.getRowByIndex(0);
231246
aRow.expanded = true;
232247
treeGrid.onRowToggle.pipe(first()).subscribe((args) => {
@@ -239,7 +254,7 @@ describe('IgxTreeGrid - Expanding / Collapsing', () => {
239254
aRow.expanded = false;
240255
});
241256

242-
it('should emits an event when expanding rows (UI)', (done) => {
257+
it('should emit an event when expanding rows (UI)', (done) => {
243258
treeGrid.onRowToggle.pipe(first()).subscribe((args) => {
244259
expect(args.cancel).toBe(false);
245260
expect(args.event).toBeDefined();
@@ -252,7 +267,7 @@ describe('IgxTreeGrid - Expanding / Collapsing', () => {
252267
indicatorDivDOM.triggerEventHandler('click', new Event('click'));
253268
});
254269

255-
it('should emits an event when collapsing rows (UI)', (done) => {
270+
it('should emit an event when collapsing rows (UI)', (done) => {
256271
const rowsDOM = TreeGridFunctions.getAllRows(fix);
257272
const indicatorDivDOM = TreeGridFunctions.getExpansionIndicatorDiv(rowsDOM[0]);
258273
indicatorDivDOM.triggerEventHandler('click', new Event('click'));
@@ -305,7 +320,7 @@ describe('IgxTreeGrid - Expanding / Collapsing', () => {
305320
fix.detectChanges();
306321
});
307322

308-
it('check row expanding and collapsing are changing rows count using flat data source (UI)', () => {
323+
it('check row expanding and collapsing are changing rows count (UI)', () => {
309324
let rows = TreeGridFunctions.getAllRows(fix);
310325
expect(rows.length).toBe(3);
311326

@@ -321,7 +336,7 @@ describe('IgxTreeGrid - Expanding / Collapsing', () => {
321336
expect(rows.length).toBe(3);
322337
});
323338

324-
it('check row expanding and collapsing are changing rows count using flat data source (API)', () => {
339+
it('check row expanding and collapsing are changing rows count (API)', () => {
325340
let rows = TreeGridFunctions.getAllRows(fix);
326341
expect(rows.length).toBe(3);
327342

@@ -334,6 +349,225 @@ describe('IgxTreeGrid - Expanding / Collapsing', () => {
334349
expect(rows.length).toBe(3);
335350
});
336351

352+
it('check expand/collapse indicator changes (UI)', () => {
353+
const rows = TreeGridFunctions.getAllRows(fix);
354+
rows.forEach(row => {
355+
TreeGridFunctions.verifyTreeRowHasCollapsedIcon(row);
356+
});
357+
358+
for (let rowToToggle = 0; rowToToggle < rows.length; rowToToggle++) {
359+
const indicatorDiv = TreeGridFunctions.getExpansionIndicatorDiv(rows[rowToToggle]);
360+
indicatorDiv.triggerEventHandler('click', new Event('click'));
361+
362+
for (let rowToCheck = 0; rowToCheck < rows.length; rowToCheck++) {
363+
if (rowToCheck === rowToToggle) {
364+
TreeGridFunctions.verifyTreeRowHasExpandedIcon(rows[rowToCheck]);
365+
} else {
366+
TreeGridFunctions.verifyTreeRowHasCollapsedIcon(rows[rowToCheck]);
367+
}
368+
}
369+
370+
indicatorDiv.triggerEventHandler('click', new Event('click'));
371+
}
372+
373+
rows.forEach(row => {
374+
TreeGridFunctions.verifyTreeRowHasCollapsedIcon(row);
375+
});
376+
});
377+
378+
it('check expand/collapse indicator changes (API)', () => {
379+
const rows = TreeGridFunctions.getAllRows(fix);
380+
rows.forEach(row => {
381+
TreeGridFunctions.verifyTreeRowHasCollapsedIcon(row);
382+
});
383+
384+
for (let rowToToggle = 0; rowToToggle < rows.length; rowToToggle++) {
385+
treeGrid.toggleRow(treeGrid.getRowByIndex(rowToToggle).rowID);
386+
for (let rowToCheck = 0; rowToCheck < rows.length; rowToCheck++) {
387+
if (rowToCheck === rowToToggle) {
388+
TreeGridFunctions.verifyTreeRowHasExpandedIcon(rows[rowToCheck]);
389+
} else {
390+
TreeGridFunctions.verifyTreeRowHasCollapsedIcon(rows[rowToCheck]);
391+
}
392+
}
393+
treeGrid.toggleRow(treeGrid.getRowByIndex(rowToToggle).rowID);
394+
}
395+
396+
rows.forEach(row => {
397+
TreeGridFunctions.verifyTreeRowHasCollapsedIcon(row);
398+
});
399+
});
400+
401+
it('check second level records are having the correct indentation (UI)', () => {
402+
const rows = TreeGridFunctions.getAllRows(fix);
403+
const indicatorDiv = TreeGridFunctions.getExpansionIndicatorDiv(rows[0]);
404+
indicatorDiv.triggerEventHandler('click', new Event('click'));
405+
406+
TreeGridFunctions.verifyRowIndentationLevelByIndex(fix, 1, 1); // fix, rowIndex, expectedLevel
407+
TreeGridFunctions.verifyRowIndentationLevelByIndex(fix, 2, 1);
408+
TreeGridFunctions.verifyRowIndentationLevelByIndex(fix, 3, 0);
409+
});
410+
411+
it('check second level records are having the correct indentation (API)', () => {
412+
treeGrid.toggleRow(treeGrid.getRowByIndex(0).rowID);
413+
414+
TreeGridFunctions.verifyRowIndentationLevelByIndex(fix, 1, 1); // fix, rowIndex, expectedLevel
415+
TreeGridFunctions.verifyRowIndentationLevelByIndex(fix, 2, 1);
416+
TreeGridFunctions.verifyRowIndentationLevelByIndex(fix, 3, 0);
417+
});
418+
419+
it('check third level records are having the correct indentation (UI)', () => {
420+
// expand second level records
421+
let rows = TreeGridFunctions.getAllRows(fix);
422+
let indicatorDiv = TreeGridFunctions.getExpansionIndicatorDiv(rows[0]);
423+
indicatorDiv.triggerEventHandler('click', new Event('click'));
424+
425+
// expand third level record
426+
rows = TreeGridFunctions.getAllRows(fix);
427+
indicatorDiv = TreeGridFunctions.getExpansionIndicatorDiv(rows[1]);
428+
indicatorDiv.triggerEventHandler('click', new Event('click'));
429+
430+
// check third level records indentation
431+
TreeGridFunctions.verifyRowIndentationLevelByIndex(fix, 2, 2); // fix, rowIndex, expectedLevel
432+
TreeGridFunctions.verifyRowIndentationLevelByIndex(fix, 3, 2);
433+
});
434+
435+
it('check third level records are having the correct indentation (API)', () => {
436+
// expand second level records
437+
treeGrid.toggleRow(treeGrid.getRowByIndex(0).rowID);
438+
439+
// expand third level record
440+
treeGrid.toggleRow(treeGrid.getRowByIndex(1).rowID);
441+
442+
// check third level records indentation
443+
TreeGridFunctions.verifyRowIndentationLevelByIndex(fix, 2, 2); // fix, rowIndex, expectedLevel
444+
TreeGridFunctions.verifyRowIndentationLevelByIndex(fix, 3, 2);
445+
});
446+
447+
it('check grand children are not visible when collapsing their grand parent', () => {
448+
let rows = TreeGridFunctions.getAllRows(fix);
449+
expect(rows.length).toBe(3);
450+
451+
// expand second level records
452+
treeGrid.toggleRow(treeGrid.getRowByIndex(0).rowID);
453+
454+
// expand third level record
455+
treeGrid.toggleRow(treeGrid.getRowByIndex(1).rowID);
456+
457+
rows = TreeGridFunctions.getAllRows(fix);
458+
expect(rows.length).toBe(7);
459+
460+
// collapse first row with all its children and grand children
461+
treeGrid.toggleRow(treeGrid.getRowByIndex(0).rowID);
462+
463+
rows = TreeGridFunctions.getAllRows(fix);
464+
expect(rows.length).toBe(3);
465+
});
466+
467+
it('should expand/collapse rows when changing the \'expanded\' property', () => {
468+
let rows = TreeGridFunctions.getAllRows(fix);
469+
expect(rows.length).toBe(3);
470+
471+
// expand a root level row
472+
let aRow = treeGrid.getRowByIndex(0);
473+
expect(aRow.cells.first.value).toBe(1, 'wrong root level row');
474+
expect(aRow.expanded).toBe(false);
475+
aRow.expanded = true;
476+
rows = TreeGridFunctions.getAllRows(fix);
477+
expect(rows.length).toBe(5, 'root level row expanding problem');
478+
479+
// expand a second level row
480+
aRow = treeGrid.getRowByIndex(1);
481+
expect(aRow.cells.first.value).toBe(2, 'wrong second level row');
482+
expect(aRow.expanded).toBe(false);
483+
aRow.expanded = true;
484+
rows = TreeGridFunctions.getAllRows(fix);
485+
expect(rows.length).toBe(7, 'second level row expanding problem');
486+
487+
// check third level rows are having the correct values
488+
aRow = treeGrid.getRowByIndex(2);
489+
expect(aRow.cells.first.value).toBe(3, 'wrong third level row');
490+
aRow = treeGrid.getRowByIndex(3);
491+
expect(aRow.cells.first.value).toBe(7, 'wrong third level row');
492+
493+
// collapse a second level row
494+
aRow = treeGrid.getRowByIndex(1);
495+
aRow.expanded = false;
496+
rows = TreeGridFunctions.getAllRows(fix);
497+
expect(rows.length).toBe(5, 'second level row collapsing problem');
498+
499+
// collapse a root level row
500+
aRow = treeGrid.getRowByIndex(0);
501+
aRow.expanded = false;
502+
rows = TreeGridFunctions.getAllRows(fix);
503+
expect(rows.length).toBe(3, 'root level row collapsing problem');
504+
});
505+
506+
it('should expand/collapse when using \'expandAll\' and \'collapseAll\' methods', () => {
507+
let rows = TreeGridFunctions.getAllRows(fix);
508+
expect(rows.length).toBe(3);
509+
510+
treeGrid.expandAll();
511+
rows = TreeGridFunctions.getAllRows(fix);
512+
expect(rows.length).toBe(8);
513+
514+
treeGrid.collapseAll();
515+
rows = TreeGridFunctions.getAllRows(fix);
516+
expect(rows.length).toBe(3);
517+
});
518+
519+
it('should emit an event when expanding rows (API)', (done) => {
520+
const aRow = treeGrid.getRowByIndex(0);
521+
treeGrid.onRowToggle.pipe(first()).subscribe((args) => {
522+
expect(args.cancel).toBe(false);
523+
expect(args.event).toBeUndefined();
524+
expect(args.expanded).toBe(true);
525+
expect(args.rowID).toBe(1);
526+
done();
527+
});
528+
aRow.expanded = true;
529+
});
530+
531+
it('should emit an event when collapsing rows (API)', (done) => {
532+
const aRow = treeGrid.getRowByIndex(0);
533+
aRow.expanded = true;
534+
treeGrid.onRowToggle.pipe(first()).subscribe((args) => {
535+
expect(args.cancel).toBe(false);
536+
expect(args.event).toBeUndefined();
537+
expect(args.expanded).toBe(false);
538+
expect(args.rowID).toBe(1);
539+
done();
540+
});
541+
aRow.expanded = false;
542+
});
543+
544+
it('should emit an event when expanding rows (UI)', (done) => {
545+
treeGrid.onRowToggle.pipe(first()).subscribe((args) => {
546+
expect(args.cancel).toBe(false);
547+
expect(args.event).toBeDefined();
548+
expect(args.expanded).toBe(true);
549+
expect(args.rowID).toBe(1);
550+
done();
551+
});
552+
const rowsDOM = TreeGridFunctions.getAllRows(fix);
553+
const indicatorDivDOM = TreeGridFunctions.getExpansionIndicatorDiv(rowsDOM[0]);
554+
indicatorDivDOM.triggerEventHandler('click', new Event('click'));
555+
});
556+
557+
it('should emit an event when collapsing rows (UI)', (done) => {
558+
const rowsDOM = TreeGridFunctions.getAllRows(fix);
559+
const indicatorDivDOM = TreeGridFunctions.getExpansionIndicatorDiv(rowsDOM[0]);
560+
indicatorDivDOM.triggerEventHandler('click', new Event('click'));
561+
treeGrid.onRowToggle.pipe(first()).subscribe((args) => {
562+
expect(args.cancel).toBe(false);
563+
expect(args.event).toBeDefined();
564+
expect(args.expanded).toBe(false);
565+
expect(args.rowID).toBe(1);
566+
done();
567+
});
568+
indicatorDivDOM.triggerEventHandler('click', new Event('click'));
569+
});
570+
337571
it('should update current page when \'collapseAll\' ', () => {
338572
pending('Tree Grid issue: curent page is not updated when collapseAll');
339573
// Test prerequisites

‎projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid-selection.spec.ts

+11-10
Original file line numberDiff line numberDiff line change
@@ -29,13 +29,13 @@ describe('IgxTreeGrid - Selection', () => {
2929

3030
describe('API Row Selection', () => {
3131
configureTestSuite();
32-
beforeEach(() => {
32+
beforeEach(async() => {
3333
fix = TestBed.createComponent(IgxTreeGridSimpleComponent);
3434
fix.detectChanges();
3535

3636
treeGrid = fix.componentInstance.treeGrid;
3737
treeGrid.rowSelectable = true;
38-
treeGrid.primaryKey = 'ID';
38+
await wait();
3939
fix.detectChanges();
4040
});
4141

@@ -133,13 +133,15 @@ describe('IgxTreeGrid - Selection', () => {
133133
fix.detectChanges();
134134

135135
treeGrid.filter('Age', 40, IgxNumberFilteringOperand.instance().condition('greaterThan'));
136+
fix.detectChanges();
136137
tick(100);
137138

138139
// Verification indices are different since the sorting changes rows' positions.
139140
TreeGridFunctions.verifyDataRowsSelection(fix, [0, 2, 4], true);
140141
TreeGridFunctions.verifyHeaderCheckboxSelection(fix, null);
141142

142143
treeGrid.clearFilter();
144+
fix.detectChanges();
143145
tick(100);
144146

145147
TreeGridFunctions.verifyDataRowsSelection(fix, [0, 5, 8], true);
@@ -196,13 +198,13 @@ describe('IgxTreeGrid - Selection', () => {
196198

197199
describe('UI Row Selection', () => {
198200
configureTestSuite();
199-
beforeEach(() => {
201+
beforeEach(async() => {
200202
fix = TestBed.createComponent(IgxTreeGridSimpleComponent);
201203
fix.detectChanges();
202204

203205
treeGrid = fix.componentInstance.treeGrid;
204206
treeGrid.rowSelectable = true;
205-
treeGrid.primaryKey = 'ID';
207+
await wait();
206208
fix.detectChanges();
207209
});
208210

@@ -293,13 +295,15 @@ describe('IgxTreeGrid - Selection', () => {
293295
TreeGridFunctions.clickRowSelectionCheckbox(fix, 8);
294296

295297
treeGrid.filter('Age', 40, IgxNumberFilteringOperand.instance().condition('greaterThan'));
298+
fix.detectChanges();
296299
tick(100);
297300

298301
// Verification indices are different since the sorting changes rows' positions.
299302
TreeGridFunctions.verifyDataRowsSelection(fix, [0, 2, 4], true);
300303
TreeGridFunctions.verifyHeaderCheckboxSelection(fix, null);
301304

302305
treeGrid.clearFilter();
306+
fix.detectChanges();
303307
tick(100);
304308

305309
TreeGridFunctions.verifyDataRowsSelection(fix, [0, 5, 8], true);
@@ -380,9 +384,6 @@ describe('IgxTreeGrid - Selection', () => {
380384
fix.detectChanges();
381385

382386
treeGrid = fix.componentInstance.treeGrid;
383-
treeGrid.rowSelectable = true;
384-
treeGrid.primaryKey = 'ID';
385-
treeGrid.rowSelectable = false;
386387
fix.detectChanges();
387388
});
388389

@@ -490,19 +491,19 @@ describe('IgxTreeGrid - Selection', () => {
490491
const rows = TreeGridFunctions.getAllRows(fix);
491492
const treeGridCell = TreeGridFunctions.getTreeCell(rows[0]);
492493
treeGridCell.triggerEventHandler('focus', new Event('focus'));
493-
await wait();
494+
await wait(100);
494495
fix.detectChanges();
495496

496497
// scroll down 150 pixels
497498
treeGrid.verticalScrollContainer.getVerticalScroll().scrollTop = 150;
498499
treeGrid.parentVirtDir.getHorizontalScroll().dispatchEvent(new Event('scroll'));
499-
await wait();
500+
await wait(100);
500501
fix.detectChanges();
501502

502503
// then scroll back to top
503504
treeGrid.verticalScrollContainer.getVerticalScroll().scrollTop = 0;
504505
treeGrid.parentVirtDir.getHorizontalScroll().dispatchEvent(new Event('scroll'));
505-
await wait();
506+
await wait(100);
506507
fix.detectChanges();
507508

508509
expect(treeGrid.selectedCells.length).toBe(1);

0 commit comments

Comments
 (0)