Merge pull request #14365 from IgniteUI/mkirova/hgrid-colInit

fix(igxHierarchicalGrid): Make sure columnInit is called on column's …
IgniteUI · Jun 14, 2024 · af84248 · af84248
2 parents 88d3b3d + d118038
commit af84248
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 3 deletions.
diff --git a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component.ts b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component.ts
@@ -1138,7 +1138,7 @@ export class IgxHierarchicalGridComponent extends IgxHierarchicalGridBaseDirecti
         const colLength = this.columns.length;
         const topCols = this.columnList.filter((item) => colsArray.indexOf(item) === -1);
         if (topCols.length > 0) {
-            this.updateColumns(topCols);
+            this.initColumns(topCols, (col: IgxColumnComponent) => this.columnInit.emit(col));
             if (recalcColSizes && this.columns.length !== colLength) {
                 this.calculateGridSizes(false);
             }

diff --git a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.spec.ts b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.spec.ts
@@ -628,6 +628,16 @@ describe('Basic IgxHierarchicalGrid #hGrid', () => {
             expect(hierarchicalGrid.tbody.nativeElement.attributes['aria-activedescendant'].value).toEqual(hierarchicalGrid.id);
             expect(childGrid.tbody.nativeElement.attributes['aria-activedescendant'].value).toEqual(`${childGrid.id}_0_1`);
         });
+
+        it('should emit columnInit when a column is added runtime.', async() => {
+            spyOn(hierarchicalGrid.columnInit, 'emit').and.callThrough();
+            fixture.detectChanges();
+            fixture.componentInstance.showAnotherCol = true;
+            fixture.detectChanges();
+            await wait(30);
+            fixture.detectChanges();
+            expect(hierarchicalGrid.columnInit.emit).toHaveBeenCalled();
+        });
     });
 
     describe('IgxHierarchicalGrid Row Islands #hGrid', () => {
@@ -1827,6 +1837,7 @@ describe('Basic IgxHierarchicalGrid #hGrid', () => {
     <igx-hierarchical-grid #grid1 [data]="data"
      [autoGenerate]="false" [height]="'400px'" [width]="width" #hierarchicalGrid>
      <igx-column field="ID"></igx-column>
+     <igx-column field="AnotherColumn" *ngIf="showAnotherCol"></igx-column>
      <igx-column field="ProductName"></igx-column>
         <igx-row-island [key]="'childData'" [autoGenerate]="false" #rowIsland>
             <igx-column field="ID"></igx-column>
@@ -1839,15 +1850,15 @@ describe('Basic IgxHierarchicalGrid #hGrid', () => {
         </igx-row-island>
     </igx-hierarchical-grid>`,
     standalone: true,
-    imports: [IgxHierarchicalGridComponent, IgxColumnComponent, IgxRowIslandComponent]
+    imports: [IgxHierarchicalGridComponent, IgxColumnComponent, IgxRowIslandComponent, NgIf]
 })
 export class IgxHierarchicalGridTestBaseComponent {
     @ViewChild('hierarchicalGrid', { read: IgxHierarchicalGridComponent, static: true }) public hgrid: IgxHierarchicalGridComponent;
     @ViewChild('rowIsland', { read: IgxRowIslandComponent, static: true }) public rowIsland: IgxRowIslandComponent;
     @ViewChild('rowIsland2', { read: IgxRowIslandComponent, static: true }) public rowIsland2: IgxRowIslandComponent;
     public data;
     public width = '500px';
-
+    public showAnotherCol = false;
     constructor() {
         // 3 level hierarchy
         this.data = this.generateDataUneven(20, 3);