From d1511e98efbcfc25f82b0df13a1379cee67d99c9 Mon Sep 17 00:00:00 2001 From: Arkan Ahmedov Date: Wed, 24 Jul 2024 16:15:13 +0300 Subject: [PATCH] fix(query-builder): search value input for dateTime focus --- .../grid/grid-filtering-advanced.spec.ts | 32 ++++++++++++++++++- .../query-builder.component.html | 1 + .../src/lib/test-utils/grid-samples.spec.ts | 4 +-- 3 files changed, 34 insertions(+), 3 deletions(-) diff --git a/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-advanced.spec.ts b/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-advanced.spec.ts index ca69837bb04..657cf9fbc7f 100644 --- a/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-advanced.spec.ts +++ b/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-advanced.spec.ts @@ -3038,9 +3038,39 @@ describe('IgxGrid - Advanced Filtering #grid - ', () => { GridFunctions.clickAdvancedFilteringColumnSelect(fix); fix.detectChanges(); const dropdownValues = GridFunctions.getAdvancedFilteringSelectDropdownItems(fix).map((x: any) => x.innerText); - const expectedValues = ['ID', 'ProductName', 'Downloads', 'Released', 'ReleaseDate', 'Another Field']; + const expectedValues = ['ID', 'ProductName', 'Downloads', 'Released', 'ReleaseDate', 'Another Field', 'DateTimeCreated']; expect(expectedValues).toEqual(dropdownValues); })); + + it('Should correctly focus the search value input when editing the filtering expression', fakeAsync(() => { + // Open dialog through API. + grid.openAdvancedFilteringDialog(); + fix.detectChanges(); + + //Create dateTime filtering expression + const tree = new FilteringExpressionsTree(FilteringLogic.And); + tree.filteringOperands.push({ + fieldName: 'DateTimeCreated', searchVal: '11/11/2000 10:11:11 AM', condition: IgxStringFilteringOperand.instance().condition('equals') + }); + + grid.advancedFilteringExpressionsTree = tree; + fix.detectChanges(); + + // Hover the last visible expression chip + const expressionItem = fix.nativeElement.querySelectorAll(`.${ADVANCED_FILTERING_EXPRESSION_ITEM_CLASS}`)[0]; + expressionItem.dispatchEvent(new MouseEvent('mouseenter')); + tick(); + fix.detectChanges(); + + // Click the edit icon to enter edit mode of the expression. + GridFunctions.clickAdvancedFilteringTreeExpressionChipEditIcon(fix, [0]); + tick(); + fix.detectChanges(); + + //Check for the active element + let searchValueInput = GridFunctions.getAdvancedFilteringValueInput(fix).querySelector('input'); + expect(document.activeElement).toBe(searchValueInput, 'The input should be the active element.'); + })); }); describe('External - ', () => { diff --git a/projects/igniteui-angular/src/lib/query-builder/query-builder.component.html b/projects/igniteui-angular/src/lib/query-builder/query-builder.component.html index 55f2f7a2728..249e728105b 100644 --- a/projects/igniteui-angular/src/lib/query-builder/query-builder.component.html +++ b/projects/igniteui-angular/src/lib/query-builder/query-builder.component.html @@ -338,6 +338,7 @@
> - - + + `, standalone: true, imports: [IgxGridComponent, IgxColumnComponent, IgxColumnGroupComponent]