From 35b142a7ad19821483f900e81e915a7925fd4eaf Mon Sep 17 00:00:00 2001
From: ThibG <thib@sitedethib.com>
Date: Sat, 30 Nov 2019 18:19:47 +0100
Subject: [PATCH] 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
---
app/javascript/mastodon/components/modal_root.js | 14 ++++++++++----
1 file changed, 10 insertions(+), 4 deletions(-)
diff --git a/app/javascript/mastodon/components/modal_root.js b/app/javascript/mastodon/components/modal_root.js
index c55fa0f74c..fa4e591921 100644
--- a/app/javascript/mastodon/components/modal_root.js
+++ b/app/javascript/mastodon/components/modal_root.js
@@ -56,15 +56,21 @@ export default class ModalRoot extends React.PureComponent {
} else if (!nextProps.children) {
this.setState({ revealed: false });
}
- if (!nextProps.children && !!this.props.children) {
- this.activeElement.focus();
- this.activeElement = null;
- }
}
componentDidUpdate (prevProps) {
if (!this.props.children && !!prevProps.children) {
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) {
requestAnimationFrame(() => {
--
GitLab