diff --git a/packages/react-native-renderer/src/ReactFabric.js b/packages/react-native-renderer/src/ReactFabric.js index cdfb3f10bb77a..8b78bdc8296c6 100644 --- a/packages/react-native-renderer/src/ReactFabric.js +++ b/packages/react-native-renderer/src/ReactFabric.js @@ -90,15 +90,6 @@ function findHostInstance_DEPRECATED( hostInstance = findHostInstance(componentOrHandle); } - if (hostInstance == null) { - return hostInstance; - } - if ((hostInstance: any).canonical) { - // Fabric - return (hostInstance: any).canonical; - } - // $FlowFixMe[incompatible-return] - // $FlowFixMe[incompatible-exact] return hostInstance; } @@ -146,12 +137,7 @@ function findNodeHandle(componentOrHandle: any): ?number { if (hostInstance == null) { return hostInstance; } - // TODO: the code is right but the types here are wrong. - // https://github.com/facebook/react/pull/12863 - if ((hostInstance: any).canonical) { - // Fabric - return (hostInstance: any).canonical._nativeTag; - } + return hostInstance._nativeTag; } diff --git a/packages/react-native-renderer/src/ReactFabricHostConfig.js b/packages/react-native-renderer/src/ReactFabricHostConfig.js index f80d57623b7f7..30982a7ad0ee0 100644 --- a/packages/react-native-renderer/src/ReactFabricHostConfig.js +++ b/packages/react-native-renderer/src/ReactFabricHostConfig.js @@ -110,7 +110,7 @@ if (registerEventHandler) { /** * This is used for refs on host components. */ -class ReactFabricHostComponent { +class ReactFabricHostComponent implements NativeMethods { _nativeTag: number; viewConfig: ViewConfig; currentProps: Props; @@ -215,10 +215,6 @@ class ReactFabricHostComponent { } } -// $FlowFixMe[class-object-subtyping] found when upgrading Flow -// $FlowFixMe[method-unbinding] found when upgrading Flow -(ReactFabricHostComponent.prototype: $ReadOnly<{...NativeMethods, ...}>); - export * from 'react-reconciler/src/ReactFiberHostConfigWithNoMutation'; export * from 'react-reconciler/src/ReactFiberHostConfigWithNoHydration'; export * from 'react-reconciler/src/ReactFiberHostConfigWithNoScopes'; @@ -342,8 +338,17 @@ export function getChildHostContext( } } -export function getPublicInstance(instance: Instance): * { - return instance.canonical; +export function getPublicInstance(instance: Instance): null | PublicInstance { + if (instance.canonical) { + return instance.canonical; + } + + // For compatibility with Paper + if (instance._nativeTag != null) { + return instance; + } + + return null; } export function prepareForCommit(containerInfo: Container): null | Object { diff --git a/packages/react-native-renderer/src/ReactNativeFiberHostComponent.js b/packages/react-native-renderer/src/ReactNativeFiberHostComponent.js index a4fcc0cef77e7..daf9f6774751a 100644 --- a/packages/react-native-renderer/src/ReactNativeFiberHostComponent.js +++ b/packages/react-native-renderer/src/ReactNativeFiberHostComponent.js @@ -30,7 +30,7 @@ import { warnForStyleProps, } from './NativeMethodsMixinUtils'; -class ReactNativeFiberHostComponent { +class ReactNativeFiberHostComponent implements NativeMethods { _children: Array; _nativeTag: number; _internalFiberInstanceHandleDEV: Object; @@ -127,8 +127,4 @@ class ReactNativeFiberHostComponent { } } -// $FlowFixMe[class-object-subtyping] found when upgrading Flow -// $FlowFixMe[method-unbinding] found when upgrading Flow -(ReactNativeFiberHostComponent.prototype: $ReadOnly<{...NativeMethods, ...}>); - export default ReactNativeFiberHostComponent; diff --git a/packages/react-native-renderer/src/ReactNativeHostConfig.js b/packages/react-native-renderer/src/ReactNativeHostConfig.js index 03cfa415f6937..a3b58315205f3 100644 --- a/packages/react-native-renderer/src/ReactNativeHostConfig.js +++ b/packages/react-native-renderer/src/ReactNativeHostConfig.js @@ -217,6 +217,11 @@ export function getChildHostContext( } export function getPublicInstance(instance: Instance): * { + // $FlowExpectedError[prop-missing] For compatibility with Fabric + if (instance.canonical) { + return instance.canonical; + } + return instance; } diff --git a/packages/react-native-renderer/src/ReactNativeRenderer.js b/packages/react-native-renderer/src/ReactNativeRenderer.js index 8083d004bc941..6b75be5d07d97 100644 --- a/packages/react-native-renderer/src/ReactNativeRenderer.js +++ b/packages/react-native-renderer/src/ReactNativeRenderer.js @@ -89,15 +89,6 @@ function findHostInstance_DEPRECATED( hostInstance = findHostInstance(componentOrHandle); } - if (hostInstance == null) { - return hostInstance; - } - if ((hostInstance: any).canonical) { - // Fabric - return (hostInstance: any).canonical; - } - // $FlowFixMe[incompatible-return] - // $FlowFixMe[incompatible-exact] return hostInstance; } @@ -145,10 +136,7 @@ function findNodeHandle(componentOrHandle: any): ?number { if (hostInstance == null) { return hostInstance; } - if ((hostInstance: any).canonical) { - // Fabric - return (hostInstance: any).canonical._nativeTag; - } + return hostInstance._nativeTag; } diff --git a/packages/react-native-renderer/src/ReactNativeTypes.js b/packages/react-native-renderer/src/ReactNativeTypes.js index ddbd330cc4838..a6dc47b066155 100644 --- a/packages/react-native-renderer/src/ReactNativeTypes.js +++ b/packages/react-native-renderer/src/ReactNativeTypes.js @@ -95,18 +95,18 @@ export type PartialViewConfig = $ReadOnly<{ validAttributes?: PartialAttributeConfiguration, }>; -export type NativeMethods = $ReadOnly<{ - blur(): void, - focus(): void, - measure(callback: MeasureOnSuccessCallback): void, - measureInWindow(callback: MeasureInWindowOnSuccessCallback): void, +export interface NativeMethods { + blur(): void; + focus(): void; + measure(callback: MeasureOnSuccessCallback): void; + measureInWindow(callback: MeasureInWindowOnSuccessCallback): void; measureLayout( relativeToNativeNode: number | ElementRef>, onSuccess: MeasureLayoutOnSuccessCallback, onFail?: () => void, - ): void, - setNativeProps(nativeProps: {...}): void, -}>; + ): void; + setNativeProps(nativeProps: {...}): void; +} export type HostComponent = AbstractComponent>; diff --git a/packages/react-reconciler/src/ReactFiberReconciler.js b/packages/react-reconciler/src/ReactFiberReconciler.js index adf3316fa49ad..4842de3bc1ec4 100644 --- a/packages/react-reconciler/src/ReactFiberReconciler.js +++ b/packages/react-reconciler/src/ReactFiberReconciler.js @@ -175,7 +175,7 @@ function findHostInstance(component: Object): PublicInstance | null { if (hostFiber === null) { return null; } - return hostFiber.stateNode; + return getPublicInstance(hostFiber.stateNode); } function findHostInstanceWithWarning( @@ -240,7 +240,7 @@ function findHostInstanceWithWarning( } } } - return hostFiber.stateNode; + return getPublicInstance(hostFiber.stateNode); } return findHostInstance(component); } @@ -524,7 +524,7 @@ export function findHostInstanceWithNoPortals( if (hostFiber === null) { return null; } - return hostFiber.stateNode; + return getPublicInstance(hostFiber.stateNode); } let shouldErrorImpl: Fiber => ?boolean = fiber => null;