fix(list-key-manager): not ignoring vertical key events in horizontal…

…-only mode (#10075) Fixes the a `ListKeyManager` that is in `horizontal`-only mode not ignoring the vertical key events due it falling into the switch statement.
angular · Feb 26, 2018 · ffbb425 · ffbb425
1 parent 2ece035
commit ffbb425
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 0 deletions.
diff --git a/src/cdk/a11y/key-manager/list-key-manager.spec.ts b/src/cdk/a11y/key-manager/list-key-manager.spec.ts
@@ -139,6 +139,28 @@ describe('Key managers', () => {
         expect(fakeKeyEvents.unsupported.defaultPrevented).toBe(false);
       });
 
+      it('should ignore the horizontal keys when only in vertical mode', () => {
+        keyManager.withVerticalOrientation().withHorizontalOrientation(null);
+
+        expect(keyManager.activeItemIndex).toBe(0);
+
+        keyManager.onKeydown(fakeKeyEvents.rightArrow);
+
+        expect(keyManager.activeItemIndex).toBe(0);
+        expect(fakeKeyEvents.rightArrow.defaultPrevented).toBe(false);
+      });
+
+      it('should ignore the horizontal keys when only in horizontal mode', () => {
+        keyManager.withVerticalOrientation(false).withHorizontalOrientation('ltr');
+
+        expect(keyManager.activeItemIndex).toBe(0);
+
+        keyManager.onKeydown(fakeKeyEvents.downArrow);
+
+        expect(keyManager.activeItemIndex).toBe(0);
+        expect(fakeKeyEvents.downArrow.defaultPrevented).toBe(false);
+      });
+
       describe('with `vertical` direction', () => {
         beforeEach(() => {
           keyManager.withVerticalOrientation();

diff --git a/src/cdk/a11y/key-manager/list-key-manager.ts b/src/cdk/a11y/key-manager/list-key-manager.ts
@@ -171,12 +171,16 @@ export class ListKeyManager<T extends ListKeyManagerOption> {
         if (this._vertical) {
           this.setNextItemActive();
           break;
+        } else {
+          return;
         }
 
       case UP_ARROW:
         if (this._vertical) {
           this.setPreviousItemActive();
           break;
+        } else {
+          return;
         }
 
       case RIGHT_ARROW:
@@ -186,6 +190,8 @@ export class ListKeyManager<T extends ListKeyManagerOption> {
         } else if (this._horizontal === 'rtl') {
           this.setPreviousItemActive();
           break;
+        } else {
+          return;
         }
 
       case LEFT_ARROW:
@@ -195,6 +201,8 @@ export class ListKeyManager<T extends ListKeyManagerOption> {
         } else if (this._horizontal === 'rtl') {
           this.setNextItemActive();
           break;
+        } else {
+          return;
         }
 
       default: