Merge pull request #6161 from IgniteUI/nrobakova/fix-issue-6134-81

Fix error when delete child column from a column group

Author: rkaraivanov

projects/igniteui-angular/src/lib/grids/column.component.ts

@@ -1852,7 +1852,7 @@ export class IgxColumnGroupComponent extends IgxColumnComponent implements After
         */
         this.children.changes.pipe(takeUntil(this.destroy$))
             .subscribe((change) => {
-                if (change.length > 1 && change.first === this) {
+                if (change.first === this) {
                     this.children.reset(this.children.toArray().slice(1));
                     this.children.forEach(child => {
                         child.parent = this;

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

@@ -1469,21 +1469,29 @@ describe('IgxGrid - multi-column headers', () => {
 
         expect(grid.columnList.length).toEqual(9);
 
+        expect(() => {
+            // Delete all column
+            fixture.componentInstance.columnGroups[0].columns.splice(0, 2);
+            fixture.detectChanges();
+        }).not.toThrow();
+
+        expect(grid.columnList.length).toEqual(7);
+
         expect(() => {
             // Add column
             fixture.componentInstance.columnGroups[0].columns.push({ field: 'Fax', type: 'string' });
             fixture.detectChanges();
         }).not.toThrow();
 
-        expect(grid.columnList.length).toEqual(10);
+        expect(grid.columnList.length).toEqual(8);
 
         expect(() => {
             // Update column
-            fixture.componentInstance.columnGroups[0].columns[1] = { field: 'City', type: 'string' };
+            fixture.componentInstance.columnGroups[0].columns[0] = { field: 'City', type: 'string' };
             fixture.detectChanges();
         }).not.toThrow();
 
-        expect(grid.columnList.length).toEqual(10);
+        expect(grid.columnList.length).toEqual(8);
     });
 });
 
@@ -1864,15 +1872,15 @@ export class DynamicColGroupsGridComponent {
             { columnHeader: 'First', columns: [
                 { field: 'ID', type: 'string' },
                 { field: 'CompanyName', type: 'string' },
-                { field: 'ContactName', type: 'string' },
+                { field: 'ContactName', type: 'string' }
             ]},
             { columnHeader: 'Second', columns: [
                 { field: 'ContactTitle', type: 'string' },
-                { field: 'Address', type: 'string' },
+                { field: 'Address', type: 'string' }
             ]},
             { columnHeader: 'Third', columns: [
                 { field: 'PostlCode', type: 'string' },
-                { field: 'Contry', type: 'string' },
+                { field: 'Contry', type: 'string' }
             ]},
         ];
     }