Merge branch '9.0.x' into nrobakova/refactor-treeGrid-KyeboardNav-tests-90

Author: nrobakova

projects/igniteui-angular/src/lib/grids/grid-base.directive.ts

@@ -2799,14 +2799,15 @@ export class IgxGridBaseDirective extends DisplayDensityBase implements
         const extractForOfs = pipe(map((collection: any[]) => collection.filter(elementFilter).map(item => item.virtDirRow)));
         const rowListObserver = extractForOfs(this._dataRowList.changes);
         const summaryRowObserver = extractForOfs(this._summaryRowList.changes);
-
-        combineLatest([rowListObserver, summaryRowObserver]).pipe(takeUntil(this.destroy$))
-            .subscribe(([row, summary]) => this._horizontalForOfs = [...row, ...summary]);
-
-        this._horizontalForOfs = [
-            ...this._dataRowList.filter(elementFilter).map(item => item.virtDirRow),
-            ...this._summaryRowList.filter(elementFilter).map(item => item.virtDirRow)
-        ];
+        const resetHorizontalForOfs = () => {
+            this._horizontalForOfs = [
+                ...this._dataRowList.filter(elementFilter).map(item => item.virtDirRow),
+                ...this._summaryRowList.filter(elementFilter).map(item => item.virtDirRow)
+            ];
+        };
+        rowListObserver.pipe(takeUntil(this.destroy$)).subscribe(resetHorizontalForOfs);
+        summaryRowObserver.pipe(takeUntil(this.destroy$)).subscribe(resetHorizontalForOfs);
+        resetHorizontalForOfs();
     }
 
     /**
@@ -5293,10 +5294,10 @@ export class IgxGridBaseDirective extends DisplayDensityBase implements
 
     private isValidPosition(rowIndex, colIndex): boolean {
         const rows = this.summariesRowList.filter(s => s.index !== 0).concat(this.rowList.toArray()).length;
-        const cols = this.columnList.filter(col => !col.columnGroup && col.visibleIndex >= 0).length;
+        const cols = this.columnList.filter(col => !col.columnGroup && col.visibleIndex >= 0 && !col.hidden).length;
         if (rows < 1 || cols < 1) { return false; }
         if (rowIndex > -1 && rowIndex < this.dataView.length &&
-            colIndex > - 1 && colIndex <= this.unpinnedColumns[this.unpinnedColumns.length - 1].visibleIndex) {
+            colIndex > - 1 && colIndex < cols) {
             return true;
         }
         return false;

projects/igniteui-angular/src/lib/grids/grid/grid.multi-row-layout.spec.ts

@@ -11,6 +11,7 @@ import { wait } from '../../test-utils/ui-interactions.spec';
 import { DefaultSortingStrategy } from '../../data-operations/sorting-strategy';
 import { configureTestSuite } from '../../test-utils/configure-suite';
 import { verifyLayoutHeadersAreAligned, verifyDOMMatchesLayoutSettings } from '../../test-utils/helper-utils.spec';
+import { ICellPosition } from '../common/events';
 
 
 const GRID_COL_THEAD_TITLE_CLASS = 'igx-grid__th-title';
@@ -1174,6 +1175,33 @@ describe('IgxGrid - multi-row-layout #grid', () => {
         expect(col.hidden).toBe(false);
         expect(col.parent.hidden).toBe(false);
     });
+
+    it('should get the correct next and previous cell when in MRL scenario', () => {
+        const fixture = TestBed.createComponent(ColumnLayoutTestComponent);
+        fixture.componentInstance.colGroups = [{
+            group: 'group1',
+            columns: [
+                { field: 'CompanyName', rowStart: 1, rowEnd: 2, colStart: 3, colEnd: 4, dataType: 'number', editable: true },
+                { field: 'ID', rowStart: 1, rowEnd: 2, colStart: 1, colEnd: 2, dataType: 'number', editable: false },
+                { field: 'ContactName', rowStart: 1, rowEnd: 2, colStart: 2, colEnd: 3, dataType: 'string', editable: false },
+            ]
+        }];
+        const grid = fixture.componentInstance.grid;
+        fixture.detectChanges();
+        let pos: ICellPosition;
+        pos = grid.getNextCell(0, 1, col => col.editable === true);
+        expect(pos.rowIndex).toEqual(0);
+        expect(pos.visibleColumnIndex).toEqual(2);
+        pos = grid.getNextCell(0, 2, col => col.editable === true);
+        expect(pos.rowIndex).toEqual(1);
+        expect(pos.visibleColumnIndex).toEqual(2);
+        pos = grid.getPreviousCell(1, 2);
+        expect(pos.rowIndex).toEqual(1);
+        expect(pos.visibleColumnIndex).toEqual(1);
+        pos = grid.getPreviousCell(1, 2, col => col.editable === true);
+        expect(pos.rowIndex).toEqual(0);
+        expect(pos.visibleColumnIndex).toEqual(2);
+    });
 });
 
 @Component({
@@ -1182,7 +1210,7 @@ describe('IgxGrid - multi-row-layout #grid', () => {
         <igx-column-layout *ngFor='let group of colGroups'>
             <igx-column *ngFor='let col of group.columns'
             [rowStart]="col.rowStart" [colStart]="col.colStart" [width]='col.width'
-            [colEnd]="col.colEnd" [rowEnd]="col.rowEnd" [field]='col.field'></igx-column>
+            [colEnd]="col.colEnd" [rowEnd]="col.rowEnd" [field]='col.field' [editable]='col.editable'></igx-column>
         </igx-column-layout>
     </igx-grid>
     `

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

@@ -211,7 +211,6 @@ describe('IgxHierarchicalGrid Basic Navigation #hGrid', () => {
     }));
 
     it('should include summary rows in tab sequence.', (async () => {
-        pending('Related to the issue #6701');
         const childGrid = hierarchicalGrid.hgridAPI.getChildGrids(false)[0];
         childGrid.getColumnByName('ID').hasSummary = true;
         fixture.detectChanges();

src/app/hierarchical-grid/hierarchical-grid.sample.html

@@ -70,6 +70,7 @@ <h4 class="sample-title">Sample One</h4>
 
     <h4 class="sample-title">Sample two</h4>
     <div class="sample-actions">
+        <button igxButton="raised" (click)="enableSummary()">Enable Summaries</button>
         <button igxButton="raised" (click)='setterBindingChange()'>Set rowSelectable via binding</button>
         <button igxButton="raised" (click)='setterChange()'>Set rowSelectable via setter on 1st layout</button>
         <button igxButton="raised" (click)='testApis()'>Test APis</button>

src/app/hierarchical-grid/hierarchical-grid.sample.ts

@@ -33,6 +33,9 @@ export class HierarchicalGridSampleComponent {
     @ViewChild('hGrid', { static: true })
     hGrid: IgxHierarchicalGridComponent;
 
+    @ViewChild('hGrid2', { static: true })
+    hGrid2: IgxHierarchicalGridComponent;
+
     constructor(private cdr: ChangeDetectorRef) {
         // this.localData.push({ ID: -1, Name: ''});
         // for (let i = 0; i < 10000; i++) {
@@ -60,6 +63,14 @@ export class HierarchicalGridSampleComponent {
         this.localData[2].childData[1].hasChild = false;
     }
 
+    public enableSummary() {
+        const childGrid = this.hGrid2.hgridAPI.getChildGrids(false)[0];
+        this.hGrid2.getColumnByName('ID').hasSummary = true;
+        if (childGrid) {
+            childGrid.getColumnByName('ID').hasSummary = true;
+        }
+    }
+
     ngAfterViewInit() {
         this.cdr.detectChanges();
     }