Clicked to background overlay dismiss

facebook · May 17, 2017 · 9e453da · 9e453da
1 parent 404c66c
commit 9e453da
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 1 deletion.
diff --git a/packages/react-error-overlay/src/components/overlay.js b/packages/react-error-overlay/src/components/overlay.js
@@ -32,6 +32,11 @@ function createOverlay(
   const frameSettings: FrameSetting[] = frames.map(() => ({ compiled: false }));
   // Create overlay
   const overlay = document.createElement('div');
+  overlay.addEventListener('click', function(event: Event) {
+    // Clicks to background layer dismiss the popup
+    // Prevent clicks within the panel from accidentally dismissing
+    event.stopPropagation();
+  });
   applyStyles(overlay, overlayStyle);
   overlay.appendChild(createClose(document, closeCallback));
 

diff --git a/packages/react-error-overlay/src/overlay.js b/packages/react-error-overlay/src/overlay.js
@@ -79,8 +79,10 @@ function render(name: ?string, message: string, resolvedFrames: StackFrame[]) {
       };
     }
     if (document.body != null) {
-      document.body.style.margin = 0;
+      document.body.style.margin = '0';
       document.body.appendChild(overlay);
+      // Clicks to background overlay should dismiss error popup
+      (document.body: any).addEventListener('click', unmount);
     }
     additionalReference = additional;
   };