fix(simple-combo): clear input on blur when bound to remote data

Author: RivaIvanova

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

@@ -2077,6 +2077,18 @@ describe('IgxSimpleCombo', () => {
             const selectedItem = combo.data[combo.data.length - 1];
             expect(combo.displayValue).toEqual([`${selectedItem[combo.displayKey]}`]);
         }));
+        it('should clear input on blur when bound to remote data and no item is selected', () => {
+            input.triggerEventHandler('focus', {});
+            fixture.detectChanges();
+
+            UIInteractions.simulateTyping('pro', input);
+            fixture.detectChanges();
+
+            UIInteractions.triggerEventHandlerKeyDown('Tab', input);
+            fixture.detectChanges();
+
+            expect(combo.comboInput.value).toEqual('');
+        });
     });
 });
 

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

@@ -524,8 +524,8 @@ export class IgxSimpleComboComponent extends IgxComboBaseDirective implements Co
     private clearOnBlur(): void {
         if (this.isRemote) {
             const searchValue = this.searchValue || this.comboInput.value;
-            const remoteValue = Object.keys(this._remoteSelection).map(e => this._remoteSelection[e])[0];
-            if (remoteValue && searchValue !== remoteValue) {
+            const remoteValue = Object.keys(this._remoteSelection).map(e => this._remoteSelection[e])[0] || '';
+            if (searchValue !== remoteValue) {
                 this.clear();
             }
             return;