From 53063ba9507168ab1b07b5edc6b73da005685c56 Mon Sep 17 00:00:00 2001
From: grgr-dkrk <40130327+grgr-dkrk@users.noreply.github.com>
Date: Sat, 19 Oct 2019 13:14:17 +0900
Subject: [PATCH 1/3] fix Spacebar bug in Firefox

---
 src/Button.js                                   | 5 +++++
 src/__tests__/Button.test.js                    | 7 +++++++
 src/__tests__/__snapshots__/Button.test.js.snap | 2 ++
 3 files changed, 14 insertions(+)

diff --git a/src/Button.js b/src/Button.js
index 48d937d..acabae0 100644
--- a/src/Button.js
+++ b/src/Button.js
@@ -69,6 +69,10 @@ class AriaMenuButtonButton extends React.Component {
     this.context.ambManager.toggleMenu({}, { focusMenu: false });
   };
 
+  handleKeyUp = (event) => {
+    event.preventDefault();
+  }
+
   render() {
     const props = this.props;
     const ambManager = this.context.ambManager;
@@ -82,6 +86,7 @@ class AriaMenuButtonButton extends React.Component {
       'aria-expanded': ambManager.isOpen,
       'aria-disabled': props.disabled,
       onKeyDown: this.handleKeyDown,
+      onKeyUp: this.handleKeyUp,
       onClick: this.handleClick
     };
 
diff --git a/src/__tests__/Button.test.js b/src/__tests__/Button.test.js
index cab3ea2..23df13f 100644
--- a/src/__tests__/Button.test.js
+++ b/src/__tests__/Button.test.js
@@ -120,6 +120,13 @@ describe('<Button>', function() {
     expect(ambManager.toggleMenu).toHaveBeenCalledTimes(1);
   });
 
+  test('prevent behavior of a Button element when the space key is pressed', function() {
+    const wrapper = shallow(el(Button, null, 'foo'), shallowOptions);
+    wrapper.simulate('keyUp', spaceEvent);
+
+    expect(spaceEvent.preventDefault).toHaveBeenCalledTimes(1);
+  });
+
   test('escape key', function() {
     const wrapper = shallow(el(Button, null, 'foo'), shallowOptions);
     wrapper.simulate('keyDown', escapeEvent);
diff --git a/src/__tests__/__snapshots__/Button.test.js.snap b/src/__tests__/__snapshots__/Button.test.js.snap
index d51badb..23db396 100644
--- a/src/__tests__/__snapshots__/Button.test.js.snap
+++ b/src/__tests__/__snapshots__/Button.test.js.snap
@@ -11,6 +11,7 @@ exports[`<Button> DOM with all possible props and element child 1`] = `
   id="foo"
   onClick={[Function]}
   onKeyDown={[Function]}
+  onKeyUp={[Function]}
   role="button"
   style={
     Object {
@@ -31,6 +32,7 @@ exports[`<Button> DOM with only required props and text child 1`] = `
   aria-haspopup={true}
   onClick={[Function]}
   onKeyDown={[Function]}
+  onKeyUp={[Function]}
   role="button"
   tabIndex="0"
 >

From 72024ab88cc3fa78bc7332145514be92fb2b8d14 Mon Sep 17 00:00:00 2001
From: grgr-dkrk <40130327+grgr-dkrk@users.noreply.github.com>
Date: Mon, 18 Nov 2019 17:31:59 +0900
Subject: [PATCH 2/3] add guard-types and description

---
 src/Button.js | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/Button.js b/src/Button.js
index acabae0..1fe552c 100644
--- a/src/Button.js
+++ b/src/Button.js
@@ -69,8 +69,12 @@ class AriaMenuButtonButton extends React.Component {
     this.context.ambManager.toggleMenu({}, { focusMenu: false });
   };
 
+  // The Space key behaves like mousedown/mouseup in some browsers such as Firefox.
+  // To prevent an unexpected click event when the space key is released, event.preventDefault () is set in keyUp.
   handleKeyUp = (event) => {
-    event.preventDefault();
+    if (event.key === ' ' || event.key === 'Enter') {
+      event.preventDefault();
+    }
   }
 
   render() {

From 43a356e2f83d4de2ad903101395e0d6183c2166b Mon Sep 17 00:00:00 2001
From: grgr-dkrk <40130327+grgr-dkrk@users.noreply.github.com>
Date: Mon, 18 Nov 2019 17:32:26 +0900
Subject: [PATCH 3/3] improve testing

---
 src/__tests__/Button.test.js | 47 ++++++++++++++++++++++++++++++------
 1 file changed, 40 insertions(+), 7 deletions(-)

diff --git a/src/__tests__/Button.test.js b/src/__tests__/Button.test.js
index 23df13f..4d3817b 100644
--- a/src/__tests__/Button.test.js
+++ b/src/__tests__/Button.test.js
@@ -120,13 +120,6 @@ describe('<Button>', function() {
     expect(ambManager.toggleMenu).toHaveBeenCalledTimes(1);
   });
 
-  test('prevent behavior of a Button element when the space key is pressed', function() {
-    const wrapper = shallow(el(Button, null, 'foo'), shallowOptions);
-    wrapper.simulate('keyUp', spaceEvent);
-
-    expect(spaceEvent.preventDefault).toHaveBeenCalledTimes(1);
-  });
-
   test('escape key', function() {
     const wrapper = shallow(el(Button, null, 'foo'), shallowOptions);
     wrapper.simulate('keyDown', escapeEvent);
@@ -155,6 +148,46 @@ describe('<Button>', function() {
     expect(enterEvent.preventDefault).not.toHaveBeenCalled();
     expect(ambManager.toggleMenu).not.toHaveBeenCalled();
   });
+
+  test('prevent manager event when enter key is released.', function() {
+    const wrapper = shallow(
+      el(Button, { tag: 'button' }, 'foo'),
+      shallowOptions
+    );
+    jest.spyOn(ambManager, 'toggleMenu').mockImplementation(() => {
+      ambManager.isOpen = !ambManager.isOpen;
+    });
+
+    wrapper.simulate('click');
+    expect(ambManager.isOpen).toBe(true);
+
+    wrapper.simulate('keydown', enterEvent);
+    expect(ambManager.isOpen).toBe(false);
+
+    wrapper.simulate('keyup', enterEvent);
+    expect(ambManager.isOpen).toBe(false);
+    expect(enterEvent.preventDefault).toHaveBeenCalled();
+  });
+
+  test('prevent manager event when space key is released.', function() {
+    const wrapper = shallow(
+      el(Button, { tag: 'button' }, 'foo'),
+      shallowOptions
+    );
+    jest.spyOn(ambManager, 'toggleMenu').mockImplementation(() => {
+      ambManager.isOpen = !ambManager.isOpen;
+    });
+
+    wrapper.simulate('click');
+    expect(ambManager.isOpen).toBe(true);
+
+    wrapper.simulate('keydown', spaceEvent);
+    expect(ambManager.isOpen).toBe(false);
+
+    wrapper.simulate('keyup', spaceEvent);
+    expect(ambManager.isOpen).toBe(false);
+    expect(spaceEvent.preventDefault).toHaveBeenCalled();
+  });
 });
 
 describe('<Button> rendered via renderToString', function() {