@@ -547,7 +547,7 @@ describe('IgxGrid Multi Row Layout - Keyboard navigation #grid', () => {
547547 expect ( cell . visibleColumnIndex ) . toBe ( 0 ) ;
548548 } ) ;
549549
550- it ( `should navigate to the first cell from the layout by pressing Ctrl + Arrow Left key
550+ it ( `should navigate to the first cell from the layout by pressing Ctrl + Arrow Left and Right key
551551 and then Arrow Up + Down to same cell` , ( ) => {
552552 fix . componentInstance . colGroups = [ {
553553 group : 'group1' ,
@@ -611,6 +611,70 @@ describe('IgxGrid Multi Row Layout - Keyboard navigation #grid', () => {
611611 expect ( fix . componentInstance . selectedCell . column . field ) . toMatch ( 'ContactTitle' ) ;
612612 } ) ;
613613
614+ it ( `should navigate to the first cell from the layout by pressing Ctrl + Arrow Right and Left key
615+ and then Arrow Up + Down to same cell` , ( ) => {
616+ fix . componentInstance . colGroups = [ {
617+ group : 'group1' ,
618+ hidden : true ,
619+ columns : [
620+ { field : 'ID' , rowStart : 1 , colStart : 1 , rowEnd : 3 }
621+ ]
622+ } , {
623+ group : 'group2' ,
624+ columns : [
625+ { field : 'Country' , rowStart : 1 , colStart : 1 } ,
626+ { field : 'Phone' , rowStart : 1 , colStart : 2 } ,
627+ { field : 'Fax' , rowStart : 2 , colStart : 1 , colEnd : 3 , rowEnd : 4 }
628+ ]
629+ } , {
630+ group : 'group3' ,
631+ columns : [
632+ { field : 'City' , rowStart : 1 , colStart : 1 , colEnd : 3 , rowEnd : 3 } ,
633+ { field : 'Region' , rowStart : 3 , colStart : 1 } ,
634+ { field : 'PostalCode' , rowStart : 3 , colStart : 2 }
635+ ]
636+ } , {
637+ group : 'group4' ,
638+ columns : [
639+ { field : 'CompanyName' , rowStart : 1 , colStart : 1 , colEnd : 3 } ,
640+ { field : 'ContactName' , rowStart : 2 , colStart : 1 } ,
641+ { field : 'ContactTitle' , rowStart : 2 , colStart : 2 } ,
642+ { field : 'Address' , rowStart : 3 , colStart : 1 , colEnd : 3 }
643+ ]
644+ } ] ;
645+ fix . detectChanges ( ) ;
646+ const rows = fix . debugElement . queryAll ( By . css ( ROW_CSS_CLASS ) ) ;
647+ const firstRowCell = rows [ 1 ] . queryAll ( By . css ( CELL_CSS_CLASS ) ) ;
648+ const firstCell = firstRowCell [ 2 ] ;
649+
650+ firstCell . triggerEventHandler ( 'focus' , null ) ;
651+ fix . detectChanges ( ) ;
652+
653+ GridFunctions . simulateCellKeydown ( firstCell . componentInstance , 'ArrowRight' , false , false , true ) ;
654+ fix . detectChanges ( ) ;
655+
656+ expect ( fix . componentInstance . selectedCell . value ) . toEqual ( fix . componentInstance . data [ 0 ] . ContactTitle ) ;
657+ expect ( fix . componentInstance . selectedCell . column . field ) . toMatch ( 'ContactTitle' ) ;
658+
659+ GridFunctions . simulateCellKeydown ( fix . componentInstance . selectedCell , 'ArrowLeft' ) ;
660+ fix . detectChanges ( ) ;
661+
662+ expect ( fix . componentInstance . selectedCell . value ) . toEqual ( fix . componentInstance . data [ 0 ] . ContactName ) ;
663+ expect ( fix . componentInstance . selectedCell . column . field ) . toMatch ( 'ContactName' ) ;
664+
665+ GridFunctions . simulateCellKeydown ( fix . componentInstance . selectedCell , 'ArrowUp' ) ;
666+ fix . detectChanges ( ) ;
667+
668+ expect ( fix . componentInstance . selectedCell . value ) . toEqual ( fix . componentInstance . data [ 0 ] . CompanyName ) ;
669+ expect ( fix . componentInstance . selectedCell . column . field ) . toMatch ( 'CompanyName' ) ;
670+
671+ GridFunctions . simulateCellKeydown ( fix . componentInstance . selectedCell , 'ArrowDown' ) ;
672+ fix . detectChanges ( ) ;
673+
674+ expect ( fix . componentInstance . selectedCell . value ) . toEqual ( fix . componentInstance . data [ 0 ] . ContactName ) ;
675+ expect ( fix . componentInstance . selectedCell . column . field ) . toMatch ( 'ContactName' ) ;
676+ } ) ;
677+
614678 it ( 'should navigate using Arrow Left through bigger cell with same rowStart but bigger row span' , ( ) => {
615679 fix . componentInstance . colGroups = [ {
616680 group : 'group1' ,
0 commit comments