Merge pull request #7100 from IgniteUI/mkirova/fix-7091

chore(*): Fix issue with cells that no longer exits in DOM returned b…

Author: ChronosSF

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

@@ -25,24 +25,6 @@ export class IgxGridRowComponent extends IgxRowDirective<IgxGridComponent> {
             super(gridAPI, crudService, selectionService, element, cdr);
         }
 
-    @ViewChildren('cell')
-    private _cells: QueryList<any>;
-
-    public get cells() {
-        const res = new QueryList<any>();
-        if (!this._cells) {
-            return res;
-        }
-        const cList = this._cells.filter((item) => item.nativeElement.parentElement !== null)
-        .sort((item1, item2) => item1.column.visibleIndex - item2.column.visibleIndex);
-        res.reset(cList);
-        return res;
-    }
-
-    public set cells(cells) {
-
-    }
-
     @HostBinding('class.igx-grid__tr--mrl')
     get hasColumnLayouts(): boolean {
         return this.grid.hasColumnLayouts;

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

@@ -151,7 +151,6 @@ describe('IgxHierarchicalGrid Basic Navigation #hGrid', () => {
     }));
 
     it('should allow navigating to start in child grid when child grid target row moves outside the parent view port.', (async () => {
-        pending('related to the bug #7091');
         hierarchicalGrid.verticalScrollContainer.scrollTo(2);
         await wait(DEBOUNCE_TIME);
         fixture.detectChanges();

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

@@ -21,16 +21,8 @@ import { IgxHierarchicalGridCellComponent } from './hierarchical-cell.component'
     providers: [{ provide: IgxRowDirective, useExisting: forwardRef(() => IgxHierarchicalRowComponent) }]
 })
 export class IgxHierarchicalRowComponent extends IgxRowDirective<IgxHierarchicalGridComponent> {
-    /**
-     * The rendered cells in the row component.
-     *
-     * ```typescript
-     * // get the cells of the third selected row
-     * let selectedRowCells = this.grid.selectedRows[2].cells;
-     * ```
-     */
     @ViewChildren(forwardRef(() => IgxHierarchicalGridCellComponent), { read: IgxHierarchicalGridCellComponent })
-    public cells: QueryList<IgxHierarchicalGridCellComponent>;
+    protected _cells: QueryList<IgxHierarchicalGridCellComponent>;
 
     @ViewChild('expander', { read: ElementRef })
     public expander: ElementRef<HTMLElement>;

projects/igniteui-angular/src/lib/grids/row.directive.ts

@@ -100,16 +100,31 @@ export class IgxRowDirective<T extends IgxGridBaseDirective & GridType> implemen
     @ViewChild(forwardRef(() => IgxCheckboxComponent), { read: IgxCheckboxComponent })
     public checkboxElement: IgxCheckboxComponent;
 
+    @ViewChildren('cell')
+    protected _cells: QueryList<any>;
+
     /**
-     * The rendered cells in the row component.
+     * Gets the rendered cells in the row component.
      *
      * ```typescript
      * // get the cells of the third selected row
      * let selectedRowCells = this.grid.selectedRows[2].cells;
      * ```
      */
-    @ViewChildren(forwardRef(() => IgxGridCellComponent))
-    public cells: QueryList<IgxGridCellComponent>;
+    public get cells() {
+        const res = new QueryList<any>();
+        if (!this._cells) {
+            return res;
+        }
+        const cList = this._cells.filter((item) => item.nativeElement.parentElement !== null)
+        .sort((item1, item2) => item1.column.visibleIndex - item2.column.visibleIndex);
+        res.reset(cList);
+        return res;
+    }
+
+    public set cells(cells) {
+
+    }
 
     /**
      * @hidden

projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid-row.component.ts

@@ -13,16 +13,8 @@ import { IgxTreeGridAPIService } from './tree-grid-api.service';
 export class IgxTreeGridRowComponent extends IgxRowDirective<IgxTreeGridComponent> implements DoCheck {
     private _treeRow: ITreeGridRecord;
 
-    /**
-     * The rendered cells in the row component.
-     *
-     * ```typescript
-     * const row = this.grid.getRowByKey(1);
-     * const cells = row.cells;
-     * ```
-     */
     @ViewChildren('treeCell')
-    public cells: QueryList<any>;
+    protected _cells: QueryList<any>;
 
     /**
      * The `ITreeGridRecord` passed to the row component.