Merge pull request #9521 from IgniteUI/hanastasov/fix-rowtype-interface-strictmode-m

fix(grid): use consistent return types to pass checks in strict mode

Author: Lipata

projects/igniteui-angular/src/lib/grids/common/row.interface.ts

@@ -22,9 +22,10 @@ export interface RowType {
     expanded?: boolean;
     deleted?: boolean;
     inEditMode?: boolean;
-    children?: ITreeGridRecord[];
-    parent?: ITreeGridRecord;
+    children?: RowType[];
+    parent?: RowType;
     hasChildren?: boolean;
+    treeRow? : ITreeGridRecord;
     grid: GridType;
     update?: (value: any) => void;
     delete?: () => any;

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

@@ -164,20 +164,6 @@ abstract class BaseRow implements RowType {
         return this.grid.gridAPI.row_deleted_transaction(this.key);
     }
 
-    /**
-     * Returns the child rows. Always returns null for IgxGridRow.
-     */
-    public get children(): null | ITreeGridRecord[] {
-        return null;
-    }
-
-    /**
-     * Returns the parent row, if any. Always returns null for IgxGridRow.
-     */
-    public get parent(): null | ITreeGridRecord {
-        return null;
-    }
-
     /**
      * Returns if the row has child rows. Always return false for IgxGridRow.
      */
@@ -269,6 +255,26 @@ export class IgxGridRow extends BaseRow implements RowType {
         }
         return this.index + this.grid.page * this.grid.perPage;
     }
+
+    /**
+     * Returns the parent row, if grid is grouped.
+     */
+    public get parent(): RowType {
+        let parent: IgxGroupByRow;
+        if (!this.grid.groupingExpressions.length) {
+            return undefined;
+        }
+
+        let i = this.index - 1;
+        while (i >= 0 && !parent) {
+            const rec = this.grid.dataView[i];
+            if (this.grid.isGroupByRecord(rec)) {
+                parent = new IgxGroupByRow(this.grid, i, rec);
+            }
+            i--;
+        }
+        return parent;
+    }
 }
 
 export class IgxTreeGridRow extends BaseRow implements RowType {
@@ -299,15 +305,23 @@ export class IgxTreeGridRow extends BaseRow implements RowType {
     /**
      * Returns the child rows.
      */
-    public get children(): ITreeGridRecord[] {
-        return this.treeRow.children;
+    public get children(): RowType[] {
+        const children: IgxTreeGridRow[] = [];
+        if (this.treeRow.expanded) {
+            this.treeRow.children.forEach((rec, i) => {
+                const row = new IgxTreeGridRow(this.grid, this.index + 1 + i, rec.data);
+                children.push(row);
+            });
+        }
+        return children;
     }
 
     /**
      * Returns the parent row.
      */
-    public get parent(): ITreeGridRecord {
-        return this.treeRow.parent;
+    public get parent(): RowType {
+        const row = this.grid.getRowByKey(this.treeRow.parent.rowID);
+        return row;
     }
 
     /**
@@ -428,6 +442,18 @@ export class IgxGroupByRow implements RowType {
         return this._groupRow ? this._groupRow : this.grid.dataView[this.index];
     }
 
+    /**
+     * Returns the child rows.
+     */
+    public get children(): RowType[] {
+        const children: IgxGridRow[] = [];
+        this.groupRow.records.forEach((rec, i) => {
+            const row = new IgxGridRow(this.grid, this.index + 1 + i, rec);
+            children.push(row);
+        });
+        return children;
+    }
+
     /**
      * @hidden
      */
@@ -437,6 +463,37 @@ export class IgxGroupByRow implements RowType {
         this.isGroupByRow = true;
     }
 
+    /**
+     * Gets whether the row is selected.
+     * Default value is `false`.
+     * ```typescript
+     * row.selected = true;
+     * ```
+     */
+    public get selected(): boolean {
+        return this.children.every(row => row.selected);
+    }
+
+    /**
+     * Sets whether the row is selected.
+     * Default value is `false`.
+     * ```typescript
+     * row.selected = !row.selected;
+     * ```
+     */
+    public set selected(val: boolean) {
+        if (val) {
+            this.children.forEach(row => {
+                this.grid.selectionService.selectRowsWithNoEvent([row.key]);
+            });
+        } else {
+            this.children.forEach(row => {
+                this.grid.selectionService.deselectRowsWithNoEvent([row.key]);
+            });
+        }
+        this.grid.cdr.markForCheck();
+    }
+
     /**
      * Gets/sets whether the group row is expanded.
      * ```typescript

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

@@ -1969,6 +1969,10 @@ describe('IgxGrid Component Tests #grid', () => {
             const virtRowsLength = grid.dataRowList.length;
             const indexToCompare = 32;
 
+            let firstRow = grid.getRowByIndex(0);
+            let secondRow = grid.getRowByIndex(1);
+            let thirdRow = grid.getRowByIndex(2);
+
             expect(indexToCompare > virtRowsLength).toBe(true);
             // Check if the comparable row is within the virt container
             expect(grid.gridAPI.get_row_by_index(virtRowsLength - 1) instanceof IgxGridRowComponent).toBe(true);
@@ -1980,53 +1984,104 @@ describe('IgxGrid Component Tests #grid', () => {
             expect(grid.getRowByIndex(32) instanceof IgxGridRow).toBe(true);
 
             // GroupBy column and get the collapsed grouped row
-            expect(grid.getRowByIndex(0) instanceof IgxGridRow).toBe(true);
+            expect(firstRow instanceof IgxGridRow).toBe(true);
+
+            // index
+            expect(firstRow.index).toBe(0);
+            expect(firstRow.viewIndex).toBe(0);
+            expect(firstRow.parent).toBeUndefined();
 
             fix.detectChanges();
             grid.groupBy({ fieldName: 'col1', dir: SortingDirection.Asc });
             fix.detectChanges();
 
+            firstRow = grid.getRowByIndex(0);
+            secondRow = grid.getRowByIndex(1);
+            thirdRow = grid.getRowByIndex(2);
+
             // First row is IgxGroupByRow second row is igxGridRow
-            expect(grid.getRowByIndex(0) instanceof IgxGroupByRow).toBe(true);
-            expect(grid.getRowByIndex(1) instanceof IgxGridRow).toBe(true);
+            expect(firstRow instanceof IgxGroupByRow).toBe(true);
+            expect(secondRow instanceof IgxGridRow).toBe(true);
 
             // expand/collapse first group row
-            grid.getRowByIndex(0).expanded = true;
+            firstRow.expanded = true;
             fix.detectChanges();
-            expect(grid.getRowByIndex(0).expanded).toBe(true);
 
-            grid.getRowByIndex(0).expanded = false;
+            firstRow = grid.getRowByIndex(0);
+            secondRow = grid.getRowByIndex(1);
+            thirdRow = grid.getRowByIndex(2);
+
+            expect(firstRow.expanded).toBe(true);
+            firstRow = grid.getRowByIndex(0);
+            secondRow = grid.getRowByIndex(1);
+            thirdRow = grid.getRowByIndex(2);
+
+            // index
+            expect(secondRow.index).toBe(1);
+
+            // select group row
+            expect(firstRow.selected).toBeFalse();
+            expect(secondRow.selected).toBeFalse();
+            firstRow.children.forEach(row => {
+                expect(row.selected).toBeFalse();
+            });
+            firstRow.selected = !firstRow.selected;
+
+            expect(firstRow.selected).toBeTrue();
+            expect(secondRow.selected).toBeTrue();
+            firstRow.children.forEach(row => {
+                expect(row.selected).toBeTrue();
+            });
+
+            firstRow.selected = !firstRow.selected;
+
+            expect(firstRow.selected).toBeFalse();
+            expect(secondRow.selected).toBeFalse();
+            firstRow.children.forEach(row => {
+                expect(row.selected).toBeFalse();
+            });
+
+            (firstRow as IgxGroupByRow).toggle();
             fix.detectChanges();
-            expect(grid.getRowByIndex(0).expanded).toBe(false);
+            expect(firstRow.expanded).toBe(false);
+
+            firstRow = grid.getRowByIndex(0);
+            secondRow = grid.getRowByIndex(1);
+            thirdRow = grid.getRowByIndex(2);
 
             // First row is still IgxGroupByRow and now the second row is as well IgxGroupByRow
-            expect(grid.getRowByIndex(0) instanceof IgxGroupByRow).toBe(true);
-            expect(grid.getRowByIndex(1) instanceof IgxGroupByRow).toBe(true);
+            expect(firstRow instanceof IgxGroupByRow).toBe(true);
+            expect(firstRow.key).toBeUndefined();
+            expect(secondRow instanceof IgxGroupByRow).toBe(true);
 
             // Check hasChildren and other API members for igxGrid
-            expect(grid.getRowByIndex(2).hasChildren).toBe(false);
-            expect(grid.getRowByIndex(2).index).toEqual(2);
-            expect(grid.getRowByIndex(1).isSummaryRow).toBeUndefined();
+            expect(thirdRow.hasChildren).toBe(false);
+            expect(thirdRow.children).toBeUndefined();
+            expect(thirdRow.parent instanceof IgxGroupByRow).toBe(true);
+            expect(thirdRow.parent.parent).toBeUndefined();
+            expect(thirdRow.index).toEqual(2);
+            expect(secondRow.isSummaryRow).toBeUndefined();
 
             // GroupByRow check
-            expect(grid.getRowByIndex(2).isGroupByRow).toBeUndefined();
-            expect(grid.getRowByIndex(1).isGroupByRow).toBe(true);
-            expect(grid.getRowByIndex(2).groupRow).toBeUndefined();
-            expect(grid.getRowByIndex(1).groupRow).toBeTruthy();
+            expect(thirdRow.isGroupByRow).toBeUndefined();
+            expect(secondRow.isGroupByRow).toBe(true);
+            expect(thirdRow.groupRow).toBeUndefined();
+            expect(secondRow.groupRow).toBeTruthy();
+
 
             // key and rowData check - first with group row (index 1) and then with IgxGridRow (index 2)
-            expect(grid.getRowByIndex(1).key).toBeUndefined();
-            expect(grid.getRowByIndex(1).data).toBeUndefined();
-            expect(grid.getRowByIndex(1).pinned).toBeUndefined();
-            expect(grid.getRowByIndex(1).selected).toBeUndefined();
-            expect(grid.getRowByIndex(2).key).toBeTruthy();
-            expect(grid.getRowByIndex(2).data).toBeTruthy();
-            expect(grid.getRowByIndex(2).pinned).toBe(false);
-            expect(grid.getRowByIndex(2).selected).toBe(false);
+            expect(secondRow.key).toBeUndefined();
+            expect(secondRow.data).toBeUndefined();
+            expect(secondRow.pinned).toBeUndefined();
+            expect(secondRow.selected).toBeFalse();
+            expect(thirdRow.key).toBeTruthy();
+            expect(thirdRow.data).toBeTruthy();
+            expect(thirdRow.pinned).toBe(false);
+            expect(thirdRow.selected).toBe(false);
 
             // Toggle selection
-            grid.getRowByIndex(2).selected = true;
-            expect(grid.getRowByIndex(2).selected).toBe(true);
+            thirdRow.selected = true;
+            expect(thirdRow.selected).toBe(true);
         });
 
         it('Verify that getRowByIndex returns correct data when paging is enabled', fakeAsync(() => {
@@ -2047,8 +2102,11 @@ describe('IgxGrid Component Tests #grid', () => {
             fix.detectChanges();
             tick();
 
+            const firstRow = grid.getRowByIndex(0);
             // Return the first row after page change
-            expect(grid.getRowByIndex(0) instanceof IgxGridRow).toBe(true);
+            expect(firstRow instanceof IgxGridRow).toBe(true);
+            expect(firstRow.index).toBe(0);
+            expect(firstRow.viewIndex).toBe(5);
         }));
     });
 

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

@@ -1169,7 +1169,7 @@ describe('IgxHierarchicalGrid Template Changing Scenarios #hGrid', () => {
         const firstRow = child1Grid.componentInstance.getRowByIndex(0);
         firstRow.expanded = true;
         expect(firstRow.hasChildren).toBe(true);
-        expect(firstRow.children).toBeNull();
+        expect(firstRow.children).toBeUndefined();
         expect(firstRow.viewIndex).toEqual(0);
         expect(firstRow.key).toBeDefined();
         expect(firstRow.data.ID).toEqual('00');

projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid-integration.spec.ts

@@ -20,7 +20,7 @@ import { IgxToggleModule } from '../../directives/toggle/toggle.directive';
 import { IgxNumberFilteringOperand, IgxStringFilteringOperand } from '../../data-operations/filtering-condition';
 import { IgxHierarchicalTransactionService } from '../../services/transaction/igx-hierarchical-transaction';
 import { IgxGridTransaction } from '../grid-base.directive';
-import { IgxGridCellComponent } from '../grid/public_api';
+import { IgxGridCellComponent, IgxTreeGridRow } from '../grid/public_api';
 import { IgxPaginatorComponent } from '../../paginator/paginator.component';
 import { HierarchicalTransaction, TransactionType } from '../../services/public_api';
 import { DropPosition } from '../moving/moving.service';
@@ -1706,10 +1706,12 @@ describe('IgxTreeGrid - Integration #tGrid', () => {
             treeGrid.filter('ID', 957, IgxStringFilteringOperand.instance().condition('contains'), false);
             fix.detectChanges();
 
+            const firstRow = treeGrid.getRowByIndex(0);
+
             // Check getRowByIndex expanded, children and parent members
-            expect(treeGrid.getRowByIndex(0).expanded).toBe(true);
+            expect(firstRow.expanded).toBe(true);
             // children.length equals the filtered our chidlren!
-            expect(treeGrid.getRowByIndex(0).children.length).toEqual(1);
+            expect(firstRow.children.length).toEqual(1);
             expect(treeGrid.getRowByIndex(1).parent.rowID).toEqual(147);
 
             const firstColumnField = treeGrid.columns[0].field;
@@ -1723,15 +1725,25 @@ describe('IgxTreeGrid - Integration #tGrid', () => {
             treeGrid.filter('ID', 957, IgxStringFilteringOperand.instance().condition('contains'), false);
             fix.detectChanges();
 
+            const firstRow = treeGrid.getRowByIndex(0);
+
             // Check getRowByIndex expanded, children and parent members
-            expect(treeGrid.getRowByIndex(0).expanded).toBe(true);
-            expect(treeGrid.getRowByIndex(0).hasChildren).toBe(true);
+            expect(firstRow.expanded).toBe(true);
+            expect(firstRow.hasChildren).toBe(true);
+            expect(firstRow.children[0].hasChildren).toBeFalse();
             // children.length equals the filtered our chidlren!
-            expect(treeGrid.getRowByIndex(0).children.length).toEqual(1);
+            expect(firstRow.children.length).toEqual(1);
+            expect(firstRow.children[0] instanceof IgxTreeGridRow).toBeTrue();
+            expect(firstRow.children[0].parent instanceof IgxTreeGridRow).toBeTrue();
+            expect(firstRow.children[0].parent.key).toBe(firstRow.key);
             expect(treeGrid.getRowByIndex(1).parent.rowID).toEqual(147);
 
-            treeGrid.getRowByIndex(0).expanded = false;
-            expect(treeGrid.getRowByIndex(0).expanded).toBe(false);
+            firstRow.expanded = false;
+            expect(firstRow.expanded).toBe(false);
+
+            expect(firstRow.pinned).toBeFalse();
+            firstRow.pinned = true;
+            expect(firstRow.pinned).toBeTrue();
         });
     });
 });