diff --git a/packages/material-ui/src/ButtonBase/ButtonBase.js b/packages/material-ui/src/ButtonBase/ButtonBase.js
index f34c7002808023..82cc86dbbb8011 100644
--- a/packages/material-ui/src/ButtonBase/ButtonBase.js
+++ b/packages/material-ui/src/ButtonBase/ButtonBase.js
@@ -206,6 +206,10 @@ const ButtonBase = React.forwardRef(function ButtonBase(props, ref) {
});
}
+ if (event.target === event.currentTarget && isNonNativeButton() && event.key === ' ') {
+ event.preventDefault();
+ }
+
if (onKeyDown) {
onKeyDown(event);
}
@@ -240,15 +244,13 @@ const ButtonBase = React.forwardRef(function ButtonBase(props, ref) {
// Keyboard accessibility for non interactive elements
if (
+ onClick &&
event.target === event.currentTarget &&
isNonNativeButton() &&
event.key === ' ' &&
!event.defaultPrevented
) {
- event.preventDefault();
- if (onClick) {
- onClick(event);
- }
+ onClick(event);
}
});
diff --git a/packages/material-ui/src/ButtonBase/ButtonBase.test.js b/packages/material-ui/src/ButtonBase/ButtonBase.test.js
index cc7e2e1022fc38..edbf34e11f00da 100644
--- a/packages/material-ui/src/ButtonBase/ButtonBase.test.js
+++ b/packages/material-ui/src/ButtonBase/ButtonBase.test.js
@@ -679,10 +679,11 @@ describe('', () => {
});
describe('keyboard accessibility for non interactive elements', () => {
- it('does not call onClick when a spacebar is pressed on the element', () => {
+ it('does not call onClick when a spacebar is pressed on the element but prevents the default', () => {
+ const onKeyDown = spy(event => event.defaultPrevented);
const onClickSpy = spy(event => event.defaultPrevented);
const { getByRole } = render(
-
+
Hello
,
);
@@ -694,6 +695,8 @@ describe('', () => {
});
expect(onClickSpy.callCount).to.equal(0);
+ // defaultPrevented?
+ expect(onKeyDown.returnValues[0]).to.equal(true);
});
it('does call onClick when a spacebar is released on the element', () => {
@@ -712,7 +715,7 @@ describe('', () => {
expect(onClickSpy.callCount).to.equal(1);
// defaultPrevented?
- expect(onClickSpy.returnValues[0]).to.equal(true);
+ expect(onClickSpy.returnValues[0]).to.equal(false);
});
it('does not call onClick when a spacebar is released and the default is prevented', () => {