fix(query-builder): fix edti/add button event handlers shifted up on …

…parent span (#14868)
IgniteUI · Oct 4, 2024 · 8814110 · 8814110
1 parent d9090f0
commit 8814110
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 15 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
@@ -2150,7 +2150,7 @@ describe('IgxGrid - Advanced Filtering #grid - ', () => {
             tick(50);
             fix.detectChanges();
             expect(editIcon.getAttribute('aria-hidden')).toBe('true');
-            expect(editIcon.getAttribute('tabIndex')).toBe('0');
+            expect(editIcon.getAttribute('tabIndex')).toBeFalsy();
         }));
 
         describe('Context Menu - ', () => {

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
@@ -147,20 +147,17 @@ <h6 class="igx-filter-empty__title">
                     expressionItem.hovered
                 "
             >
-                <span tabindex="-1">
-                    <igx-icon
-                        tabindex="0"
-                        (keydown)="invokeClick($event)"
-                        (click)="enterExpressionEdit(expressionItem)"
-                    >
+                <span tabindex="0"
+                    (keydown)="invokeClick($event)"
+                    (click)="enterExpressionEdit(expressionItem)">
+                    <igx-icon>
                         edit
                     </igx-icon>
                 </span>
-                <span tabindex="-1">
+                <span tabindex="0"
+                    (keydown)="invokeClick($event)"
+                    (click)="enterExpressionAdd(expressionItem)">
                     <igx-icon
-                        tabindex="0"
-                        (keydown)="invokeClick($event)"
-                        (click)="enterExpressionAdd(expressionItem)"
                         *ngIf="
                             !expressionItem.inAddMode &&
                             (expressionItem.parent !== currentGroup ||

diff --git a/projects/igniteui-angular/src/lib/test-utils/grid-functions.spec.ts b/projects/igniteui-angular/src/lib/test-utils/grid-functions.spec.ts
@@ -2092,11 +2092,11 @@ export class GridFunctions {
                 case 0: expect(element).toHaveClass('igx-filter-tree__line--or'); break;
                 case 1: expect(element).toHaveClass('igx-chip'); break;
                 case 2: expect(element).toHaveClass('igx-chip__remove'); break;
-                case 3: expect(element).toHaveClass('igx-icon');
-                    expect(element.innerText).toContain('edit');
+                case 3: expect(element.firstChild).toHaveClass('igx-icon');
+                    expect(element.firstChild.textContent).toContain('edit');
                     break;
-                case 4: expect(element).toHaveClass('igx-icon');
-                    expect(element.innerText).toContain('add');
+                case 4: expect(element.firstChild).toHaveClass('igx-icon');
+                    expect(element.firstChild.textContent).toContain('add');
                     break;
                 case 5: expect(element).toHaveClass('igx-chip'); break;
                 case 6: expect(element).toHaveClass('igx-chip__remove'); break;