Browse Source

fix(modals): Fix Modal escape handler not closing the modal in some scenarios (#33134)

Updates the handleEscapeClose event listener to apply to the entire document instead of just the modal portal. This fixes scenarios where the browser focus may not be in the modal portal and pressing escape doesn't properly close the modal.
edwardgou-sentry 2 years ago
parent
commit
98acdecc5c
1 changed files with 2 additions and 2 deletions
  1. 2 2
      static/app/components/globalModal/index.tsx

+ 2 - 2
static/app/components/globalModal/index.tsx

@@ -142,7 +142,7 @@ function GlobalModal({visible = false, options = {}, children, onClose}: Props)
       body.style.removeProperty('overflow');
       root.removeAttribute('aria-hidden');
       focusTrap.current?.deactivate();
-      portal.removeEventListener('keydown', handleEscapeClose);
+      document.removeEventListener('keydown', handleEscapeClose);
     };
 
     if (visible) {
@@ -150,7 +150,7 @@ function GlobalModal({visible = false, options = {}, children, onClose}: Props)
       root.setAttribute('aria-hidden', 'true');
       focusTrap.current?.activate();
 
-      portal.addEventListener('keydown', handleEscapeClose);
+      document.addEventListener('keydown', handleEscapeClose);
     } else {
       reset();
     }