feat(typeahead): do not trap keydown enter event

Closes #958 Closes #877 Closes #980 Closes #1032 Closes #1032
ng-bootstrap · Nov 13, 2016 · 1702df9 · 1702df9
1 parent 91ca518
commit 1702df9
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 4 deletions.
diff --git a/src/typeahead/typeahead.spec.ts b/src/typeahead/typeahead.spec.ts
@@ -28,8 +28,9 @@ enum Key {
 }
 
 function createKeyDownEvent(key: number) {
-  const event = {which: key, preventDefault: () => {}};
+  const event = {which: key, preventDefault: () => {}, stopPropagation: () => {}};
   spyOn(event, 'preventDefault');
+  spyOn(event, 'stopPropagation');
   return event;
 }
 
@@ -231,6 +232,7 @@ describe('ngb-typeahead', () => {
            expectInputValue(compiled, 'one');
            expect(fixture.componentInstance.model).toBe('one');
            expect(event.preventDefault).toHaveBeenCalled();
+           expect(event.stopPropagation).toHaveBeenCalled();
          });
        }));
 
@@ -249,6 +251,7 @@ describe('ngb-typeahead', () => {
       expectInputValue(compiled, 'one');
       expect(fixture.componentInstance.model).toBe('one');
       expect(event.preventDefault).toHaveBeenCalled();
+      expect(event.stopPropagation).toHaveBeenCalled();
     });
 
     it('should make previous/next results active with up/down arrow keys', () => {
@@ -370,7 +373,7 @@ describe('ngb-typeahead', () => {
       expect(getWindow(compiled)).toBeNull();
       expectInputValue(compiled, 'o');
       expect(fixture.componentInstance.model).toBe('o');
-      expect(event.preventDefault).toHaveBeenCalled();
+      expect(event.preventDefault).not.toHaveBeenCalled();
     });
 
     it('should properly display results when an owning components using OnPush strategy', fakeAsync(() => {

diff --git a/src/typeahead/typeahead.ts b/src/typeahead/typeahead.ts
@@ -191,26 +191,29 @@ export class NgbTypeahead implements ControlValueAccessor,
     }
 
     if (Key[toString(event.which)]) {
-      event.preventDefault();
-
       switch (event.which) {
         case Key.ArrowDown:
+          event.preventDefault();
           this._windowRef.instance.next();
           this._showHint();
           break;
         case Key.ArrowUp:
+          event.preventDefault();
           this._windowRef.instance.prev();
           this._showHint();
           break;
         case Key.Enter:
         case Key.Tab:
           const result = this._windowRef.instance.getActive();
           if (isDefined(result)) {
+            event.preventDefault();
+            event.stopPropagation();
             this._selectResult(result);
           }
           this._closePopup();
           break;
         case Key.Escape:
+          event.preventDefault();
           this.dismissPopup();
           break;
       }