-
Notifications
You must be signed in to change notification settings - Fork 24.3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Bring ReactFabricHostComponent back to react-native (#36570)
Summary: Pull Request resolved: #36570 I'm doing some preparations to implement this proposal to bring some DOM APIs to React Native refs: react-native-community/discussions-and-proposals#607 To make it easier to iterate on the proposal, and to improve the separation of concerns between React and React Native, I'm moving the definition of `ReactFabricHostComponent` (the public instance provided by React when using refs on host conmponents) to the `react-native` package. I already did some steps in the React repository to simplify this: * Removing unused imperative events that caused increased coupling: facebook/react#26282 * Extracting the definition of the public instance to a separate module: facebook/react#26291 In this case, in order to be able to move the definition from React to React Native, we need to: 1. Create the definition in React Native and export it through `ReactNativePrivateInterface`. 2. Update React to use that definition instead of the one in its own module. This diff implements the first step. `ReactNativeAttributePayload` is required by this definition and by the one for Paper that still exists in React. I moved it here so we only define it where we use it when we remove Paper. Paper will access it through `ReactNativePrivateInterface` as well. That will also allow us to remove a few other fields in that interface. Changelog: [Internal] bypass-github-export-checks Reviewed By: yungsters Differential Revision: D43772356 fbshipit-source-id: 78dac152f415f19316ec90887127bf9861fe3110
- Loading branch information
1 parent
64ea075
commit ee76107
Showing
7 changed files
with
1,127 additions
and
8 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
139 changes: 139 additions & 0 deletions
139
packages/react-native/Libraries/ReactNative/__mocks__/FabricUIManager.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,139 @@ | ||
| /** | ||
| * Copyright (c) Meta Platforms, Inc. and affiliates. | ||
| * | ||
| * This source code is licensed under the MIT license found in the | ||
| * LICENSE file in the root directory of this source tree. | ||
| * | ||
| * @flow strict-local | ||
| * @format | ||
| * @oncall react_native | ||
| */ | ||
|
|
||
| import type { | ||
| LayoutAnimationConfig, | ||
| MeasureInWindowOnSuccessCallback, | ||
| MeasureLayoutOnSuccessCallback, | ||
| MeasureOnSuccessCallback, | ||
| Node, | ||
| } from '../../Renderer/shims/ReactNativeTypes'; | ||
| import type {RootTag} from '../../Types/RootTagTypes'; | ||
| import type { | ||
| InstanceHandle, | ||
| NodeProps, | ||
| NodeSet, | ||
| Spec as FabricUIManager, | ||
| } from '../FabricUIManager'; | ||
|
|
||
| type NodeMock = { | ||
| reactTag: number, | ||
| rootTag: RootTag, | ||
| props: NodeProps, | ||
| instanceHandle: InstanceHandle, | ||
| children: NodeSet, | ||
| }; | ||
|
|
||
| function fromNode(node: Node): NodeMock { | ||
| // $FlowExpectedError[incompatible-return] | ||
| return node; | ||
| } | ||
|
|
||
| function toNode(node: NodeMock): Node { | ||
| // $FlowExpectedError[incompatible-return] | ||
| return node; | ||
| } | ||
|
|
||
| const FabricUIManagerMock: FabricUIManager = { | ||
| createNode: jest.fn( | ||
| ( | ||
| reactTag: number, | ||
| viewName: string, | ||
| rootTag: RootTag, | ||
| props: NodeProps, | ||
| instanceHandle: InstanceHandle, | ||
| ): Node => { | ||
| return toNode({ | ||
| reactTag, | ||
| rootTag, | ||
| props, | ||
| instanceHandle, | ||
| children: [], | ||
| }); | ||
| }, | ||
| ), | ||
| cloneNode: jest.fn((node: Node): Node => { | ||
| return toNode({...fromNode(node)}); | ||
| }), | ||
| cloneNodeWithNewChildren: jest.fn((node: Node): Node => { | ||
| return toNode({...fromNode(node), children: []}); | ||
| }), | ||
| cloneNodeWithNewProps: jest.fn((node: Node, newProps: NodeProps): Node => { | ||
| return toNode({...fromNode(node), props: newProps}); | ||
| }), | ||
| cloneNodeWithNewChildrenAndProps: jest.fn( | ||
| (node: Node, newProps: NodeProps): Node => { | ||
| return toNode({...fromNode(node), children: [], props: newProps}); | ||
| }, | ||
| ), | ||
| createChildSet: jest.fn((rootTag: RootTag): NodeSet => { | ||
| return []; | ||
| }), | ||
| appendChild: jest.fn((parentNode: Node, child: Node): Node => { | ||
| return toNode({ | ||
| ...fromNode(parentNode), | ||
| children: fromNode(parentNode).children.concat(child), | ||
| }); | ||
| }), | ||
| appendChildToSet: jest.fn((childSet: NodeSet, child: Node): void => { | ||
| childSet.push(child); | ||
| }), | ||
| completeRoot: jest.fn((rootTag: RootTag, childSet: NodeSet): void => {}), | ||
| measure: jest.fn((node: Node, callback: MeasureOnSuccessCallback): void => { | ||
| callback(10, 10, 100, 100, 0, 0); | ||
| }), | ||
| measureInWindow: jest.fn( | ||
| (node: Node, callback: MeasureInWindowOnSuccessCallback): void => { | ||
| callback(10, 10, 100, 100); | ||
| }, | ||
| ), | ||
| measureLayout: jest.fn( | ||
| ( | ||
| node: Node, | ||
| relativeNode: Node, | ||
| onFail: () => void, | ||
| onSuccess: MeasureLayoutOnSuccessCallback, | ||
| ): void => { | ||
| onSuccess(1, 1, 100, 100); | ||
| }, | ||
| ), | ||
| configureNextLayoutAnimation: jest.fn( | ||
| ( | ||
| config: LayoutAnimationConfig, | ||
| callback: () => void, // check what is returned here | ||
| errorCallback: () => void, | ||
| ): void => {}, | ||
| ), | ||
| sendAccessibilityEvent: jest.fn((node: Node, eventType: string): void => {}), | ||
| findShadowNodeByTag_DEPRECATED: jest.fn((reactTag: number): ?Node => {}), | ||
| getBoundingClientRect: jest.fn( | ||
| ( | ||
| node: Node, | ||
| ): [ | ||
| /* x:*/ number, | ||
| /* y:*/ number, | ||
| /* width:*/ number, | ||
| /* height:*/ number, | ||
| ] => { | ||
| return [1, 1, 100, 100]; | ||
| }, | ||
| ), | ||
| setNativeProps: jest.fn((node: Node, newProps: NodeProps): void => {}), | ||
| dispatchCommand: jest.fn( | ||
| (node: Node, commandName: string, args: Array<mixed>): void => {}, | ||
| ), | ||
| }; | ||
|
|
||
| global.nativeFabricUIManager = FabricUIManagerMock; | ||
|
|
||
| export function getFabricUIManager(): ?FabricUIManager { | ||
| return FabricUIManagerMock; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.