Skip to content

Commit 640907c

Browse files
ChronosSFChronosSF
authored
Merge pull request #7281 from IgniteUI/mkirova/fix-7257-9.0.x
fix(igxHierarchicalGrid): Moving column change logic in separate dete
2 parents fe4445d + 1504f28 commit 640907c

File tree

6 files changed

+54
-25
lines changed

6 files changed

+54
-25
lines changed

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

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2734,7 +2734,9 @@ export class IgxGridBaseDirective extends DisplayDensityBase implements
27342734

27352735
this.columnList.changes
27362736
.pipe(takeUntil(this.destroy$))
2737-
.subscribe((change: QueryList<IgxColumnComponent>) => { this.onColumnsChanged(change); });
2737+
.subscribe((change: QueryList<IgxColumnComponent>) => {
2738+
this.onColumnsChanged(change);
2739+
});
27382740
}
27392741

27402742
/**

‎projects/igniteui-angular/src/lib/grids/hierarchical-grid/child-grid-row.component.ts‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -161,9 +161,6 @@ private resolver;
161161
*/
162162
ngAfterViewInit() {
163163
this.hGrid.childLayoutList = this.layout.children;
164-
if (this.layout.childColumns.length > 0 && !this.hGrid.autoGenerate) {
165-
this.hGrid.createColumnsList(this.layout.childColumns.toArray());
166-
}
167164
const layouts = this.hGrid.childLayoutList.toArray();
168165
layouts.forEach((l) => this.hGrid.hgridAPI.registerChildRowIsland(l));
169166
this.parentGrid.hgridAPI.registerChildGrid(this.rowData.rowID, this.layout.key, this.hGrid);

‎projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component.ts‎

Lines changed: 16 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -414,13 +414,23 @@ export class IgxHierarchicalGridComponent extends IgxHierarchicalGridBaseDirecti
414414
}
415415
}
416416

417-
protected onColumnsChanged(change: QueryList<IgxColumnComponent>) {
418-
this.updateColumnList();
419-
const cols = change.filter(c => c.gridAPI.grid === this);
420-
if (cols.length > 0 || this.autoGenerate) {
421-
this.columnList.reset(cols);
422-
super.onColumnsChanged(this.columnList);
417+
418+
protected setupColumns() {
419+
if (this.parentIsland && this.parentIsland.childColumns.length > 0 && !this.autoGenerate) {
420+
this.createColumnsList(this.parentIsland.childColumns.toArray());
423421
}
422+
super.setupColumns();
423+
}
424+
425+
protected onColumnsChanged(change: QueryList<IgxColumnComponent>) {
426+
Promise.resolve().then(() => {
427+
this.updateColumnList();
428+
const cols = change.filter(c => c.gridAPI.grid === this);
429+
if (cols.length > 0 || this.autoGenerate) {
430+
this.columnList.reset(cols);
431+
super.onColumnsChanged(this.columnList);
432+
}
433+
});
424434
}
425435

426436
private updateColumnList(recalcColSizes = true) {

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

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -560,14 +560,15 @@ describe('IgxHierarchicalGrid selection #hGrid', () => {
560560
GridSelectionFunctions.verifyRowsArraySelected(childGrid.dataRowList.toArray());
561561
});
562562

563-
it('should not be able to select deleted row', fakeAsync(() => {
563+
it('should not be able to select deleted row', (async() => {
564564
// Expand first row
565565
const firstRow = hierarchicalGrid.getRowByIndex(0) as IgxHierarchicalRowComponent;
566566
firstRow.toggle();
567+
await wait(30);
567568
fix.detectChanges();
568569

569570
firstRow.onClick(UIInteractions.getMouseEvent('click'));
570-
tick();
571+
await wait();
571572
fix.detectChanges();
572573

573574
GridSelectionFunctions.verifyRowSelected(firstRow);
@@ -583,7 +584,7 @@ describe('IgxHierarchicalGrid selection #hGrid', () => {
583584

584585
// Click on deleted row
585586
firstRow.onClick(UIInteractions.getMouseEvent('click'));
586-
tick();
587+
await wait();
587588
fix.detectChanges();
588589

589590
GridSelectionFunctions.verifyRowSelected(firstRow, false);
@@ -612,7 +613,7 @@ describe('IgxHierarchicalGrid selection #hGrid', () => {
612613

613614
const childGridFirstRow = childGrid.getRowByIndex(0);
614615
childGridFirstRow.onClick(UIInteractions.getMouseEvent('click', false, false, true));
615-
tick();
616+
await wait();
616617
fix.detectChanges();
617618

618619
GridSelectionFunctions.verifyRowSelected(firstRow, false);

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

Lines changed: 25 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -988,7 +988,7 @@ describe('IgxHierarchicalGrid Template Changing Scenarios #hGrid', () => {
988988
expect(child2Headers[2].nativeElement.innerText).toEqual('Col1');
989989
});
990990

991-
it('should render correct columns when setting columns for parent and child post init using ngFor', () => {
991+
it('should render correct columns when setting columns for parent and child post init using ngFor', fakeAsync(() => {
992992
const row = hierarchicalGrid.getRowByIndex(0) as IgxHierarchicalRowComponent;
993993
UIInteractions.simulateClickAndSelectEvent(row.expander);
994994
fixture.detectChanges();
@@ -999,6 +999,8 @@ describe('IgxHierarchicalGrid Template Changing Scenarios #hGrid', () => {
999999
fixture.componentInstance.parentCols = ['Col1', 'Col2'];
10001000
fixture.componentInstance.islandCols1 = ['ID', 'ProductName', 'Col1'];
10011001
fixture.detectChanges();
1002+
tick();
1003+
fixture.detectChanges();
10021004
// check parent cols
10031005
expect(hierarchicalGrid.columns.length).toBe(4);
10041006
expect(hierarchicalGrid.columns[0].field).toBe('ID');
@@ -1010,9 +1012,9 @@ describe('IgxHierarchicalGrid Template Changing Scenarios #hGrid', () => {
10101012
expect(hierarchicalGrid.columns[0].field).toBe('ID');
10111013
expect(hierarchicalGrid.columns[1].field).toBe('ProductName');
10121014
expect(hierarchicalGrid.columns[2].field).toBe('Col1');
1013-
});
1015+
}));
10141016

1015-
it('should update columns for expanded child when adding column to row island', () => {
1017+
it('should update columns for expanded child when adding column to row island', fakeAsync(() => {
10161018
const row = hierarchicalGrid.getRowByIndex(0) as IgxHierarchicalRowComponent;
10171019
UIInteractions.simulateClickAndSelectEvent(row.expander);
10181020
fixture.detectChanges();
@@ -1035,6 +1037,8 @@ describe('IgxHierarchicalGrid Template Changing Scenarios #hGrid', () => {
10351037

10361038
fixture.componentInstance.islandCols2.push('Col2');
10371039
fixture.detectChanges();
1040+
tick();
1041+
fixture.detectChanges();
10381042

10391043
child2Headers = child2Grid.queryAll(By.css('igx-grid-header'));
10401044
expect(child2Headers.length).toEqual(4);
@@ -1056,9 +1060,9 @@ describe('IgxHierarchicalGrid Template Changing Scenarios #hGrid', () => {
10561060
expect(colHeaders.length).toEqual(2);
10571061
expect(colHeaders[0].nativeElement.innerText).toEqual('ID');
10581062
expect(colHeaders[1].nativeElement.innerText).toEqual('ProductName');
1059-
});
1063+
}));
10601064

1061-
it('should update columns for rendered child that is collapsed when adding column to row island', () => {
1065+
it('should update columns for rendered child that is collapsed when adding column to row island', fakeAsync(() => {
10621066
const row = hierarchicalGrid.getRowByIndex(0) as IgxHierarchicalRowComponent;
10631067
UIInteractions.simulateClickAndSelectEvent(row.expander);
10641068
fixture.detectChanges();
@@ -1084,6 +1088,8 @@ describe('IgxHierarchicalGrid Template Changing Scenarios #hGrid', () => {
10841088

10851089
fixture.componentInstance.islandCols2.push('Col2');
10861090
fixture.detectChanges();
1091+
tick();
1092+
fixture.detectChanges();
10871093

10881094
UIInteractions.simulateClickAndSelectEvent(row1.expander);
10891095
fixture.detectChanges();
@@ -1094,7 +1100,7 @@ describe('IgxHierarchicalGrid Template Changing Scenarios #hGrid', () => {
10941100
expect(child2Headers[1].nativeElement.innerText).toEqual('ProductName');
10951101
expect(child2Headers[2].nativeElement.innerText).toEqual('Col1');
10961102
expect(child2Headers[3].nativeElement.innerText).toEqual('Col2');
1097-
});
1103+
}));
10981104
});
10991105

11001106
describe('IgxHierarchicalGrid Runtime Row Island change Scenarios #hGrid', () => {
@@ -1117,8 +1123,8 @@ describe('IgxHierarchicalGrid Runtime Row Island change Scenarios #hGrid', () =>
11171123
hierarchicalGrid = fixture.componentInstance.hgrid;
11181124
}));
11191125

1120-
it('should allow changing row islands runtime in root grid.', () => {
1121-
const row = hierarchicalGrid.getRowByIndex(0) as IgxHierarchicalRowComponent;
1126+
it('should allow changing row islands runtime in root grid.', fakeAsync(() => {
1127+
let row = hierarchicalGrid.getRowByIndex(0) as IgxHierarchicalRowComponent;
11221128
UIInteractions.simulateClickAndSelectEvent(row.expander);
11231129
fixture.detectChanges();
11241130

@@ -1130,6 +1136,8 @@ describe('IgxHierarchicalGrid Runtime Row Island change Scenarios #hGrid', () =>
11301136

11311137
fixture.componentInstance.toggleRI = false;
11321138
fixture.detectChanges();
1139+
tick();
1140+
fixture.detectChanges();
11331141

11341142
hGrids = fixture.debugElement.queryAll(By.css('igx-hierarchical-grid'));
11351143
childGrids = hierarchicalGrid.hgridAPI.getChildGrids();
@@ -1139,15 +1147,18 @@ describe('IgxHierarchicalGrid Runtime Row Island change Scenarios #hGrid', () =>
11391147

11401148
fixture.componentInstance.toggleRI = true;
11411149
fixture.detectChanges();
1150+
tick();
1151+
fixture.detectChanges();
11421152

11431153
hGrids = fixture.debugElement.queryAll(By.css('igx-hierarchical-grid'));
11441154
childGrids = hierarchicalGrid.hgridAPI.getChildGrids();
1155+
row = hierarchicalGrid.getRowByIndex(0) as IgxHierarchicalRowComponent;
11451156
expect(childGrids.length).toBe(1);
11461157
expect(hGrids.length).toBe(2);
11471158
expect(row.expander).not.toBe(undefined);
1148-
});
1159+
}));
11491160

1150-
it('should allow changing row islands runtime in child grid.', () => {
1161+
it('should allow changing row islands runtime in child grid.', async() => {
11511162
const row = hierarchicalGrid.getRowByIndex(0) as IgxHierarchicalRowComponent;
11521163
UIInteractions.simulateClickAndSelectEvent(row.expander);
11531164
fixture.detectChanges();
@@ -1163,6 +1174,8 @@ describe('IgxHierarchicalGrid Runtime Row Island change Scenarios #hGrid', () =>
11631174

11641175
fixture.componentInstance.toggleChildRI = false;
11651176
fixture.detectChanges();
1177+
await wait(30);
1178+
fixture.detectChanges();
11661179

11671180
hGrids = fixture.debugElement.queryAll(By.css('igx-hierarchical-grid'));
11681181
childGrid = hierarchicalGrid.hgridAPI.getChildGrids()[0];
@@ -1171,6 +1184,8 @@ describe('IgxHierarchicalGrid Runtime Row Island change Scenarios #hGrid', () =>
11711184

11721185
fixture.componentInstance.toggleChildRI = true;
11731186
fixture.detectChanges();
1187+
await wait(30);
1188+
fixture.detectChanges();
11741189

11751190
hGrids = fixture.debugElement.queryAll(By.css('igx-hierarchical-grid'));
11761191
childGrid = hierarchicalGrid.hgridAPI.getChildGrids()[0];

‎projects/igniteui-angular/src/lib/grids/hierarchical-grid/row-island.component.ts‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -255,7 +255,11 @@ export class IgxRowIslandComponent extends IgxHierarchicalGridBaseDirective
255255
return colsArray.indexOf(item) === -1;
256256
});
257257
this.childColumns.reset(topCols);
258-
this.columnList.changes.pipe(takeUntil(this.destroy$)).subscribe(() => { this.updateColumnList(); });
258+
this.columnList.changes.pipe(takeUntil(this.destroy$)).subscribe(() => {
259+
Promise.resolve().then(() => {
260+
this.updateColumnList();
261+
});
262+
});
259263
}
260264

261265
protected updateChildren() {

0 commit comments

Comments
 (0)