test(h-grid): fix childData and undefined errors in tests

Author: teodosiah

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

@@ -28,6 +28,7 @@ import { QueryBuilderFunctions } from '../../query-builder/query-builder-functio
 import { By } from '@angular/platform-browser';
 import { IgxDateTimeEditorDirective } from '../../directives/date-time-editor/date-time-editor.directive';
 import { QueryBuilderSelectors } from '../../query-builder/query-builder.common';
+import { IgxHGridRemoteOnDemandComponent } from '../hierarchical-grid/hierarchical-grid.spec';
 
 describe('IgxGrid - Advanced Filtering #grid - ', () => {
     configureTestSuite((() => {
@@ -1602,6 +1603,10 @@ describe('IgxGrid - Advanced Filtering #grid - ', () => {
             tick(100);
             fix.detectChanges();
 
+            QueryBuilderFunctions.clickQueryBuilderExpressionCommitButton(fix, 1);
+            fix.detectChanges();
+            QueryBuilderFunctions.clickQueryBuilderExpressionCommitButton(fix, 0);
+            fix.detectChanges();
             // Close Advanced Filtering dialog.
             hgrid.closeAdvancedFilteringDialog(true);
             tick(200);
@@ -1611,6 +1616,45 @@ describe('IgxGrid - Advanced Filtering #grid - ', () => {
             expect(hgrid.filteredData.length).toEqual(5);
             expect(hgrid.rowList.length).toBe(5);
         }));
+
+        it('Should correctly apply filtering expressions tree to the hgrid component through API.', fakeAsync(() => {
+            // Close Advanced Filtering dialog.
+            hgrid.closeAdvancedFilteringDialog(false);
+            tick(200);
+            fix.detectChanges(); 
+            // Spy for error messages in the console
+            const consoleSpy = spyOn(console, 'error');
+            // Apply advanced filter through API.
+            const innerTree = new FilteringExpressionsTree(0, undefined, 'childData', ['ID']);
+            innerTree.filteringOperands.push({
+                fieldName: 'ID',
+                ignoreCase: false,
+                conditionName: IgxStringFilteringOperand.instance().condition('contains').name,
+                searchVal: '1'
+            });
+    
+            const tree = new FilteringExpressionsTree(0, undefined, 'rootData', ['ID']);
+            tree.filteringOperands.push({
+                fieldName: 'ID',
+                conditionName: IgxStringFilteringOperand.instance().condition('inQuery').name,
+                ignoreCase: false,
+                searchTree: innerTree
+            });
+            tree.filteringOperands.push(innerTree);
+            hgrid.advancedFilteringExpressionsTree = tree;
+            fix.detectChanges();
+
+            // Check for error messages in the console
+            expect(consoleSpy).not.toHaveBeenCalled();
+        }));
+
+        // fit('Should be able to filter hierarchicaly with load on demand through API.', fakeAsync(() => {
+        //     const fixture = TestBed.createComponent(IgxHGridRemoteOnDemandComponent);
+        //     const hierarchicalGrid = fixture.componentInstance.hgrid;
+        //     hierarchicalGrid.allowAdvancedFiltering = true;
+        //     fixture.detectChanges();
+
+        // }));
     });
 });
 

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

@@ -1219,27 +1219,32 @@ export class IgxHierarchicalGridComponent extends IgxHierarchicalGridBaseDirecti
 
     private generateSchema() {
         const filterableFields = this.columns.filter((column) => !column.columnGroup && column.filterable);
-        const entities: EntityType[] = [
-            {
-                name: null,
-                fields: filterableFields.map(f => ({
-                        field: f.field,
-                        dataType: f.dataType,
-                    //  label: f.label,
-                    //  header: f.header,
-                        editorOptions: f.editorOptions,
-                        filters: f.filters,
-                        pipeArgs: f.pipeArgs,
-                        defaultTimeFormat: f.defaultTimeFormat,
-                        defaultDateTimeFormat: f.defaultDateTimeFormat
-                    })) as FieldType[]
-            }
-        ];
+        let entities: EntityType[];  
+      
+        if(filterableFields.length !== 0) {
+            entities = [
+                {
+                    name: null,
+                    fields: filterableFields.map(f => ({
+                            field: f.field,
+                            dataType: f.dataType,
+                        //  label: f.label,
+                        //  header: f.header,
+                            editorOptions: f.editorOptions,
+                            filters: f.filters,
+                            pipeArgs: f.pipeArgs,
+                            defaultTimeFormat: f.defaultTimeFormat,
+                            defaultDateTimeFormat: f.defaultDateTimeFormat
+                        })) as FieldType[]
+                }
+            ];
 
-        entities[0].childEntities = this.childLayoutList.reduce((acc, rowIsland) => {
-            return acc.concat(this.generateChildEntity(rowIsland, this.data[0][rowIsland.key][0]));
+            entities[0].childEntities = this.childLayoutList.reduce((acc, rowIsland) => {
+                return acc.concat(this.generateChildEntity(rowIsland, this.data[0][rowIsland.key][0]));
+            }
+            , []);
+    
         }
-        , []);
 
         return entities;
     }

projects/igniteui-angular/src/lib/query-builder/query-builder-tree.component.ts

@@ -517,7 +517,7 @@ export class IgxQueryBuilderTreeComponent implements AfterViewInit, OnDestroy {
     /** @hidden */
     protected isAdvancedFiltering(): boolean {
         return (this.entities?.length === 1 && !this.entities[0]?.name) ||
-            this.entities.find(e => e.childEntities?.length > 0) !== undefined ||
+            this.entities?.find(e => e.childEntities?.length > 0) !== undefined ||
             this.entities !== this.queryBuilder.entities;
     }
 

src/app/hierarchical-grid-remote/hierarchical-grid-remote.sample.ts

@@ -1,4 +1,4 @@
-import { Component, ViewChild, OnInit, ChangeDetectorRef } from '@angular/core';
+import { Component, ViewChild, OnInit, ChangeDetectorRef, AfterViewInit } from '@angular/core';
 import {
     IgxRowIslandComponent,
     IgxHierarchicalGridComponent,
@@ -18,7 +18,7 @@ const API_ENDPOINT = 'https://data-northwind.indigo.design';
     styleUrls: ['hierarchical-grid-remote.sample.scss'],
     imports: [IGX_HIERARCHICAL_GRID_DIRECTIVES]
 })
-export class HierarchicalGridRemoteSampleComponent implements OnInit {
+export class HierarchicalGridRemoteSampleComponent implements OnInit, AfterViewInit {
     @ViewChild('hGrid', { static: true })
     private hGrid: IgxHierarchicalGridComponent;
 
@@ -71,15 +71,13 @@ export class HierarchicalGridRemoteSampleComponent implements OnInit {
         ordersTree.filteringOperands.push({
             fieldName: 'shipVia',
             ignoreCase: false,
-            condition: IgxStringFilteringOperand.instance().condition('equals'),
             conditionName: IgxStringFilteringOperand.instance().condition('equals').name,
             searchVal: 'AirCargo'
         });
 
         const customersTree = new FilteringExpressionsTree(0, undefined, 'Customers', ['customerId', 'companyName', 'contactName', 'contactTitle']);
         customersTree.filteringOperands.push({
             fieldName: 'customerId',
-            condition: IgxStringFilteringOperand.instance().condition('notInQuery'),
             conditionName: IgxStringFilteringOperand.instance().condition('notInQuery').name,
             ignoreCase: false,
             searchTree: ordersTree