From 5ad1d849af027524ec618f812545c56992bdccde Mon Sep 17 00:00:00 2001 From: Rick Hanlon Date: Tue, 24 Mar 2020 18:48:18 -0400 Subject: [PATCH 1/4] Add getInspectorDataForViewAtPoint (take two) --- .../src/client/ReactDOMHostConfig.js | 1 + .../react-native-renderer/src/ReactFabric.js | 14 +- .../src/ReactFabricHostConfig.js | 12 ++ .../src/ReactNativeFiberHostComponent.js | 8 +- .../src/ReactNativeFiberInspector.js | 146 +++++++++++++++++- .../src/ReactNativeHostConfig.js | 19 ++- .../src/ReactNativeRenderer.js | 14 +- .../src/ReactNativeTypes.js | 40 +++++ .../src/ReactFiberReconciler.old.js | 8 +- .../src/forks/ReactFiberHostConfig.custom.js | 1 + .../src/ReactTestHostConfig.js | 1 + scripts/error-codes/codes.json | 3 +- scripts/flow/react-native-host-hooks.js | 18 +++ 13 files changed, 264 insertions(+), 21 deletions(-) diff --git a/packages/react-dom/src/client/ReactDOMHostConfig.js b/packages/react-dom/src/client/ReactDOMHostConfig.js index 099eded56ebf..17e32e52119c 100644 --- a/packages/react-dom/src/client/ReactDOMHostConfig.js +++ b/packages/react-dom/src/client/ReactDOMHostConfig.js @@ -140,6 +140,7 @@ export type UpdatePayload = Array; export type ChildSet = void; // Unused export type TimeoutHandle = TimeoutID; export type NoTimeout = -1; +export type RendererInspectionConfig = $ReadOnly<{||}>; type SelectionInformation = {| activeElementDetached: null | HTMLElement, diff --git a/packages/react-native-renderer/src/ReactFabric.js b/packages/react-native-renderer/src/ReactFabric.js index e90ba95683f3..d5f426bb5487 100644 --- a/packages/react-native-renderer/src/ReactFabric.js +++ b/packages/react-native-renderer/src/ReactFabric.js @@ -34,8 +34,10 @@ import ReactVersion from 'shared/ReactVersion'; import {UIManager} from 'react-native/Libraries/ReactPrivate/ReactNativePrivateInterface'; import {getClosestInstanceFromNode} from './ReactFabricComponentTree'; -import {getInspectorDataForViewTag} from './ReactNativeFiberInspector'; - +import { + getInspectorDataForViewTag, + getInspectorDataForViewAtPoint, +} from './ReactNativeFiberInspector'; import {LegacyRoot} from 'react-reconciler/src/ReactRootTags'; import ReactSharedInternals from 'shared/ReactSharedInternals'; import getComponentName from 'shared/getComponentName'; @@ -232,8 +234,14 @@ export { injectIntoDevTools({ findFiberByHostInstance: getClosestInstanceFromNode, - getInspectorDataForViewTag: getInspectorDataForViewTag, bundleType: __DEV__ ? 1 : 0, version: ReactVersion, rendererPackageName: 'react-native-renderer', + rendererConfig: { + getInspectorDataForViewTag: getInspectorDataForViewTag, + getInspectorDataForViewAtPoint: getInspectorDataForViewAtPoint.bind( + null, + findNodeHandle, + ), + }, }); diff --git a/packages/react-native-renderer/src/ReactFabricHostConfig.js b/packages/react-native-renderer/src/ReactFabricHostConfig.js index 308c2ed08bd8..cd77692132cc 100644 --- a/packages/react-native-renderer/src/ReactFabricHostConfig.js +++ b/packages/react-native-renderer/src/ReactFabricHostConfig.js @@ -15,6 +15,7 @@ import type { MeasureOnSuccessCallback, NativeMethods, ReactNativeBaseComponentViewConfig, + TouchedViewDataAtPoint, } from './ReactNativeTypes'; import {mountSafeCallback_NOT_REALLY_SAFE} from './NativeMethodsMixinUtils'; @@ -80,6 +81,17 @@ export type ReactListenerEvent = Object; export type ReactListenerMap = Object; export type ReactListener = Object; +export type RendererInspectionConfig = $ReadOnly<{| + // Deprecated. Replaced with getInspectorDataForViewAtPoint. + getInspectorDataForViewTag?: (tag: number) => Object, + getInspectorDataForViewAtPoint?: ( + inspectedView: Object, + locationX: number, + locationY: number, + callback: (viewData: TouchedViewDataAtPoint) => mixed, + ) => void, +|}>; + // TODO: Remove this conditional once all changes have propagated. if (registerEventHandler) { /** diff --git a/packages/react-native-renderer/src/ReactNativeFiberHostComponent.js b/packages/react-native-renderer/src/ReactNativeFiberHostComponent.js index f695971f4db4..fd83f5e887c9 100644 --- a/packages/react-native-renderer/src/ReactNativeFiberHostComponent.js +++ b/packages/react-native-renderer/src/ReactNativeFiberHostComponent.js @@ -33,12 +33,18 @@ import { class ReactNativeFiberHostComponent { _children: Array; _nativeTag: number; + _internalFiberInstanceHandle: Object; viewConfig: ReactNativeBaseComponentViewConfig<>; - constructor(tag: number, viewConfig: ReactNativeBaseComponentViewConfig<>) { + constructor( + tag: number, + viewConfig: ReactNativeBaseComponentViewConfig<>, + internalInstanceHandle: Object, + ) { this._nativeTag = tag; this._children = []; this.viewConfig = viewConfig; + this._internalFiberInstanceHandle = internalInstanceHandle; } blur() { diff --git a/packages/react-native-renderer/src/ReactNativeFiberInspector.js b/packages/react-native-renderer/src/ReactNativeFiberInspector.js index f48cfeb5a063..f94654ff0bba 100644 --- a/packages/react-native-renderer/src/ReactNativeFiberInspector.js +++ b/packages/react-native-renderer/src/ReactNativeFiberInspector.js @@ -8,6 +8,7 @@ */ import type {Fiber} from 'react-reconciler/src/ReactFiber'; +import type {TouchedViewDataAtPoint, InspectorData} from './ReactNativeTypes'; import { findCurrentHostFiber, @@ -27,6 +28,7 @@ if (__DEV__) { } let getInspectorDataForViewTag; +let getInspectorDataForViewAtPoint; if (__DEV__) { const traverseOwnerTreeUp = function(hierarchy, instance: any) { @@ -80,15 +82,68 @@ if (__DEV__) { const createHierarchy = function(fiberHierarchy) { return fiberHierarchy.map(fiber => ({ name: getComponentName(fiber.type), - getInspectorData: findNodeHandle => ({ - measure: callback => - UIManager.measure(getHostNode(fiber, findNodeHandle), callback), - props: getHostProps(fiber), - source: fiber._debugSource, - }), + getInspectorData: findNodeHandle => { + return { + props: getHostProps(fiber), + source: fiber._debugSource, + measure: callback => { + // If this is Fabric, we'll find a ShadowNode and use that to measure. + const hostFiber = findCurrentHostFiber(fiber); + const shadowNode = + hostFiber != null && + hostFiber.stateNode !== null && + hostFiber.stateNode.node; + + if (shadowNode) { + nativeFabricUIManager.measure(shadowNode, function( + x, + y, + width, + height, + pageX, + pageY, + ) { + callback(x, y, width, height, pageX, pageY); + }); + } else { + return UIManager.measure( + getHostNode(fiber, findNodeHandle), + callback, + ); + } + }, + }; + }, })); }; + const getInspectorDataForInstance = function(closestInstance): InspectorData { + // Handle case where user clicks outside of ReactNative + if (!closestInstance) { + return { + hierarchy: [], + props: emptyObject, + selection: null, + source: null, + }; + } + + const fiber = findCurrentFiberUsingSlowPath(closestInstance); + const fiberHierarchy = getOwnerHierarchy(fiber); + const instance = lastNonHostInstance(fiberHierarchy); + const hierarchy = createHierarchy(fiberHierarchy); + const props = getHostProps(instance); + const source = instance._debugSource; + const selection = fiberHierarchy.indexOf(instance); + + return { + hierarchy, + props, + selection, + source, + }; + }; + getInspectorDataForViewTag = function(viewTag: number): Object { const closestInstance = getClosestInstanceFromNode(viewTag); @@ -117,6 +172,70 @@ if (__DEV__) { source, }; }; + + getInspectorDataForViewAtPoint = function( + findNodeHandle: (componentOrHandle: any) => ?number, + inspectedView: Object, + locationX: number, + locationY: number, + callback: (viewData: TouchedViewDataAtPoint) => mixed, + ): void { + let closestInstance = null; + + if (inspectedView._internalInstanceHandle != null) { + // For Fabric we can look up the instance handle directly and measure it. + nativeFabricUIManager.findNodeAtPoint( + inspectedView._internalInstanceHandle.stateNode.node, + locationX, + locationY, + internalInstanceHandle => { + if (internalInstanceHandle == null) { + callback({ + pointerY: locationY, + frame: {left: 0, top: 0, width: 0, height: 0}, + ...getInspectorDataForInstance(closestInstance), + }); + } + + closestInstance = + internalInstanceHandle.stateNode.canonical._internalInstanceHandle; + nativeFabricUIManager.measure( + internalInstanceHandle.stateNode.node, + (x, y, width, height, pageX, pageY) => { + callback({ + pointerY: locationY, + frame: {left: pageX, top: pageY, width, height}, + ...getInspectorDataForInstance(closestInstance), + }); + }, + ); + }, + ); + } else if (inspectedView._internalFiberInstanceHandle != null) { + // For Paper we fall back to the old strategy using the React tag. + UIManager.findSubviewIn( + findNodeHandle(inspectedView), + [locationX, locationY], + (nativeViewTag, left, top, width, height) => { + const inspectorData = getInspectorDataForInstance( + getClosestInstanceFromNode(nativeViewTag), + ); + callback({ + ...inspectorData, + pointerY: locationY, + frame: {left, top, width, height}, + touchedViewTag: nativeViewTag, + }); + }, + ); + } else if (__DEV__) { + console.error( + 'getInspectorDataForViewAtPoint expects to receieve a host component', + ); + + return; + } + }; } else { getInspectorDataForViewTag = () => { invariant( @@ -124,6 +243,19 @@ if (__DEV__) { 'getInspectorDataForViewTag() is not available in production', ); }; + + getInspectorDataForViewAtPoint = ( + findNodeHandle: (componentOrHandle: any) => ?number, + inspectedView: Object, + locationX: number, + locationY: number, + callback: (viewData: TouchedViewDataAtPoint) => mixed, + ): void => { + invariant( + false, + 'getInspectorDataForViewAtPoint() is not available in production.', + ); + }; } -export {getInspectorDataForViewTag}; +export {getInspectorDataForViewAtPoint, getInspectorDataForViewTag}; diff --git a/packages/react-native-renderer/src/ReactNativeHostConfig.js b/packages/react-native-renderer/src/ReactNativeHostConfig.js index 2f0274a50197..990c4d2123a3 100644 --- a/packages/react-native-renderer/src/ReactNativeHostConfig.js +++ b/packages/react-native-renderer/src/ReactNativeHostConfig.js @@ -7,6 +7,8 @@ * @flow */ +import type {TouchedViewDataAtPoint} from './ReactNativeTypes'; + import invariant from 'shared/invariant'; // Modules provided by RN: @@ -46,6 +48,17 @@ export type ChildSet = void; // Unused export type TimeoutHandle = TimeoutID; export type NoTimeout = -1; +export type RendererInspectionConfig = $ReadOnly<{| + // Deprecated. Replaced with getInspectorDataForViewAtPoint. + getInspectorDataForViewTag?: (tag: number) => Object, + getInspectorDataForViewAtPoint?: ( + inspectedView: Object, + locationX: number, + locationY: number, + callback: (viewData: TouchedViewDataAtPoint) => mixed, + ) => void, +|}>; + const UPDATE_SIGNAL = {}; if (__DEV__) { Object.freeze(UPDATE_SIGNAL); @@ -112,7 +125,11 @@ export function createInstance( updatePayload, // props ); - const component = new ReactNativeFiberHostComponent(tag, viewConfig); + const component = new ReactNativeFiberHostComponent( + tag, + viewConfig, + internalInstanceHandle, + ); precacheFiberNode(internalInstanceHandle, tag); updateFiberProps(tag, props); diff --git a/packages/react-native-renderer/src/ReactNativeRenderer.js b/packages/react-native-renderer/src/ReactNativeRenderer.js index eb40fa485ab3..81a992ab6bfa 100644 --- a/packages/react-native-renderer/src/ReactNativeRenderer.js +++ b/packages/react-native-renderer/src/ReactNativeRenderer.js @@ -36,8 +36,10 @@ import ReactVersion from 'shared/ReactVersion'; import {UIManager} from 'react-native/Libraries/ReactPrivate/ReactNativePrivateInterface'; import {getClosestInstanceFromNode} from './ReactNativeComponentTree'; -import {getInspectorDataForViewTag} from './ReactNativeFiberInspector'; - +import { + getInspectorDataForViewTag, + getInspectorDataForViewAtPoint, +} from './ReactNativeFiberInspector'; import {LegacyRoot} from 'react-reconciler/src/ReactRootTags'; import ReactSharedInternals from 'shared/ReactSharedInternals'; import getComponentName from 'shared/getComponentName'; @@ -246,8 +248,14 @@ export { injectIntoDevTools({ findFiberByHostInstance: getClosestInstanceFromNode, - getInspectorDataForViewTag: getInspectorDataForViewTag, bundleType: __DEV__ ? 1 : 0, version: ReactVersion, rendererPackageName: 'react-native-renderer', + rendererConfig: { + getInspectorDataForViewTag: getInspectorDataForViewTag, + getInspectorDataForViewAtPoint: getInspectorDataForViewAtPoint.bind( + null, + findNodeHandle, + ), + }, }); diff --git a/packages/react-native-renderer/src/ReactNativeTypes.js b/packages/react-native-renderer/src/ReactNativeTypes.js index 4c2df9a44fe0..d36378f4d1eb 100644 --- a/packages/react-native-renderer/src/ReactNativeTypes.js +++ b/packages/react-native-renderer/src/ReactNativeTypes.js @@ -100,6 +100,46 @@ type SecretInternalsType = { ... }; +type InspectorDataProps = $ReadOnly<{ + [propName: string]: string, + ..., +}>; + +type InspectorDataSource = $ReadOnly<{| + fileName?: string, + lineNumber?: number, +|}>; + +type InspectorDataGetter = ( + (componentOrHandle: any) => ?number, +) => $ReadOnly<{| + measure: Function, + props: InspectorDataProps, + source: InspectorDataSource, +|}>; + +export type InspectorData = $ReadOnly<{| + hierarchy: Array<{| + name: ?string, + getInspectorData: InspectorDataGetter, + |}>, + selection: ?number, + props: InspectorDataProps, + source: ?InspectorDataSource, +|}>; + +export type TouchedViewDataAtPoint = $ReadOnly<{| + pointerY: number, + touchedViewTag?: number, + frame: $ReadOnly<{| + top: number, + left: number, + width: number, + height: number, + |}>, + ...InspectorData, +|}>; + /** * Flat ReactNative renderer bundles are too big for Flow to parse efficiently. * Provide minimal Flow typing for the high-level RN API and call it a day. diff --git a/packages/react-reconciler/src/ReactFiberReconciler.old.js b/packages/react-reconciler/src/ReactFiberReconciler.old.js index 8ad745990197..59de48759186 100644 --- a/packages/react-reconciler/src/ReactFiberReconciler.old.js +++ b/packages/react-reconciler/src/ReactFiberReconciler.old.js @@ -16,6 +16,7 @@ import type { Container, PublicInstance, } from './ReactFiberHostConfig'; +import type {RendererInspectionConfig} from './ReactFiberHostConfig'; import {FundamentalComponent} from './ReactWorkTags'; import type {ReactNodeList} from 'shared/ReactTypes'; import type {ExpirationTime} from './ReactFiberExpirationTime'; @@ -107,10 +108,7 @@ type DevToolsConfig = {| // Note: this actually *does* depend on Fiber internal fields. // Used by "inspect clicked DOM element" in React DevTools. findFiberByHostInstance?: (instance: Instance | TextInstance) => Fiber | null, - // Used by RN in-app inspector. - // This API is unfortunately RN-specific. - // TODO: Change it to accept Fiber instead and type it properly. - getInspectorDataForViewTag?: (tag: number) => Object, + rendererConfig?: RendererInspectionConfig, |}; let didWarnAboutNestedUpdates; @@ -516,7 +514,7 @@ export function injectIntoDevTools(devToolsConfig: DevToolsConfig): boolean { bundleType: devToolsConfig.bundleType, version: devToolsConfig.version, rendererPackageName: devToolsConfig.rendererPackageName, - getInspectorDataForViewTag: devToolsConfig.getInspectorDataForViewTag, + rendererConfig: devToolsConfig.rendererConfig, overrideHookState, overrideProps, setSuspenseHandler, diff --git a/packages/react-reconciler/src/forks/ReactFiberHostConfig.custom.js b/packages/react-reconciler/src/forks/ReactFiberHostConfig.custom.js index 9649c1aacdad..dc4517013450 100644 --- a/packages/react-reconciler/src/forks/ReactFiberHostConfig.custom.js +++ b/packages/react-reconciler/src/forks/ReactFiberHostConfig.custom.js @@ -37,6 +37,7 @@ export opaque type UpdatePayload = mixed; // eslint-disable-line no-undef export opaque type ChildSet = mixed; // eslint-disable-line no-undef export opaque type TimeoutHandle = mixed; // eslint-disable-line no-undef export opaque type NoTimeout = mixed; // eslint-disable-line no-undef +export opaque type RendererInspectionConfig = mixed; // eslint-disable-line no-undef export type EventResponder = any; export type ReactListenerEvent = Object; export type ReactListenerMap = Object; diff --git a/packages/react-test-renderer/src/ReactTestHostConfig.js b/packages/react-test-renderer/src/ReactTestHostConfig.js index 315fc8067141..f4f66a3cd1c0 100644 --- a/packages/react-test-renderer/src/ReactTestHostConfig.js +++ b/packages/react-test-renderer/src/ReactTestHostConfig.js @@ -48,6 +48,7 @@ export type EventResponder = any; export type ReactListenerEvent = Object; export type ReactListenerMap = Object; export type ReactListener = Object; +export type RendererInspectionConfig = $ReadOnly<{||}>; export * from 'react-reconciler/src/ReactFiberHostConfigWithNoPersistence'; export * from 'react-reconciler/src/ReactFiberHostConfigWithNoHydration'; diff --git a/scripts/error-codes/codes.json b/scripts/error-codes/codes.json index 0a995b22b45a..1c52e571caae 100644 --- a/scripts/error-codes/codes.json +++ b/scripts/error-codes/codes.json @@ -351,5 +351,6 @@ "350": "Cannot read from mutable source during the current render without tearing. This is a bug in React. Please file an issue.", "351": "Unsupported type.", "352": "React Blocks (and Lazy Components) are expected to be replaced by a compiler on the server. Try configuring your compiler set up and avoid using React.lazy inside of Blocks.", - "353": "A server block should never encode any other slots. This is a bug in React." + "353": "A server block should never encode any other slots. This is a bug in React.", + "354": "getInspectorDataForViewAtPoint() is not available in production." } diff --git a/scripts/flow/react-native-host-hooks.js b/scripts/flow/react-native-host-hooks.js index 85ea68f160ce..151e36e4c47f 100644 --- a/scripts/flow/react-native-host-hooks.js +++ b/scripts/flow/react-native-host-hooks.js @@ -18,6 +18,7 @@ import type { } from 'react-native-renderer/src/ReactNativeTypes'; import type {RNTopLevelEventType} from 'legacy-events/TopLevelEventTypes'; import type {CapturedError} from 'react-reconciler/src/ReactCapturedValue'; +import type {Fiber} from 'react-reconciler/src/ReactFiber'; type DeepDifferOptions = {|+unsafelyIgnoreFunctions?: boolean|}; @@ -96,6 +97,17 @@ declare module 'react-native/Libraries/ReactPrivate/ReactNativePrivateInterface' ) => Promise, setJSResponder: (reactTag: number, blockNativeResponder: boolean) => void, clearJSResponder: () => void, + findSubviewIn: ( + reactTag: ?number, + point: Array, + callback: ( + nativeViewTag: number, + left: number, + top: number, + width: number, + height: number, + ) => void, + ) => void, ... }; declare export var BatchedBridge: { @@ -156,6 +168,12 @@ declare var nativeFabricUIManager: { onFail: () => void, onSuccess: MeasureLayoutOnSuccessCallback, ) => void, + findNodeAtPoint: ( + node: Node, + locationX: number, + locationY: number, + callback: (Fiber) => void, + ) => void, ... }; From 70c6e0c8bdd5d53b10d3c4167828f86ad07c8503 Mon Sep 17 00:00:00 2001 From: Rick Hanlon Date: Mon, 30 Mar 2020 13:34:24 -0400 Subject: [PATCH 2/4] Updates from review --- .../src/ReactNativeFiberHostComponent.js | 4 ++- .../src/ReactNativeFiberInspector.js | 25 ++++++------------- .../src/ReactNativeTypes.js | 2 +- 3 files changed, 12 insertions(+), 19 deletions(-) diff --git a/packages/react-native-renderer/src/ReactNativeFiberHostComponent.js b/packages/react-native-renderer/src/ReactNativeFiberHostComponent.js index fd83f5e887c9..55569e3b8dda 100644 --- a/packages/react-native-renderer/src/ReactNativeFiberHostComponent.js +++ b/packages/react-native-renderer/src/ReactNativeFiberHostComponent.js @@ -44,7 +44,9 @@ class ReactNativeFiberHostComponent { this._nativeTag = tag; this._children = []; this.viewConfig = viewConfig; - this._internalFiberInstanceHandle = internalInstanceHandle; + if (__DEV__) { + this._internalFiberInstanceHandle = internalInstanceHandle; + } } blur() { diff --git a/packages/react-native-renderer/src/ReactNativeFiberInspector.js b/packages/react-native-renderer/src/ReactNativeFiberInspector.js index f94654ff0bba..c912a09d855c 100644 --- a/packages/react-native-renderer/src/ReactNativeFiberInspector.js +++ b/packages/react-native-renderer/src/ReactNativeFiberInspector.js @@ -95,16 +95,7 @@ if (__DEV__) { hostFiber.stateNode.node; if (shadowNode) { - nativeFabricUIManager.measure(shadowNode, function( - x, - y, - width, - height, - pageX, - pageY, - ) { - callback(x, y, width, height, pageX, pageY); - }); + nativeFabricUIManager.measure(shadowNode, callback); } else { return UIManager.measure( getHostNode(fiber, findNodeHandle), @@ -123,7 +114,7 @@ if (__DEV__) { return { hierarchy: [], props: emptyObject, - selection: null, + selectedIndex: null, source: null, }; } @@ -134,12 +125,12 @@ if (__DEV__) { const hierarchy = createHierarchy(fiberHierarchy); const props = getHostProps(instance); const source = instance._debugSource; - const selection = fiberHierarchy.indexOf(instance); + const selectedIndex = fiberHierarchy.indexOf(instance); return { hierarchy, props, - selection, + selectedIndex, source, }; }; @@ -152,7 +143,7 @@ if (__DEV__) { return { hierarchy: [], props: emptyObject, - selection: null, + selectedIndex: null, source: null, }; } @@ -163,12 +154,12 @@ if (__DEV__) { const hierarchy = createHierarchy(fiberHierarchy); const props = getHostProps(instance); const source = instance._debugSource; - const selection = fiberHierarchy.indexOf(instance); + const selectedIndex = fiberHierarchy.indexOf(instance); return { hierarchy, props, - selection, + selectedIndex, source, }; }; @@ -228,7 +219,7 @@ if (__DEV__) { }); }, ); - } else if (__DEV__) { + } else { console.error( 'getInspectorDataForViewAtPoint expects to receieve a host component', ); diff --git a/packages/react-native-renderer/src/ReactNativeTypes.js b/packages/react-native-renderer/src/ReactNativeTypes.js index d36378f4d1eb..10244570b653 100644 --- a/packages/react-native-renderer/src/ReactNativeTypes.js +++ b/packages/react-native-renderer/src/ReactNativeTypes.js @@ -123,7 +123,7 @@ export type InspectorData = $ReadOnly<{| name: ?string, getInspectorData: InspectorDataGetter, |}>, - selection: ?number, + selectedIndex: ?number, props: InspectorDataProps, source: ?InspectorDataSource, |}>; From 82451a2878f23f29e9978eece60f5e7aceaf9c90 Mon Sep 17 00:00:00 2001 From: Rick Hanlon Date: Mon, 30 Mar 2020 14:19:24 -0400 Subject: [PATCH 3/4] Add DEV to dev-only variable --- packages/react-native-renderer/src/ReactNativeFiberInspector.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-native-renderer/src/ReactNativeFiberInspector.js b/packages/react-native-renderer/src/ReactNativeFiberInspector.js index c912a09d855c..5587cb4cae48 100644 --- a/packages/react-native-renderer/src/ReactNativeFiberInspector.js +++ b/packages/react-native-renderer/src/ReactNativeFiberInspector.js @@ -202,7 +202,7 @@ if (__DEV__) { ); }, ); - } else if (inspectedView._internalFiberInstanceHandle != null) { + } else if (inspectedView._internalFiberInstanceHandleDEV != null) { // For Paper we fall back to the old strategy using the React tag. UIManager.findSubviewIn( findNodeHandle(inspectedView), From f52c6e1fa5b80130660a3ad287c5a4ef3e6ea6f2 Mon Sep 17 00:00:00 2001 From: Rick Hanlon Date: Mon, 30 Mar 2020 15:07:04 -0400 Subject: [PATCH 4/4] Missed this rename --- .../src/ReactNativeFiberHostComponent.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/react-native-renderer/src/ReactNativeFiberHostComponent.js b/packages/react-native-renderer/src/ReactNativeFiberHostComponent.js index 55569e3b8dda..d2a29d48e17c 100644 --- a/packages/react-native-renderer/src/ReactNativeFiberHostComponent.js +++ b/packages/react-native-renderer/src/ReactNativeFiberHostComponent.js @@ -33,19 +33,19 @@ import { class ReactNativeFiberHostComponent { _children: Array; _nativeTag: number; - _internalFiberInstanceHandle: Object; + _internalFiberInstanceHandleDEV: Object; viewConfig: ReactNativeBaseComponentViewConfig<>; constructor( tag: number, viewConfig: ReactNativeBaseComponentViewConfig<>, - internalInstanceHandle: Object, + internalInstanceHandleDEV: Object, ) { this._nativeTag = tag; this._children = []; this.viewConfig = viewConfig; if (__DEV__) { - this._internalFiberInstanceHandle = internalInstanceHandle; + this._internalFiberInstanceHandleDEV = internalInstanceHandleDEV; } }