Skip to content

Commit a1b34d8

Browse files
committed
test(HGrid): test cell selection in hierarchical grid #5714
1 parent b04b48d commit a1b34d8

File tree

1 file changed

+166
-38
lines changed

1 file changed

+166
-38
lines changed

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

Lines changed: 166 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -88,7 +88,7 @@ describe('IgxHierarchicalGrid selection #hGrid', () => {
8888
expect(fCell.selected).toBeTruthy();
8989
}));
9090

91-
it('should allow to select multiple cells in the same grid on mouse drag', fakeAsync(() => {
91+
it('should be able to set cellSelection mode per grid', fakeAsync(() => {
9292
hierarchicalGrid.displayDensity = 'compact';
9393
fix.detectChanges();
9494

@@ -98,6 +98,86 @@ describe('IgxHierarchicalGrid selection #hGrid', () => {
9898
tick(30);
9999
expect(row.expanded).toBeTruthy();
100100

101+
const childGridLevel1 = hierarchicalGrid.hgridAPI.getChildGrids(false)[0];
102+
childGridLevel1.cellSelection = GridSelectionMode.single;
103+
fix.detectChanges();
104+
const startCell = hierarchicalGrid.getCellByColumn(2, 'ID');
105+
106+
UIInteractions.simulatePointerOverElementEvent('pointerdown', startCell.nativeElement);
107+
fix.detectChanges();
108+
109+
let cell = hierarchicalGrid.getCellByColumn(2, 'ChildLevels');
110+
UIInteractions.simulatePointerOverElementEvent('pointerenter', cell.nativeElement);
111+
fix.detectChanges();
112+
113+
GridSelectionFunctions.verifyCellsRegionSelected(hierarchicalGrid, 2, 2, 0, 1);
114+
115+
cell = hierarchicalGrid.getCellByColumn(3, 'ChildLevels');
116+
UIInteractions.simulatePointerOverElementEvent('pointerenter', cell.nativeElement);
117+
fix.detectChanges();
118+
UIInteractions.simulatePointerOverElementEvent('pointerup', cell.nativeElement);
119+
fix.detectChanges();
120+
121+
GridSelectionFunctions.verifyCellsRegionSelected(hierarchicalGrid, 2, 3, 0, 1);
122+
GridSelectionFunctions.verifySelectedRange(hierarchicalGrid, 2, 3, 0, 1);
123+
expect(startCell.active).toBe(true);
124+
125+
cell = childGridLevel1.getCellByColumn(0, 'ChildLevels');
126+
UIInteractions.simulatePointerOverElementEvent('pointerdown', cell.nativeElement);
127+
fix.detectChanges();
128+
129+
cell = childGridLevel1.getCellByColumn(1, 'ChildLevels');
130+
UIInteractions.simulatePointerOverElementEvent('pointerenter', cell.nativeElement);
131+
fix.detectChanges();
132+
133+
cell = childGridLevel1.getCellByColumn(3, 'ProductName');
134+
UIInteractions.simulatePointerOverElementEvent('pointerenter', cell.nativeElement);
135+
fix.detectChanges();
136+
137+
UIInteractions.simulatePointerOverElementEvent('pointerup', cell.nativeElement);
138+
fix.detectChanges();
139+
140+
expect(hierarchicalGrid.getSelectedRanges().length).toBe(0);
141+
GridSelectionFunctions.verifyCellsRegionSelected(childGridLevel1, 0, 0, 1, 1);
142+
GridSelectionFunctions.verifySelectedRange(childGridLevel1, 0, 0, 1, 1);
143+
expect(startCell.active).toBe(false);
144+
145+
childGridLevel1.cellSelection = GridSelectionMode.none;
146+
fix.detectChanges();
147+
148+
cell = childGridLevel1.getCellByColumn(2, 'ID');
149+
UIInteractions.simulateClickAndSelectEvent(cell.nativeElement, true);
150+
fix.detectChanges();
151+
152+
expect(cell.active).toBeTrue();
153+
expect(cell.selected).toBeFalse();
154+
expect(childGridLevel1.getSelectedRanges().length).toBe(0);
155+
156+
cell = hierarchicalGrid.getCellByColumn(2, 'ID');
157+
158+
UIInteractions.simulatePointerOverElementEvent('pointerdown', cell.nativeElement);
159+
fix.detectChanges();
160+
161+
cell = hierarchicalGrid.getCellByColumn(2, 'ChildLevels');
162+
UIInteractions.simulatePointerOverElementEvent('pointerenter', cell.nativeElement);
163+
fix.detectChanges();
164+
UIInteractions.simulatePointerOverElementEvent('pointerup', cell.nativeElement);
165+
fix.detectChanges();
166+
167+
GridSelectionFunctions.verifyCellsRegionSelected(hierarchicalGrid, 2, 2, 0, 1);
168+
GridSelectionFunctions.verifySelectedRange(hierarchicalGrid, 2, 2, 0, 1);
169+
}));
170+
171+
it('should allow to select multiple cells in the same grid on mouse drag', (async() => {
172+
hierarchicalGrid.displayDensity = 'compact';
173+
fix.detectChanges();
174+
175+
const row = hierarchicalGrid.getRowByIndex(3) as IgxHierarchicalRowComponent;
176+
row.toggle();
177+
fix.detectChanges();
178+
await wait(30);
179+
expect(row.expanded).toBeTruthy();
180+
101181
const startCell = hierarchicalGrid.getCellByColumn(1, 'ID');
102182

103183
UIInteractions.simulatePointerOverElementEvent('pointerdown', startCell.nativeElement);
@@ -119,12 +199,22 @@ describe('IgxHierarchicalGrid selection #hGrid', () => {
119199
UIInteractions.simulatePointerOverElementEvent('pointerenter', cell.nativeElement);
120200
fix.detectChanges();
121201

202+
GridSelectionFunctions.verifyCellsRegionSelected(hierarchicalGrid, 1, 3, 0, 1);
203+
204+
hierarchicalGrid.navigateTo(5, -1);
205+
await wait(100);
206+
fix.detectChanges();
207+
208+
cell = hierarchicalGrid.getCellByColumn(5, 'ProductName');
209+
UIInteractions.simulatePointerOverElementEvent('pointerenter', cell.nativeElement);
210+
fix.detectChanges();
211+
122212
UIInteractions.simulatePointerOverElementEvent('pointerup', cell.nativeElement);
213+
await wait();
123214
fix.detectChanges();
124215

125-
GridSelectionFunctions.verifyCellsRegionSelected(hierarchicalGrid, 1, 3, 0, 1);
126-
GridSelectionFunctions.verifySelectedRange(hierarchicalGrid, 1, 3, 0, 1);
127-
expect(startCell.active).toBe(true);
216+
GridSelectionFunctions.verifyCellsRegionSelected(hierarchicalGrid, 1, 5, 0, 2);
217+
GridSelectionFunctions.verifySelectedRange(hierarchicalGrid, 1, 5, 0, 2);
128218
}));
129219

130220
it('should NOT allow to select multiple cells in multiple grids on mouse drag', fakeAsync(() => {
@@ -176,7 +266,7 @@ describe('IgxHierarchicalGrid selection #hGrid', () => {
176266
expect(startCell.active).toBe(true);
177267
}));
178268

179-
it('should be able to select range with shift + arrow keys', fakeAsync(() => {
269+
it('should be able to select range with shift + arrow keys in the parent grid', fakeAsync(() => {
180270
hierarchicalGrid.displayDensity = 'compact';
181271
fix.detectChanges();
182272

@@ -205,6 +295,43 @@ describe('IgxHierarchicalGrid selection #hGrid', () => {
205295
GridSelectionFunctions.verifySelectedRange(hierarchicalGrid, 1, 3, 1, 2);
206296
}));
207297

298+
it('should be able to select range with shift + arrow keys in the child grid', fakeAsync(() => {
299+
hierarchicalGrid.displayDensity = 'compact';
300+
fix.detectChanges();
301+
302+
const row = hierarchicalGrid.getRowByIndex(1) as IgxHierarchicalRowComponent;
303+
row.toggle();
304+
fix.detectChanges();
305+
tick(100);
306+
expect(row.expanded).toBeTruthy();
307+
308+
const childGridLevel1 = hierarchicalGrid.hgridAPI.getChildGrids(false)[0];
309+
310+
let cell = childGridLevel1.getCellByColumn(1, 'ChildLevels');
311+
312+
UIInteractions.simulateClickAndSelectEvent(cell);
313+
fix.detectChanges();
314+
315+
UIInteractions.triggerKeyDownEvtUponElem('arrowright', cell.nativeElement, true, false, true, false);
316+
tick(100);
317+
fix.detectChanges();
318+
319+
cell = childGridLevel1.getCellByColumn(1, 'ProductName');
320+
UIInteractions.triggerKeyDownEvtUponElem('arrowdown', cell.nativeElement, true, false, true, false);
321+
tick(100);
322+
fix.detectChanges();
323+
324+
cell = childGridLevel1.getCellByColumn(2, 'ProductName');
325+
UIInteractions.triggerKeyDownEvtUponElem('arrowdown', cell.nativeElement, true, false, true, false);
326+
tick(100);
327+
fix.detectChanges();
328+
329+
GridSelectionFunctions.verifyCellSelected(cell, true);
330+
expect(cell.active).toBeFalse();
331+
GridSelectionFunctions.verifyCellsRegionSelected(childGridLevel1, 1, 3, 1, 2);
332+
GridSelectionFunctions.verifySelectedRange(childGridLevel1, 1, 3, 1, 2);
333+
}));
334+
208335
it('should be able to select range with shift + mouse click and skip the child grid', (async() => {
209336
hierarchicalGrid.displayDensity = 'compact';
210337
fix.detectChanges();
@@ -276,6 +403,39 @@ describe('IgxHierarchicalGrid selection #hGrid', () => {
276403
GridSelectionFunctions.verifySelectedRange(hierarchicalGrid, 5, 5, 0, 0, 1, 2);
277404
}));
278405

406+
it('should NOT be able to create multiple ranges in multiple grids holding ctrl key', fakeAsync(() => {
407+
hierarchicalGrid.displayDensity = 'compact';
408+
fix.detectChanges();
409+
const row = hierarchicalGrid.getRowByIndex(2) as IgxHierarchicalRowComponent;
410+
411+
row.toggle();
412+
fix.detectChanges();
413+
tick(30);
414+
expect(row.expanded).toBeTruthy();
415+
const childGridLevel1 = hierarchicalGrid.hgridAPI.getChildGrids(false)[0];
416+
417+
let cell = hierarchicalGrid.getCellByColumn(2, 'ChildLevels');
418+
419+
UIInteractions.simulateClickAndSelectEvent(cell, false, true);
420+
fix.detectChanges();
421+
422+
cell = childGridLevel1.getCellByColumn(0, 'ProductName');
423+
UIInteractions.simulateClickAndSelectEvent(cell, false, true);
424+
fix.detectChanges();
425+
426+
expect(hierarchicalGrid.getSelectedRanges().length).toBe(0);
427+
expect(cell.selected).toBeTrue();
428+
GridSelectionFunctions.verifySelectedRange(childGridLevel1, 0, 0, 2, 2);
429+
430+
cell = hierarchicalGrid.getCellByColumn(0, 'ProductName');
431+
432+
UIInteractions.simulateClickAndSelectEvent(cell, false, true);
433+
fix.detectChanges();
434+
435+
expect(childGridLevel1.getSelectedRanges().length).toBe(0);
436+
GridSelectionFunctions.verifySelectedRange(hierarchicalGrid, 0, 0, 2, 2);
437+
}));
438+
279439
it('should clear the selection in parent grid when continue navigation in the child grid', fakeAsync(() => {
280440
hierarchicalGrid.displayDensity = 'compact';
281441
fix.detectChanges();
@@ -309,7 +469,7 @@ describe('IgxHierarchicalGrid selection #hGrid', () => {
309469
expect(hierarchicalGrid.getSelectedRanges().length).toBe(0);
310470
}));
311471

312-
it('should not be able to create range selection between parent and child grid on mouse click + shift key', fakeAsync(() => {
472+
it('should NOT be able to create range selection between parent and child grid on mouse click + shift key', fakeAsync(() => {
313473
hierarchicalGrid.displayDensity = 'compact';
314474
fix.detectChanges();
315475

@@ -340,38 +500,6 @@ describe('IgxHierarchicalGrid selection #hGrid', () => {
340500
GridSelectionFunctions.verifySelectedRange(hierarchicalGrid, 0, 0, 2, 2);
341501
}));
342502

343-
it('should not be able to create multiple ranges in multiple grids holding ctrl key', fakeAsync(() => {
344-
hierarchicalGrid.displayDensity = 'compact';
345-
fix.detectChanges();
346-
const row = hierarchicalGrid.getRowByIndex(2) as IgxHierarchicalRowComponent;
347-
348-
row.toggle();
349-
fix.detectChanges();
350-
tick(30);
351-
expect(row.expanded).toBeTruthy();
352-
const childGridLevel1 = hierarchicalGrid.hgridAPI.getChildGrids(false)[0];
353-
354-
let cell = hierarchicalGrid.getCellByColumn(2, 'ChildLevels');
355-
356-
UIInteractions.simulateClickAndSelectEvent(cell, false, true);
357-
fix.detectChanges();
358-
359-
cell = childGridLevel1.getCellByColumn(0, 'ProductName');
360-
UIInteractions.simulateClickAndSelectEvent(cell, false, true);
361-
fix.detectChanges();
362-
363-
expect(hierarchicalGrid.getSelectedRanges().length).toBe(0);
364-
expect(cell.selected).toBeTrue();
365-
GridSelectionFunctions.verifySelectedRange(childGridLevel1, 0, 0, 2, 2);
366-
367-
cell = hierarchicalGrid.getCellByColumn(0, 'ProductName');
368-
369-
UIInteractions.simulateClickAndSelectEvent(cell, false, true);
370-
fix.detectChanges();
371-
372-
expect(childGridLevel1.getSelectedRanges().length).toBe(0);
373-
GridSelectionFunctions.verifySelectedRange(hierarchicalGrid, 0, 0, 2, 2);
374-
}));
375503
});
376504

377505
describe('Row Selection', () => {

0 commit comments

Comments
 (0)