Fixed an issue where pressing enter key to activate the AccessibleButton

was also activating normal button that might just have received the
system focus as a result of the key press and the other way round.
The most obvious occurence of this issue is that dialogs were
reappearing when dismissed by pressing the enter key.
pull/21833/head
Peter Vágner 2017-12-05 23:23:40 +01:00
parent a31af39ca8
commit eda453bbe5
1 changed files with 6 additions and 2 deletions

View File

@ -27,8 +27,12 @@ import React from 'react';
export default function AccessibleButton(props) { export default function AccessibleButton(props) {
const {element, onClick, children, ...restProps} = props; const {element, onClick, children, ...restProps} = props;
restProps.onClick = onClick; restProps.onClick = onClick;
restProps.onKeyUp = function(e) { restProps.onKeyDown = function(e) {
if (e.keyCode == 13 || e.keyCode == 32) return onClick(e); if (e.keyCode == 13 || e.keyCode == 32) {
e.stopPropagation();
e.preventDefault();
return onClick(e);
}
}; };
restProps.tabIndex = restProps.tabIndex || "0"; restProps.tabIndex = restProps.tabIndex || "0";
restProps.role = "button"; restProps.role = "button";