Merge pull request #16520 from IgniteUI/bpachilova/ariaHidden-header-groups-fix-16517

fix(grid): address null TypeError on focusing a grid with no data and column headers - master

Author: kacheshmarova

projects/igniteui-angular/grids/core/src/headers/grid-header-group.component.ts

@@ -151,7 +151,7 @@ export class IgxGridHeaderGroupComponent implements DoCheck {
      * @hidden
      */
     public get ariaHidden(): boolean {
-        return this.grid.hasColumnGroups && (this.column.hidden || this.grid.navigation.activeNode.row !== -1);
+        return this.grid.hasColumnGroups && (this.column.hidden || this.grid.navigation.activeNode?.row !== -1);
     }
 
     /**

projects/igniteui-angular/grids/core/src/headers/grid-header-row.component.ts

@@ -123,7 +123,7 @@ export class IgxGridHeaderRowComponent implements DoCheck {
     * @internal
     */
     public get isLeafHeaderAriaHidden(): boolean {
-        return this.grid.navigation.activeNode.row === -1;
+        return this.grid.navigation.activeNode?.row === -1;
     }
 
     /** The virtualized part of the header row containing the unpinned header groups. */

projects/igniteui-angular/grids/grid/src/column-group.spec.ts

@@ -203,6 +203,27 @@ describe('IgxGrid - multi-column headers #grid', () => {
             }
         }));
 
+        it('The ariaHidden getter should not throw when the grid has no active node (#16517)', fakeAsync(() => {
+            fixture = TestBed.createComponent(BlueWhaleGridComponent) as ComponentFixture<BlueWhaleGridComponent>;
+            tick();
+            fixture.detectChanges();
+
+            // The grid active node will be null if there is no data and the body is focused
+            grid = fixture.componentInstance.grid;
+            grid.data = [];
+
+            tick();
+            fixture.detectChanges();
+
+            const gridContent = GridFunctions.getGridContent(fixture);
+
+            expect(() => {
+                gridContent.triggerEventHandler('focus', null);
+                tick(400);
+                fixture.detectChanges();
+            }).not.toThrow();
+        }));
+
         it('Should render dynamic column group header correctly (#12165).', () => {
             fixture = TestBed.createComponent(BlueWhaleGridComponent) as ComponentFixture<BlueWhaleGridComponent>;
             (fixture as ComponentFixture<BlueWhaleGridComponent>).componentInstance.firstGroupRepeats = 1;