Skip to content

Commit 93ff065

Browse files
Otixagedinakova
Otixa
and
gedinakova
authored
fix(grid): fixed advancedFilteringExpressionsTree rehydration #15500 (#15506)
Co-authored-by: Galina Edinakova <[email protected]>
1 parent cc47e51 commit 93ff065

7 files changed

+126
-14
lines changed

‎projects/igniteui-angular/src/lib/data-operations/expressions-tree-util.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -150,7 +150,7 @@ function recreateExpression(expression: IFilteringExpression, fields: FieldType[
150150
}
151151

152152
if (!expression.condition && expression.conditionName) {
153-
throw Error('Wrong `conditionName`, `condition` or `field` provided!');
153+
throw Error('Wrong `conditionName`, `condition` or `field` provided! It is possible that there is a type mismatch between the condition type and field type.');
154154
}
155155

156156
if (!expression.conditionName) {

‎projects/igniteui-angular/src/lib/data-operations/filtering-condition.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -908,7 +908,7 @@ export interface IFilteringOperation {
908908
hidden?: boolean;
909909
/* blazorCSSuppress */
910910
/* blazorAlternateType: FilteringOperationLogicHandler */
911-
logic: (value: any, searchVal?: any, ignoreCase?: boolean) => boolean;
911+
logic?: null | ((value: any, searchVal?: any, ignoreCase?: boolean) => boolean);
912912
}
913913

914914
/**

‎projects/igniteui-angular/src/lib/data-operations/filtering-expression.interface.ts

+3-3
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,9 @@ export enum FilteringLogic {
1414
*/
1515
export declare interface IFilteringExpression {
1616
fieldName: string;
17-
condition?: IFilteringOperation;
18-
conditionName?: string;
17+
condition?: IFilteringOperation | null;
18+
conditionName?: string | null;
1919
searchVal?: any;
20-
searchTree?: IExpressionTree;
20+
searchTree?: IExpressionTree | null;
2121
ignoreCase?: boolean;
2222
}

‎projects/igniteui-angular/src/lib/data-operations/filtering-expressions-tree.ts

+3-3
Original file line numberDiff line numberDiff line change
@@ -11,9 +11,9 @@ export enum FilteringExpressionsTreeType {
1111
export declare interface IExpressionTree {
1212
filteringOperands: (IExpressionTree | IFilteringExpression)[];
1313
operator: FilteringLogic;
14-
fieldName?: string;
15-
entity?: string;
16-
returnFields?: string[];
14+
fieldName?: string | null;
15+
entity?: string | null;
16+
returnFields?: string[] | null;
1717
}
1818

1919
/* marshalByValue */

‎projects/igniteui-angular/src/lib/grids/grid-base.directive.ts

+16-6
Original file line numberDiff line numberDiff line change
@@ -1856,8 +1856,8 @@ export abstract class IgxGridBaseDirective implements GridType,
18561856
}
18571857

18581858
value.type = FilteringExpressionsTreeType.Regular;
1859-
if (value && this.columns) {
1860-
this._filteringExpressionsTree = recreateTreeFromFields(value, this.columns) as IFilteringExpressionsTree;
1859+
if (value && this._columns?.length > 0) {
1860+
this._filteringExpressionsTree = recreateTreeFromFields(value, this._columns) as IFilteringExpressionsTree;
18611861
} else {
18621862
this._filteringExpressionsTree = value;
18631863
}
@@ -1906,7 +1906,11 @@ export abstract class IgxGridBaseDirective implements GridType,
19061906

19071907
if (value && isTree(value)) {
19081908
value.type = FilteringExpressionsTreeType.Advanced;
1909-
this._advancedFilteringExpressionsTree = recreateTreeFromFields(value, this.columns) as IFilteringExpressionsTree;
1909+
if (this._columns && this._columns.length > 0) {
1910+
this._advancedFilteringExpressionsTree = recreateTreeFromFields(value, this._columns) as IFilteringExpressionsTree;
1911+
} else {
1912+
this._advancedFilteringExpressionsTree = value;
1913+
}
19101914
this.filteringPipeTrigger++;
19111915
} else {
19121916
this._advancedFilteringExpressionsTree = null;
@@ -6607,6 +6611,9 @@ export abstract class IgxGridBaseDirective implements GridType,
66076611
if (this._columns && this._filteringExpressionsTree) {
66086612
this._filteringExpressionsTree = recreateTreeFromFields(this._filteringExpressionsTree, this.columns) as IFilteringExpressionsTree;
66096613
}
6614+
if (this._columns && this._advancedFilteringExpressionsTree) {
6615+
this._advancedFilteringExpressionsTree = recreateTreeFromFields(this._advancedFilteringExpressionsTree, this.columns) as IFilteringExpressionsTree;
6616+
}
66106617
this.resetCaches();
66116618
}
66126619

@@ -6668,9 +6675,12 @@ export abstract class IgxGridBaseDirective implements GridType,
66686675
this.autogenerateColumns();
66696676
} else {
66706677
this._columns = this.getColumnList();
6671-
if (this._columns && this._filteringExpressionsTree) {
6672-
this._filteringExpressionsTree = recreateTreeFromFields(this._filteringExpressionsTree, this._columns) as IFilteringExpressionsTree;
6673-
}
6678+
}
6679+
if (this._columns && this._filteringExpressionsTree) {
6680+
this._filteringExpressionsTree = recreateTreeFromFields(this._filteringExpressionsTree, this._columns) as IFilteringExpressionsTree;
6681+
}
6682+
if (this._columns && this._advancedFilteringExpressionsTree) {
6683+
this._advancedFilteringExpressionsTree = recreateTreeFromFields(this._advancedFilteringExpressionsTree, this._columns) as IFilteringExpressionsTree;
66746684
}
66756685

66766686
this.initColumns(this._columns, (col: IgxColumnComponent) => this.columnInit.emit(col));

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

+47
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ import {
1616
IgxGridExternalAdvancedFilteringComponent,
1717
IgxGridAdvancedFilteringBindingComponent,
1818
IgxGridAdvancedFilteringDynamicColumnsComponent,
19+
IgxGridAdvancedFilteringSerializedTreeComponent,
1920
IgxGridAdvancedFilteringWithToolbarComponent
2021
} from '../../test-utils/grid-samples.spec';
2122
import { FormattedValuesFilteringStrategy } from '../../data-operations/filtering-strategy';
@@ -1450,6 +1451,52 @@ describe('IgxGrid - Advanced Filtering #grid - ', () => {
14501451
// Verify no filtered data
14511452
expect(grid.filteredData).toBe(null);
14521453
}));
1454+
1455+
});
1456+
1457+
describe('Expression tree rehydration - ', () => {
1458+
it('should correctly filter with a deserialized expression tree.', fakeAsync(() => {
1459+
const errorSpy = spyOn(console, 'error');
1460+
let fix = TestBed.createComponent(IgxGridAdvancedFilteringSerializedTreeComponent);
1461+
fix.detectChanges();
1462+
let grid = fix.componentInstance.grid;
1463+
1464+
expect(errorSpy).not.toHaveBeenCalled();
1465+
1466+
// Verify filtered data
1467+
expect(grid.filteredData.length).toEqual(3);
1468+
expect(grid.rowList.length).toBe(3);
1469+
}));
1470+
1471+
it('should correctly filter with a declared IFilteringExpressionsTree object.', fakeAsync(() => {
1472+
const errorSpy = spyOn(console, 'error');
1473+
let fix = TestBed.createComponent(IgxGridAdvancedFilteringSerializedTreeComponent);
1474+
fix.detectChanges();
1475+
fix.componentInstance.grid.advancedFilteringExpressionsTree = fix.componentInstance.filterTreeObject;
1476+
fix.detectChanges();
1477+
let grid = fix.componentInstance.grid;
1478+
1479+
expect(errorSpy).not.toHaveBeenCalled();
1480+
1481+
// Verify filtered data
1482+
expect(grid.filteredData.length).toEqual(2);
1483+
expect(grid.rowList.length).toBe(2);
1484+
}));
1485+
1486+
it('should correctly filter when binding to a declared IFilteringExpressionsTree object.', fakeAsync(() => {
1487+
const errorSpy = spyOn(console, 'error');
1488+
let fix = TestBed.createComponent(IgxGridAdvancedFilteringSerializedTreeComponent);
1489+
fix.detectChanges();
1490+
fix.componentInstance.filterTree = fix.componentInstance.filterTreeObject;
1491+
fix.detectChanges();
1492+
let grid = fix.componentInstance.grid;
1493+
1494+
expect(errorSpy).not.toHaveBeenCalled();
1495+
1496+
// Verify filtered data
1497+
expect(grid.filteredData.length).toEqual(2);
1498+
expect(grid.rowList.length).toBe(2);
1499+
}));
14531500
});
14541501
});
14551502

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

+55
Original file line numberDiff line numberDiff line change
@@ -2100,6 +2100,61 @@ export class IgxGridAdvancedFilteringBindingComponent extends BasicGridComponent
21002100
}
21012101
}
21022102

2103+
@Component({
2104+
template: `
2105+
<igx-grid [data]="data" height="500px" [allowAdvancedFiltering]="true" [(advancedFilteringExpressionsTree)]="filterTree">
2106+
<igx-column width="100px" [field]="'ID'" [header]="'ID'" [hasSummary]="true" [filterable]="false" [resizable]="resizable">
2107+
</igx-column>
2108+
<igx-column width="100px" [field]="'ProductName'" [filterable]="filterable" [resizable]="resizable" dataType="string"></igx-column>
2109+
<igx-column width="100px" [field]="'Downloads'" [filterable]="filterable" [resizable]="resizable" dataType="number"></igx-column>
2110+
<igx-column width="100px" [field]="'Released'" [filterable]="filterable" [resizable]="resizable" dataType="boolean"></igx-column>
2111+
</igx-grid>`,
2112+
imports: [IgxGridComponent, IgxColumnComponent]
2113+
})
2114+
export class IgxGridAdvancedFilteringSerializedTreeComponent extends BasicGridComponent implements OnInit {
2115+
public resizable = false;
2116+
public filterable = true;
2117+
public filterTree: IFilteringExpressionsTree;
2118+
public filterTreeObject: IFilteringExpressionsTree;
2119+
2120+
public override data = SampleTestData.excelFilteringData();
2121+
2122+
public ngOnInit(): void {
2123+
this.filterTree = JSON.parse(`{
2124+
"filteringOperands": [
2125+
{
2126+
"conditionName": "greaterThan",
2127+
"fieldName": "Downloads",
2128+
"searchVal": 200
2129+
}
2130+
],
2131+
"operator": 0
2132+
}`);
2133+
2134+
this.filterTreeObject = {
2135+
"filteringOperands": [
2136+
{
2137+
"fieldName": "ProductName",
2138+
"condition": {
2139+
"name": "contains",
2140+
"isUnary": false,
2141+
"iconName": "filter_contains"
2142+
},
2143+
"conditionName": "contains",
2144+
"ignoreCase": true,
2145+
"searchVal": "Ig",
2146+
"searchTree": null
2147+
}
2148+
],
2149+
"operator": 1,
2150+
"returnFields": [
2151+
"ID",
2152+
"ProductName"
2153+
]
2154+
};
2155+
}
2156+
}
2157+
21032158
@Component({
21042159
template: `
21052160
<igx-grid [data]="data" width="300px" height="250px">

0 commit comments

Comments
 (0)