From 52014671bf42df73fd8764de2c18c979cad47ff8 Mon Sep 17 00:00:00 2001
From: Dan Abramov <dan.abramov@gmail.com>
Date: Mon, 8 Apr 2019 18:03:48 +0100
Subject: [PATCH] Make Flow happy

---
 src/devtools/views/Components/Element.js | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/devtools/views/Components/Element.js b/src/devtools/views/Components/Element.js
index 4ac576c95b..421195d5af 100644
--- a/src/devtools/views/Components/Element.js
+++ b/src/devtools/views/Components/Element.js
@@ -86,20 +86,20 @@ export default function ElementView({ index, style, data }: Props) {
     [id, selectElementByID]
   );
 
-  const rendererID = store.getRendererIDForElement(element.id);
+  const rendererID = id !== null ? store.getRendererIDForElement(id) : null;
   // Individual elements don't have a corresponding leave handler.
   // Instead, it's implemented on the tree level.
   const handleMouseEnter = useCallback(() => {
-    if (rendererID !== null) {
+    if (element !== null && id !== null && rendererID !== null) {
       bridge.send('highlightElementInDOM', {
         displayName: element.displayName,
         hideAfterTimeout: false,
-        id: element.id,
+        id,
         rendererID,
         scrollIntoView: false,
       });
     }
-  }, [bridge, element, rendererID]);
+  }, [bridge, element, id, rendererID]);
 
   // Handle elements that are removed from the tree while an async render is in progress.
   if (element == null) {