Fix lost focus when modals open/close (#12437)
* Fix lost focus after modal closes Regression caused by the use of the wicg-inert polyfill * Fix regression introduced by wicg-inert * Catch errors to please CodeClimate
This commit is contained in:
parent
b532ead798
commit
35b142a7ad
1 changed files with 10 additions and 4 deletions
|
@ -56,15 +56,21 @@ export default class ModalRoot extends React.PureComponent {
|
||||||
} else if (!nextProps.children) {
|
} else if (!nextProps.children) {
|
||||||
this.setState({ revealed: false });
|
this.setState({ revealed: false });
|
||||||
}
|
}
|
||||||
if (!nextProps.children && !!this.props.children) {
|
|
||||||
this.activeElement.focus();
|
|
||||||
this.activeElement = null;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidUpdate (prevProps) {
|
componentDidUpdate (prevProps) {
|
||||||
if (!this.props.children && !!prevProps.children) {
|
if (!this.props.children && !!prevProps.children) {
|
||||||
this.getSiblings().forEach(sibling => sibling.removeAttribute('inert'));
|
this.getSiblings().forEach(sibling => sibling.removeAttribute('inert'));
|
||||||
|
|
||||||
|
// Because of the wicg-inert polyfill, the activeElement may not be
|
||||||
|
// immediately selectable, we have to wait for observers to run, as
|
||||||
|
// described in https://github.com/WICG/inert#performance-and-gotchas
|
||||||
|
Promise.resolve().then(() => {
|
||||||
|
this.activeElement.focus();
|
||||||
|
this.activeElement = null;
|
||||||
|
}).catch((error) => {
|
||||||
|
console.error(error);
|
||||||
|
});
|
||||||
}
|
}
|
||||||
if (this.props.children) {
|
if (this.props.children) {
|
||||||
requestAnimationFrame(() => {
|
requestAnimationFrame(() => {
|
||||||
|
|
Loading…
Reference in a new issue