Merge pull request react-dates#1464 from cshaver/crit--keyboard-close…

…-shortcuts-panel [a11y] Remove space/enter onKeyDown handling for open/close keyboard shortcuts panel
goshdarnheck · Nov 14, 2018 · 9426234 · 9426234
2 parents e76e308 + ca4b67c
commit 9426234
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 25 deletions.
diff --git a/src/components/DayPickerKeyboardShortcuts.jsx b/src/components/DayPickerKeyboardShortcuts.jsx
@@ -105,9 +105,6 @@ class DayPickerKeyboardShortcuts extends React.PureComponent {
     // amounts to a very basic focus trap. The user can exit the panel by "pressing" the
     // close button or hitting escape
     switch (e.key) {
-      case 'Enter':
-      case ' ':
-      case 'Spacebar': // for older browsers
       case 'Escape':
         closeKeyboardShortcutsPanel();
         break;
@@ -190,13 +187,6 @@ class DayPickerKeyboardShortcuts extends React.PureComponent {
           type="button"
           aria-label={toggleButtonText}
           onClick={this.onShowKeyboardShortcutsButtonClick}
-          onKeyDown={(e) => {
-            if (e.key === 'Enter') {
-              e.preventDefault();
-            } else if (e.key === 'Space') {
-              this.onShowKeyboardShortcutsButtonClick(e);
-            }
-          }}
           onMouseUp={(e) => {
             e.currentTarget.blur();
           }}

diff --git a/test/components/DayPickerKeyboardShortcuts_spec.jsx b/test/components/DayPickerKeyboardShortcuts_spec.jsx
@@ -124,17 +124,6 @@ describe('DayPickerKeyboardShortcuts', () => {
           buttonWrapper.simulate('click');
           expect(openKeyboardShortcutsPanelStub.callCount).to.equal(1);
         });
-
-        it('onKeyDown Space calls onShowKeyboardShortcutsButtonClick', () => {
-          buttonWrapper.prop('onKeyDown')({ ...event, key: 'Space' });
-          expect(openKeyboardShortcutsPanelStub.callCount).to.equal(1);
-        });
-
-        it('onKeyDown Enter calls e.preventDefault and NOT onShowKeyboardShortcutsButtonClick', () => {
-          buttonWrapper.prop('onKeyDown')({ ...event, key: 'Enter' });
-          expect(event.preventDefault.callCount).to.equal(1);
-          expect(openKeyboardShortcutsPanelStub.notCalled).to.equal(true);
-        });
       });
 
       describe('when Mouse Up', () => {
@@ -215,10 +204,10 @@ describe('DayPickerKeyboardShortcuts', () => {
           expect(closeKeyboardShortcutsPanelStub.callCount).to.equal(1);
         });
 
-        it('onKeyDown Space calls e.stopPropagation and onShowKeyboardShortcutsButtonClick', () => {
+        it('onKeyDown calls e.stopPropagation and NOT onShowKeyboardShortcutsButtonClick', () => {
           closeButton.prop('onKeyDown')({ ...event, key: ' ' });
           expect(event.stopPropagation.callCount).to.equal(1);
-          expect(closeKeyboardShortcutsPanelStub.callCount).to.equal(1);
+          expect(closeKeyboardShortcutsPanelStub.callCount).to.equal(0);
         });
 
         it('onKeyDown Escape calls e.stopPropagation and onShowKeyboardShortcutsButtonClick', () => {
@@ -227,10 +216,10 @@ describe('DayPickerKeyboardShortcuts', () => {
           expect(closeKeyboardShortcutsPanelStub.callCount).to.equal(1);
         });
 
-        it('onKeyDown Enter calls e.stopPropagation and onShowKeyboardShortcutsButtonClick', () => {
+        it('onKeyDown calls e.stopPropagation and NOT onShowKeyboardShortcutsButtonClick', () => {
           closeButton.prop('onKeyDown')({ ...event, key: 'Enter' });
           expect(event.stopPropagation.callCount).to.equal(1);
-          expect(closeKeyboardShortcutsPanelStub.callCount).to.equal(1);
+          expect(closeKeyboardShortcutsPanelStub.callCount).to.equal(0);
         });
 
         it('onKeyDown Tab calls e.stopPropagation and e.preventDefault and NOT onShowKeyboardShortcutsButtonClick', () => {