@@ -3,7 +3,7 @@ import { async, TestBed, fakeAsync, tick } from '@angular/core/testing';
33import { NoopAnimationsModule } from '@angular/platform-browser/animations' ;
44import { IgxHierarchicalGridModule } from './public_api' ;
55import { IgxHierarchicalGridComponent } from './hierarchical-grid.component' ;
6- import { UIInteractions } from '../../test-utils/ui-interactions.spec' ;
6+ import { UIInteractions , wait } from '../../test-utils/ui-interactions.spec' ;
77import { IgxHierarchicalRowComponent } from './hierarchical-row.component' ;
88import { IgxStringFilteringOperand } from '../../data-operations/filtering-condition' ;
99import { 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