diff --git a/src/typeahead/typeahead.spec.ts b/src/typeahead/typeahead.spec.ts index 16d9448fb7..59ff5b1b6d 100644 --- a/src/typeahead/typeahead.spec.ts +++ b/src/typeahead/typeahead.spec.ts @@ -630,6 +630,39 @@ describe('ngb-typeahead', () => { expect(fixture.componentInstance.model).toBeUndefined(); }); })); + + it('should clear model on user input when the editable option is on and no search was triggered', async(() => { + const html = ` +
`; + const fixture = createTestComponent(html); + fixture.whenStable().then(() => { + fixture.detectChanges(); + const compiled = fixture.nativeElement; + expect(getNativeInput(compiled)).toHaveCssClass('ng-invalid'); + expect(getNativeInput(compiled)).not.toHaveCssClass('ng-valid'); + + changeInput(compiled, 'one'); + fixture.detectChanges(); + expect(getNativeInput(compiled)).toHaveCssClass('ng-invalid'); + expect(getNativeInput(compiled)).not.toHaveCssClass('ng-valid'); + expect(fixture.componentInstance.model).toBeUndefined(); + + const event = createKeyDownEvent(Key.Enter); + getDebugInput(fixture.debugElement).triggerEventHandler('keydown', event); + fixture.detectChanges(); + expect(getNativeInput(compiled)).not.toHaveCssClass('ng-invalid'); + expect(getNativeInput(compiled)).toHaveCssClass('ng-valid'); + expect(fixture.componentInstance.model).toBe('one'); + + changeInput(compiled, ''); + fixture.detectChanges(); + expect(getNativeInput(compiled)).toHaveCssClass('ng-invalid'); + expect(getNativeInput(compiled)).not.toHaveCssClass('ng-valid'); + expect(fixture.componentInstance.model).toBeUndefined(); + }); + })); }); describe('select event', () => { @@ -947,6 +980,12 @@ class TestComponent { return this.findOutput$; } + findFilter = + (text$: Observable