From fe31923d9485201391238ab21d74b6242ccd602d Mon Sep 17 00:00:00 2001 From: Javier Gonzalez Date: Thu, 30 Apr 2020 12:02:35 +0200 Subject: [PATCH 1/2] ensure focus does not scroll the modal In IOS we found that the focus of an element would scroll the page so such element is brought into view. In our case we have a grid of several views (iframes) and whenever a modal would appear on one of those views then the whole app would scroll to show the cell were the modal appeared, which is undesireable. This PR fixes that. --- src/components/ModalPortal.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/ModalPortal.js b/src/components/ModalPortal.js index dea75c26..8bc0da63 100644 --- a/src/components/ModalPortal.js +++ b/src/components/ModalPortal.js @@ -233,7 +233,7 @@ export default class ModalPortal extends Component { // Don't steal focus from inner elements focusContent = () => - this.content && !this.contentHasFocus() && this.content.focus(); + this.content && !this.contentHasFocus() && this.content.focus({ preventScroll: true }); closeWithTimeout = () => { const closesAt = Date.now() + this.props.closeTimeoutMS; From 12b992d1edc0a9ec7e7cc9c4e93a1bfb0732904e Mon Sep 17 00:00:00 2001 From: Javier Gonzalez Date: Thu, 30 Apr 2020 12:35:27 +0200 Subject: [PATCH 2/2] fix linting --- src/components/ModalPortal.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/components/ModalPortal.js b/src/components/ModalPortal.js index 8bc0da63..5414c547 100644 --- a/src/components/ModalPortal.js +++ b/src/components/ModalPortal.js @@ -233,7 +233,9 @@ export default class ModalPortal extends Component { // Don't steal focus from inner elements focusContent = () => - this.content && !this.contentHasFocus() && this.content.focus({ preventScroll: true }); + this.content && + !this.contentHasFocus() && + this.content.focus({ preventScroll: true }); closeWithTimeout = () => { const closesAt = Date.now() + this.props.closeTimeoutMS;