fix(simple-combo): prevent Enter key default behavior when filtering data - 17.2.x (#14295)

* fix(simple-combo): prevent Enter key default behavior when filtering data

* test(simple-combo): use KeyboardEvent object

Author: RivaIvanova

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

@@ -1528,6 +1528,34 @@ describe('IgxSimpleCombo', () => {
             expect(combo.filteredData.length).toBeLessThan(combo.data.length)
             expect(combo.filteredData[0].field).toBe(target.value)
         });
+
+        it('should prevent Enter key default behavior when filtering data', fakeAsync(() => {
+            const keyEvent = new KeyboardEvent('keydown', { key: 'Enter' });
+            const spy = spyOn(keyEvent, 'preventDefault');
+
+            expect(combo.collapsed).toBe(true);
+            expect(combo.selection).toBeUndefined();
+
+            input.triggerEventHandler('focus', {});
+            UIInteractions.simulateTyping('c', input);
+            fixture.detectChanges();
+
+            expect(combo.collapsed).toBe(false);
+
+            combo.handleKeyDown(keyEvent);
+            tick();
+            fixture.detectChanges();
+
+            expect(combo.selection).toBeDefined();
+            expect(combo.collapsed).toBe(true);
+            expect(spy).toHaveBeenCalled();
+
+            combo.handleKeyDown(keyEvent);
+            tick();
+            fixture.detectChanges();
+
+            expect(spy).toHaveBeenCalledTimes(1);
+        }));
     });
 
     describe('Display density', () => {

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

@@ -319,10 +319,12 @@ export class IgxSimpleComboComponent extends IgxComboBaseDirective implements Co
             if (filtered === null || filtered === undefined) {
                 return;
             }
-            this.select(this.dropdown.focusedItem.itemID);
-            event.preventDefault();
-            event.stopPropagation();
-            this.close();
+            if (!this.dropdown.collapsed) {
+                this.select(this.dropdown.focusedItem.itemID);
+                event.preventDefault();
+                event.stopPropagation();
+                this.close();
+            }
             // manually trigger text selection as it will not be triggered during editing
             this.textSelection.trigger();
             return;