Skip to content

Commit b04b48d

Browse files
committed
test(IgxHierarchicalGrid): initial tests for multi cell selection #5714
1 parent 5c2d442 commit b04b48d

File tree

1 file changed

+285
-1
lines changed

1 file changed

+285
-1
lines changed

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

Lines changed: 285 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { async, TestBed, fakeAsync, tick } from '@angular/core/testing';
33
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
44
import { IgxHierarchicalGridModule } from './public_api';
55
import { IgxHierarchicalGridComponent } from './hierarchical-grid.component';
6-
import { UIInteractions } from '../../test-utils/ui-interactions.spec';
6+
import { UIInteractions, wait } from '../../test-utils/ui-interactions.spec';
77
import { IgxHierarchicalRowComponent } from './hierarchical-row.component';
88
import { IgxStringFilteringOperand } from '../../data-operations/filtering-condition';
99
import { IgxIconModule } from '../../icon/public_api';
@@ -88,6 +88,290 @@ 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(() => {
92+
hierarchicalGrid.displayDensity = 'compact';
93+
fix.detectChanges();
94+
95+
const row = hierarchicalGrid.getRowByIndex(3) as IgxHierarchicalRowComponent;
96+
row.toggle();
97+
fix.detectChanges();
98+
tick(30);
99+
expect(row.expanded).toBeTruthy();
100+
101+
const startCell = hierarchicalGrid.getCellByColumn(1, 'ID');
102+
103+
UIInteractions.simulatePointerOverElementEvent('pointerdown', startCell.nativeElement);
104+
fix.detectChanges();
105+
106+
let cell = hierarchicalGrid.getCellByColumn(1, 'ChildLevels');
107+
UIInteractions.simulatePointerOverElementEvent('pointerenter', cell.nativeElement);
108+
fix.detectChanges();
109+
110+
GridSelectionFunctions.verifyCellsRegionSelected(hierarchicalGrid, 1, 1, 0, 1);
111+
112+
cell = hierarchicalGrid.getCellByColumn(2, 'ChildLevels');
113+
UIInteractions.simulatePointerOverElementEvent('pointerenter', cell.nativeElement);
114+
fix.detectChanges();
115+
116+
GridSelectionFunctions.verifyCellsRegionSelected(hierarchicalGrid, 1, 2, 0, 1);
117+
118+
cell = hierarchicalGrid.getCellByColumn(3, 'ChildLevels');
119+
UIInteractions.simulatePointerOverElementEvent('pointerenter', cell.nativeElement);
120+
fix.detectChanges();
121+
122+
UIInteractions.simulatePointerOverElementEvent('pointerup', cell.nativeElement);
123+
fix.detectChanges();
124+
125+
GridSelectionFunctions.verifyCellsRegionSelected(hierarchicalGrid, 1, 3, 0, 1);
126+
GridSelectionFunctions.verifySelectedRange(hierarchicalGrid, 1, 3, 0, 1);
127+
expect(startCell.active).toBe(true);
128+
}));
129+
130+
it('should NOT allow to select multiple cells in multiple grids on mouse drag', fakeAsync(() => {
131+
hierarchicalGrid.displayDensity = 'compact';
132+
fix.detectChanges();
133+
134+
const row = hierarchicalGrid.getRowByIndex(3) as IgxHierarchicalRowComponent;
135+
row.toggle();
136+
fix.detectChanges();
137+
tick(30);
138+
expect(row.expanded).toBeTruthy();
139+
140+
const startCell = hierarchicalGrid.getCellByColumn(2, 'ID');
141+
142+
UIInteractions.simulatePointerOverElementEvent('pointerdown', startCell.nativeElement);
143+
fix.detectChanges();
144+
145+
let cell = hierarchicalGrid.getCellByColumn(2, 'ChildLevels');
146+
UIInteractions.simulatePointerOverElementEvent('pointerenter', cell.nativeElement);
147+
fix.detectChanges();
148+
149+
GridSelectionFunctions.verifyCellsRegionSelected(hierarchicalGrid, 2, 2, 0, 1);
150+
151+
cell = hierarchicalGrid.getCellByColumn(3, 'ChildLevels');
152+
UIInteractions.simulatePointerOverElementEvent('pointerenter', cell.nativeElement);
153+
fix.detectChanges();
154+
155+
GridSelectionFunctions.verifyCellsRegionSelected(hierarchicalGrid, 2, 3, 0, 1);
156+
157+
const childGridLevel1 = hierarchicalGrid.hgridAPI.getChildGrids(false)[0];
158+
cell = childGridLevel1.getCellByColumn(0, 'ChildLevels');
159+
UIInteractions.simulatePointerOverElementEvent('pointerenter', cell.nativeElement);
160+
fix.detectChanges();
161+
162+
cell = childGridLevel1.getCellByColumn(1, 'ChildLevels');
163+
UIInteractions.simulatePointerOverElementEvent('pointerenter', cell.nativeElement);
164+
fix.detectChanges();
165+
166+
cell = hierarchicalGrid.getCellByColumn(3, 'ProductName');
167+
UIInteractions.simulatePointerOverElementEvent('pointerenter', cell.nativeElement);
168+
fix.detectChanges();
169+
170+
UIInteractions.simulatePointerOverElementEvent('pointerup', cell.nativeElement);
171+
fix.detectChanges();
172+
173+
expect(childGridLevel1.getSelectedRanges().length).toBe(0);
174+
GridSelectionFunctions.verifyCellsRegionSelected(hierarchicalGrid, 2, 3, 0, 2);
175+
GridSelectionFunctions.verifySelectedRange(hierarchicalGrid, 2, 3, 0, 2);
176+
expect(startCell.active).toBe(true);
177+
}));
178+
179+
it('should be able to select range with shift + arrow keys', fakeAsync(() => {
180+
hierarchicalGrid.displayDensity = 'compact';
181+
fix.detectChanges();
182+
183+
let cell = hierarchicalGrid.getCellByColumn(1, 'ChildLevels');
184+
185+
UIInteractions.simulateClickAndSelectEvent(cell);
186+
fix.detectChanges();
187+
188+
UIInteractions.triggerKeyDownEvtUponElem('arrowright', cell.nativeElement, true, false, true, false);
189+
tick(100);
190+
fix.detectChanges();
191+
192+
cell = hierarchicalGrid.getCellByColumn(1, 'ProductName');
193+
UIInteractions.triggerKeyDownEvtUponElem('arrowdown', cell.nativeElement, true, false, true, false);
194+
tick(100);
195+
fix.detectChanges();
196+
197+
cell = hierarchicalGrid.getCellByColumn(2, 'ProductName');
198+
UIInteractions.triggerKeyDownEvtUponElem('arrowdown', cell.nativeElement, true, false, true, false);
199+
tick(100);
200+
fix.detectChanges();
201+
202+
GridSelectionFunctions.verifyCellSelected(cell, true);
203+
expect(cell.active).toBeFalse();
204+
GridSelectionFunctions.verifyCellsRegionSelected(hierarchicalGrid, 1, 3, 1, 2);
205+
GridSelectionFunctions.verifySelectedRange(hierarchicalGrid, 1, 3, 1, 2);
206+
}));
207+
208+
it('should be able to select range with shift + mouse click and skip the child grid', (async() => {
209+
hierarchicalGrid.displayDensity = 'compact';
210+
fix.detectChanges();
211+
212+
const forthRow = hierarchicalGrid.getRowByIndex(2) as IgxHierarchicalRowComponent;
213+
forthRow.toggle();
214+
fix.detectChanges();
215+
await wait(30);
216+
expect(forthRow.expanded).toBeTruthy();
217+
218+
let cell = hierarchicalGrid.getCellByColumn(1, 'ChildLevels');
219+
220+
UIInteractions.simulateClickAndSelectEvent(cell);
221+
fix.detectChanges();
222+
223+
expect(cell.selected).toBeTrue();
224+
expect(cell.active).toBeTrue();
225+
226+
hierarchicalGrid.navigateTo(5, -1);
227+
await wait(100);
228+
fix.detectChanges();
229+
230+
cell = hierarchicalGrid.getCellByColumn(5, 'ProductName');
231+
UIInteractions.simulateClickAndSelectEvent(cell, true);
232+
fix.detectChanges();
233+
234+
GridSelectionFunctions.verifyCellSelected(cell, true);
235+
expect(cell.active).toBeTrue();
236+
GridSelectionFunctions.verifyCellsRegionSelected(hierarchicalGrid, 1, 5, 1, 2);
237+
GridSelectionFunctions.verifySelectedRange(hierarchicalGrid, 1, 5, 1, 2);
238+
}));
239+
240+
it('should be able to select multiple ranges holding ctrl key', (async() => {
241+
hierarchicalGrid.displayDensity = 'compact';
242+
fix.detectChanges();
243+
244+
const forthRow = hierarchicalGrid.getRowByIndex(2) as IgxHierarchicalRowComponent;
245+
forthRow.toggle();
246+
fix.detectChanges();
247+
await wait(30);
248+
expect(forthRow.expanded).toBeTruthy();
249+
250+
let cell = hierarchicalGrid.getCellByColumn(1, 'ChildLevels');
251+
252+
UIInteractions.simulateClickAndSelectEvent(cell);
253+
fix.detectChanges();
254+
255+
expect(cell.selected).toBeTrue();
256+
expect(cell.active).toBeTrue();
257+
258+
hierarchicalGrid.navigateTo(5, -1);
259+
await wait(100);
260+
fix.detectChanges();
261+
262+
cell = hierarchicalGrid.getCellByColumn(5, 'ProductName');
263+
UIInteractions.simulateClickAndSelectEvent(cell, true);
264+
fix.detectChanges();
265+
266+
GridSelectionFunctions.verifyCellSelected(cell, true);
267+
expect(cell.active).toBeTrue();
268+
GridSelectionFunctions.verifyCellsRegionSelected(hierarchicalGrid, 1, 5, 1, 2);
269+
GridSelectionFunctions.verifySelectedRange(hierarchicalGrid, 1, 5, 1, 2);
270+
271+
cell = hierarchicalGrid.getCellByColumn(5, 'ID');
272+
UIInteractions.simulateClickAndSelectEvent(cell, false, true);
273+
fix.detectChanges();
274+
275+
GridSelectionFunctions.verifySelectedRange(hierarchicalGrid, 1, 5, 1, 2, 0, 2);
276+
GridSelectionFunctions.verifySelectedRange(hierarchicalGrid, 5, 5, 0, 0, 1, 2);
277+
}));
278+
279+
it('should clear the selection in parent grid when continue navigation in the child grid', fakeAsync(() => {
280+
hierarchicalGrid.displayDensity = 'compact';
281+
fix.detectChanges();
282+
283+
const row = hierarchicalGrid.getRowByIndex(4) as IgxHierarchicalRowComponent;
284+
row.toggle();
285+
fix.detectChanges();
286+
tick(30);
287+
expect(row.expanded).toBeTruthy();
288+
289+
let cell = hierarchicalGrid.getCellByColumn(1, 'ChildLevels');
290+
291+
UIInteractions.simulateClickAndSelectEvent(cell);
292+
fix.detectChanges();
293+
294+
expect(cell.selected).toBeTrue();
295+
expect(cell.active).toBeTrue();
296+
297+
cell = hierarchicalGrid.getCellByColumn(4, 'ChildLevels');
298+
299+
UIInteractions.simulateClickAndSelectEvent(cell, true);
300+
fix.detectChanges();
301+
302+
GridSelectionFunctions.verifyCellsRegionSelected(hierarchicalGrid, 1, 4, 1, 1);
303+
GridSelectionFunctions.verifySelectedRange(hierarchicalGrid, 1, 4, 1, 1);
304+
305+
UIInteractions.triggerKeyDownEvtUponElem('arrowdown', cell.nativeElement, true, false, true, false);
306+
tick(30);
307+
fix.detectChanges();
308+
309+
expect(hierarchicalGrid.getSelectedRanges().length).toBe(0);
310+
}));
311+
312+
it('should not be able to create range selection between parent and child grid on mouse click + shift key', fakeAsync(() => {
313+
hierarchicalGrid.displayDensity = 'compact';
314+
fix.detectChanges();
315+
316+
const row = hierarchicalGrid.getRowByIndex(2) as IgxHierarchicalRowComponent;
317+
row.toggle();
318+
fix.detectChanges();
319+
tick(30);
320+
expect(row.expanded).toBeTruthy();
321+
322+
let cell = hierarchicalGrid.getCellByColumn(2, 'ChildLevels');
323+
324+
UIInteractions.simulateClickAndSelectEvent(cell);
325+
fix.detectChanges();
326+
327+
GridSelectionFunctions.verifySelectedRange(hierarchicalGrid, 2, 2, 1, 1);
328+
329+
UIInteractions.triggerKeyDownEvtUponElem('arrowdown', cell.nativeElement, true, false, true, false);
330+
tick(30);
331+
fix.detectChanges();
332+
333+
expect(hierarchicalGrid.getSelectedRanges().length).toBe(0);
334+
335+
cell = hierarchicalGrid.getCellByColumn(0, 'ProductName');
336+
337+
UIInteractions.simulateClickAndSelectEvent(cell, true);
338+
fix.detectChanges();
339+
340+
GridSelectionFunctions.verifySelectedRange(hierarchicalGrid, 0, 0, 2, 2);
341+
}));
342+
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+
}));
91375
});
92376

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

0 commit comments

Comments
 (0)