Merge branch '18.2.x' into mtihova/bugfix-15136

Author: kdinev

projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-filtering.component.ts

@@ -549,7 +549,7 @@ export class IgxGridExcelStyleFilteringComponent extends BaseFilteringComponent
         const lowerCaseFilterValues = new Set(Array.from(expr.expression.searchVal).map((value: string) => value.toLowerCase()));
 
         this.grid.data.forEach(item => {
-            if (lowerCaseFilterValues.has(item[this.column.field]?.toLowerCase())) {
+            if (typeof item[this.column.field] === "string" && lowerCaseFilterValues.has(item[this.column.field]?.toLowerCase())) {
                 expr.expression.searchVal.add(item[this.column.field]);
             }
         });

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

@@ -13,6 +13,7 @@ import { GridFunctions } from '../../test-utils/grid-functions.spec';
 import { UIInteractions } from '../../test-utils/ui-interactions.spec';
 import { SampleTestData } from '../../test-utils/sample-test-data.spec';
 import { By } from '@angular/platform-browser';
+import { GridColumnDataType } from '../../data-operations/data-util';
 
 const IGX_CHECKBOX_LABEL = '.igx-checkbox__label';
 
@@ -751,6 +752,29 @@ describe('IgxTreeGrid - Filtering actions #tGrid', () => {
             emptyTextEl = searchComponent.querySelector('.igx-excel-filter__empty');
             expect(emptyTextEl.innerText).toEqual('No matches');
         }));
+
+        it('Should not throw console error when number column with dataType string is filtered.', fakeAsync(() => {
+            tGrid.columns[0].dataType = GridColumnDataType.String;
+            fix.detectChanges();
+            spyOn(console, 'error');
+
+            GridFunctions.clickExcelFilterIcon(fix, 'ID');
+            fix.detectChanges();
+            tick();
+
+            const excelMenu = GridFunctions.getExcelStyleFilteringComponent(fix, 'igx-tree-grid');
+            const checkboxes: any[] = Array.from(GridFunctions.getExcelStyleFilteringCheckboxes(fix, excelMenu, 'igx-tree-grid'));
+
+            checkboxes[2].click();
+            tick();
+            fix.detectChanges();
+
+            GridFunctions.clickApplyExcelStyleFiltering(fix, null, 'igx-tree-grid');
+            fix.detectChanges();
+            tick();
+
+            expect(console.error).not.toHaveBeenCalled();
+        }));
     });
 
     describe('Tree grid ESF templates', () => {

projects/igniteui-angular/src/lib/simple-combo/simple-combo.component.spec.ts

@@ -1119,7 +1119,8 @@ describe('IgxSimpleCombo', () => {
                     IgxSimpleComboSampleComponent,
                     IgxComboInContainerTestComponent,
                     IgxSimpleComboIconTemplatesComponent,
-                    IgxSimpleComboDirtyCheckTestComponent
+                    IgxSimpleComboDirtyCheckTestComponent,
+                    IgxSimpleComboTabBehaviorTestComponent
                 ]
             }).compileComponents();
         }));
@@ -2113,6 +2114,35 @@ describe('IgxSimpleCombo', () => {
 
             expect(reactiveForm.dirty).toBe(false);
         }));
+
+        it('should focus on the next combo when Tab is pressed', fakeAsync(() => {
+            fixture = TestBed.createComponent(IgxSimpleComboTabBehaviorTestComponent);
+            fixture.detectChanges();
+
+            const combos = fixture.debugElement.queryAll(By.directive(IgxSimpleComboComponent));
+            expect(combos.length).toBe(3);
+
+            const firstComboInput = combos[0].query(By.css(`.${CSS_CLASS_COMBO_INPUTGROUP}`));
+            const secondComboInput = combos[1].query(By.css(`.${CSS_CLASS_COMBO_INPUTGROUP}`));
+            const thirdComboInput = combos[2].query(By.css(`.${CSS_CLASS_COMBO_INPUTGROUP}`));
+
+            firstComboInput.nativeElement.focus();
+            tick();
+            fixture.detectChanges();
+            expect(document.activeElement).toEqual(firstComboInput.nativeElement);
+
+            UIInteractions.triggerEventHandlerKeyDown('Tab', firstComboInput);
+            secondComboInput.nativeElement.focus();
+            tick();
+            fixture.detectChanges();
+            expect(document.activeElement).toEqual(secondComboInput.nativeElement);
+
+            UIInteractions.triggerEventHandlerKeyDown('Tab', secondComboInput);
+            thirdComboInput.nativeElement.focus();
+            tick();
+            fixture.detectChanges();
+            expect(document.activeElement).toEqual(thirdComboInput.nativeElement);
+        }));
     });
 
     describe('Display density', () => {
@@ -3456,3 +3486,64 @@ export class IgxSimpleComboDirtyCheckTestComponent implements OnInit {
         ];
     }
 }
+
+@Component({
+    template: `
+    <form [formGroup]="form">
+        <div class="combo-section">
+            <igx-simple-combo
+                #combo
+                [data]="cities"
+                [displayKey]="'name'"
+                [valueKey]="'id'"
+                formControlName="city"
+            >
+            </igx-simple-combo>
+
+            <igx-simple-combo
+                #combo2
+                [data]="cities"
+                [displayKey]="'name'"
+                [valueKey]="'id'"
+                formControlName="city2"
+            ></igx-simple-combo>
+
+            <igx-simple-combo
+                #combo3
+                [data]="cities"
+                [displayKey]="'name'"
+                [valueKey]="'id'"
+                formControlName="city3"
+            ></igx-simple-combo>
+        </div>
+    </form>
+    `,
+    standalone: true,
+    imports: [IgxSimpleComboComponent, ReactiveFormsModule]
+})
+export class IgxSimpleComboTabBehaviorTestComponent implements OnInit {
+    @ViewChild('combo', { read: IgxSimpleComboComponent, static: true })
+    public combo: IgxSimpleComboComponent;
+    @ViewChild('combo2', { read: IgxSimpleComboComponent, static: true })
+    public combo2: IgxSimpleComboComponent;
+    @ViewChild('combo3', { read: IgxSimpleComboComponent, static: true })
+    public combo3: IgxSimpleComboComponent;
+
+    public cities = [];
+
+    public form = new FormGroup({
+        city: new FormControl<number>({ value: undefined, disabled: false }),
+        city2: new FormControl<number>({ value: undefined, disabled: false }),
+        city3: new FormControl<number>({ value: undefined, disabled: false }),
+    });
+
+    public ngOnInit(): void {
+        this.cities = [
+            { id: 1, name: 'New York' },
+            { id: 2, name: 'Los Angeles' },
+            { id: 3, name: 'Chicago' },
+            { id: 4, name: 'Houston' },
+            { id: 5, name: 'Phoenix' }
+        ];
+    }
+}

projects/igniteui-angular/src/lib/simple-combo/simple-combo.component.ts

@@ -466,9 +466,8 @@ export class IgxSimpleComboComponent extends IgxComboBaseDirective implements Co
         }
 
         this.composing = false;
-        // explicitly update selection and trigger text selection so that we don't have to force CD
+        // explicitly update selection so that we don't have to force CD
         this.textSelection.selected = true;
-        this.textSelection.trigger();
     }
 
     /** @hidden @internal */