diff --git a/Libraries/Inspector/DevtoolsOverlay.js b/Libraries/Inspector/DevtoolsOverlay.js index 5cf03d3de0e..f7f391869fd 100644 --- a/Libraries/Inspector/DevtoolsOverlay.js +++ b/Libraries/Inspector/DevtoolsOverlay.js @@ -125,11 +125,11 @@ export default function DevtoolsOverlay({ getInspectorDataForViewAtPoint(inspectedView, x, y, viewData => { const {touchedViewTag, closestInstance, frame} = viewData; if (closestInstance != null || touchedViewTag != null) { + // We call `selectNode` for both non-fabric(viewTag) and fabric(instance), + // this makes sure it works for both architectures. + agent.selectNode(findNodeHandle(touchedViewTag)); if (closestInstance != null) { - // Fabric agent.selectNode(closestInstance); - } else { - agent.selectNode(findNodeHandle(touchedViewTag)); } setInspected({ frame, diff --git a/Libraries/Inspector/Inspector.js b/Libraries/Inspector/Inspector.js index d660528e938..dcde8ec513b 100644 --- a/Libraries/Inspector/Inspector.js +++ b/Libraries/Inspector/Inspector.js @@ -142,12 +142,11 @@ class Inspector extends React.Component< // Sync the touched view with React DevTools. // Note: This is Paper only. To support Fabric, // DevTools needs to be updated to not rely on view tags. - if (this.state.devtoolsAgent) { + const agent = this.state.devtoolsAgent; + if (agent) { + agent.selectNode(findNodeHandle(touchedViewTag)); if (closestInstance != null) { - // Fabric - this.state.devtoolsAgent.selectNode(closestInstance); - } else if (touchedViewTag != null) { - this.state.devtoolsAgent.selectNode(findNodeHandle(touchedViewTag)); + agent.selectNode(closestInstance); } }