mirror of https://github.com/vector-im/riot-web
Fix dialog reappearing after hitting Enter
Fixes https://github.com/vector-im/riot-web/issues/3714 https://github.com/vector-im/riot-web/issues/3714#issuecomment-297460620 : > It's as if there are two dialogs and as one closes, the other one appears. For some reason matrix-org/matrix-react-sdk#822 is causing this. > I've realised it's because the `priorActiveElement` is probably the button that opened the dialog. If this is focused and the enter key is released, this triggers a keyPress which fires once the dialog has closed and the button has been focused 😬 the BaseDialog only calls stopPropagation _onKeyDown. The soln. was to submit the dialog as finished `onKeyUp`. This means the `priorActiveElement` is focussed after any key events that should be associated with the dialog.pull/21833/head
parent
9ac06d4c79
commit
5f0ecc588f
|
@ -57,7 +57,9 @@ export default React.createClass({
|
|||
}
|
||||
},
|
||||
|
||||
_onKeyDown: function(e) {
|
||||
// Must be when the key is released (and not pressed) otherwise componentWillUnmount
|
||||
// will focus another element which will receive future key events
|
||||
_onKeyUp: function(e) {
|
||||
if (e.keyCode === KeyCode.ESCAPE) {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
|
@ -79,7 +81,7 @@ export default React.createClass({
|
|||
const TintableSvg = sdk.getComponent("elements.TintableSvg");
|
||||
|
||||
return (
|
||||
<div onKeyDown={this._onKeyDown} className={this.props.className}>
|
||||
<div onKeyUp={this._onKeyUp} className={this.props.className}>
|
||||
<AccessibleButton onClick={this._onCancelClick}
|
||||
className="mx_Dialog_cancelButton"
|
||||
>
|
||||
|
|
Loading…
Reference in New Issue