test(filtering): added tests for filtering expressions tree bindings #6289

Author: igdmdimitrov

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

@@ -14,7 +14,8 @@ import { FilteringExpressionsTree } from '../../data-operations/filtering-expres
 import { FilteringLogic } from '../../data-operations/filtering-expression.interface';
 import {
     IgxGridAdvancedFilteringColumnGroupComponent,
-    IgxGridAdvancedFilteringComponent
+    IgxGridAdvancedFilteringComponent,
+    IgxGridAdvancedFilteringBindingComponent
 } from '../../test-utils/grid-samples.spec';
 
 const ADVANCED_FILTERING_OPERATOR_LINE_AND_CSS_CLASS = 'igx-filter-tree__line--and';
@@ -28,7 +29,8 @@ describe('IgxGrid - Advanced Filtering', () => {
         TestBed.configureTestingModule({
             declarations: [
                 IgxGridAdvancedFilteringColumnGroupComponent,
-                IgxGridAdvancedFilteringComponent
+                IgxGridAdvancedFilteringComponent,
+                IgxGridAdvancedFilteringBindingComponent
             ],
             imports: [
                 NoopAnimationsModule,
@@ -2692,8 +2694,42 @@ describe('IgxGrid - Advanced Filtering', () => {
             expect(expectedValues).toEqual(dropdownValues);
         }));
     });
-});
 
+    describe('IgxGrid - Advanced filtering expression tree bindings #grid', () => {
+        let fix, grid: IgxGridComponent;
+
+        beforeEach(fakeAsync(() => {
+            fix = TestBed.createComponent(IgxGridAdvancedFilteringBindingComponent);
+            grid = fix.componentInstance.grid;
+            fix.detectChanges();
+        }));
+
+        it('should correctly filter with \'advancedFilteringExpressionsTree\' binding', fakeAsync(() => {
+            // Verify initially filtered in Advanced Filtering - 'Downloads > 200'
+            expect(grid.filteredData.length).toEqual(3);
+            expect(grid.rowList.length).toBe(3);
+
+            // Open Advanced Filtering dialog
+            GridFunctions.clickAdvancedFilteringButton(fix);
+            fix.detectChanges();
+
+            // Verify the content of the first child (expression) of the root group.
+            verifyExpressionChipContent(fix, [0], 'Downloads', 'Greater Than', '200');
+
+            // Clear the filters
+            GridFunctions.clickAdvancedFilteringClearFilterButton(fix);
+            fix.detectChanges();
+
+            // Close the dialog
+            GridFunctions.clickAdvancedFilteringApplyButton(fix);
+            fix.detectChanges();
+
+            // Verify no filtered data
+            expect(grid.filteredData).toBe(null);
+            expect(grid.rowList.length).toBe(8);
+        }));
+    });
+});
 
 function selectColumnInEditModeExpression(fix, dropdownItemIndex: number) {
     GridFunctions.clickAdvancedFilteringColumnSelect(fix);

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

@@ -14,7 +14,7 @@ import { IgxStringFilteringOperand,
 import { FilteringExpressionsTree } from '../../data-operations/filtering-expressions-tree';
 import { SampleTestData } from '../../test-utils/sample-test-data.spec';
 import { GridFunctions, GridSummaryFunctions } from '../../test-utils/grid-functions.spec';
-import { IgxGridFilteringComponent, CustomFilter } from '../../test-utils/grid-samples.spec';
+import { IgxGridFilteringComponent, CustomFilter, IgxGridFilteringBindingComponent } from '../../test-utils/grid-samples.spec';
 import { ExpressionUI } from '../filtering/grid-filtering.service';
 
 describe('IgxGrid - Filtering actions #grid', () => {
@@ -663,6 +663,42 @@ describe('IgxGrid - Filtering actions #grid', () => {
     }));
 });
 
+describe('IgxGrid - Filtering expression tree bindings #grid', () => {
+    configureTestSuite();
+    beforeEach(async(() => {
+        TestBed.configureTestingModule({
+            declarations: [
+                IgxGridFilteringBindingComponent
+            ],
+            imports: [
+                BrowserAnimationsModule,
+                IgxGridModule]
+        })
+        .compileComponents();
+    }));
+
+    let fix, grid;
+    beforeEach(fakeAsync(() => {
+        fix = TestBed.createComponent(IgxGridFilteringBindingComponent);
+        fix.detectChanges();
+        grid = fix.componentInstance.grid;
+    }));
+
+    it('should correctly filter with \'filteringExpressionsTree\' binding', fakeAsync(() => {
+        // Verify initially filtered 'Downloads > 200'
+        expect(grid.rowList.length).toEqual(3);
+        expect(grid.filteringExpressionsTree.filteringOperands.length).toEqual(1);
+
+        // Clear filter
+        grid.clearFilter('Downloads');
+        fix.detectChanges();
+
+        // Verify no filtered data
+        expect(grid.rowList.length).toEqual(8);
+        expect(grid.filteringExpressionsTree.filteringOperands.length).toEqual(0);
+    }));
+});
+
 const expectedResults = [];
 
 // Fill expected results for 'date' filtering conditions based on the current date

projects/igniteui-angular/src/lib/test-utils/grid-samples.spec.ts

@@ -1,3 +1,4 @@
+import { FilteringExpressionsTree, FilteringLogic, IgxNumberFilteringOperand } from 'igniteui-angular';
 import { Component, TemplateRef, ViewChild, Input, AfterViewInit, ChangeDetectorRef, QueryList, ViewChildren, OnInit } from '@angular/core';
 import { IgxGridCellComponent } from '../grids/cell.component';
 import { IgxDateSummaryOperand, IgxNumberSummaryOperand, IgxSummaryResult } from '../grids/summaries/grid-summary';
@@ -1545,3 +1546,62 @@ export class GridWithUndefinedDataComponent implements OnInit  {
         }, 300);
     }
 }
+
+@Component({
+    template: `
+    <igx-grid [data]="data" height="500px" [allowFiltering]='true' [filteringExpressionsTree]="filterTree">
+        <igx-column width="100px" [field]="'ID'" [header]="'ID'" [hasSummary]="true" [filterable]="false" [resizable]="resizable">
+        </igx-column>
+        <igx-column width="100px" [field]="'ProductName'" [filterable]="filterable" [resizable]="resizable" dataType="string"></igx-column>
+        <igx-column width="100px" [field]="'Downloads'" [filterable]="filterable" [resizable]="resizable" dataType="number"></igx-column>
+        <igx-column width="100px" [field]="'Released'" [filterable]="filterable" [resizable]="resizable" dataType="boolean"></igx-column>
+    </igx-grid>`
+})
+export class IgxGridFilteringBindingComponent extends BasicGridComponent implements OnInit {
+    public resizable = false;
+    public filterable = true;
+    filterTree: FilteringExpressionsTree;
+
+    public data = SampleTestData.excelFilteringData();
+
+    public ngOnInit(): void {
+        this.filterTree = new FilteringExpressionsTree(FilteringLogic.And);
+        this.filterTree.filteringOperands = [
+          {
+            condition: IgxNumberFilteringOperand.instance().condition('greaterThan'),
+            fieldName: 'Downloads',
+            searchVal: 200
+          }
+        ];
+    }
+}
+
+@Component({
+    template: `
+    <igx-grid [data]="data" height="500px" [allowAdvancedFiltering]="true" [showToolbar]="true"
+        [advancedFilteringExpressionsTree]="filterTree" >
+        <igx-column width="100px" [field]="'ID'" [header]="'ID'" [hasSummary]="true" [filterable]="false" [resizable]="resizable">
+        </igx-column>
+        <igx-column width="100px" [field]="'ProductName'" [filterable]="filterable" [resizable]="resizable" dataType="string"></igx-column>
+        <igx-column width="100px" [field]="'Downloads'" [filterable]="filterable" [resizable]="resizable" dataType="number"></igx-column>
+        <igx-column width="100px" [field]="'Released'" [filterable]="filterable" [resizable]="resizable" dataType="boolean"></igx-column>
+    </igx-grid>`
+})
+export class IgxGridAdvancedFilteringBindingComponent extends BasicGridComponent implements OnInit {
+    public resizable = false;
+    public filterable = true;
+    filterTree: FilteringExpressionsTree;
+
+    public data = SampleTestData.excelFilteringData();
+
+    public ngOnInit(): void {
+        this.filterTree = new FilteringExpressionsTree(FilteringLogic.And);
+        this.filterTree.filteringOperands = [
+          {
+            condition: IgxNumberFilteringOperand.instance().condition('greaterThan'),
+            fieldName: 'Downloads',
+            searchVal: 200
+          }
+        ];
+    }
+}