From d5f1d8e28a71454f9038efb4528f8997a563ae98 Mon Sep 17 00:00:00 2001
From: Brian Vaughn <bvaughn@fb.com>
Date: Tue, 23 Jun 2020 10:54:41 -0400
Subject: [PATCH] Shutdown DevTools Bridge synchronously when unmounting

---
 .../react-devtools-shared/src/devtools/views/DevTools.js     | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/packages/react-devtools-shared/src/devtools/views/DevTools.js b/packages/react-devtools-shared/src/devtools/views/DevTools.js
index 56f11a1c3f051..cb5c36cf680bc 100644
--- a/packages/react-devtools-shared/src/devtools/views/DevTools.js
+++ b/packages/react-devtools-shared/src/devtools/views/DevTools.js
@@ -13,7 +13,7 @@ import '@reach/menu-button/styles.css';
 import '@reach/tooltip/styles.css';
 
 import * as React from 'react';
-import {useEffect, useMemo, useRef} from 'react';
+import {useEffect, useLayoutEffect, useMemo, useRef} from 'react';
 import Store from '../store';
 import {BridgeContext, ContextMenuContext, StoreContext} from './context';
 import Components from './Components/Components';
@@ -169,9 +169,10 @@ export default function DevTools({
     };
   }, [showTabBar]);
 
-  useEffect(() => {
+  useLayoutEffect(() => {
     return () => {
       try {
+        // Shut the Bridge down synchronously (during unmount).
         bridge.shutdown();
       } catch (error) {
         // Attempting to use a disconnected port.