Pass instance handle to all Fabric clone methods (facebook#12824)

We might need this in the future if we want to ensure event handler consistency when an event handler target has been removed before it is called.
skumaresan · May 15, 2018 · f792275 · f792275
1 parent a5184b2
commit f792275
Show file tree

Hide file tree

Showing 4 changed files with 51 additions and 19 deletions.
diff --git a/packages/react-native-renderer/src/ReactFabricHostConfig.js b/packages/react-native-renderer/src/ReactFabricHostConfig.js
@@ -25,7 +25,17 @@ import invariant from 'fbjs/lib/invariant';
 
 // Modules provided by RN:
 import TextInputState from 'TextInputState';
-import FabricUIManager from 'FabricUIManager';
+import {
+  createNode,
+  cloneNode,
+  cloneNodeWithNewChildren,
+  cloneNodeWithNewChildrenAndProps,
+  cloneNodeWithNewProps,
+  createChildSet,
+  appendChild,
+  appendChildToSet,
+  completeRoot,
+} from 'FabricUIManager';
 import UIManager from 'UIManager';
 
 // Counter for uniquely identifying views.
@@ -126,12 +136,12 @@ type TextInstance = {
   node: Node,
 };
 
-const ReacFabricHostConfig = {
+const ReactFabricHostConfig = {
   appendInitialChild(
     parentInstance: Instance,
     child: Instance | TextInstance,
   ): void {
-    FabricUIManager.appendChild(parentInstance.node, child.node);
+    appendChild(parentInstance.node, child.node);
   },
 
   createInstance(
@@ -164,7 +174,7 @@ const ReacFabricHostConfig = {
       viewConfig.validAttributes,
     );
 
-    const node = FabricUIManager.createNode(
+    const node = createNode(
       tag, // reactTag
       viewConfig.uiViewClassName, // viewName
       rootContainerInstance, // rootTag
@@ -194,7 +204,7 @@ const ReacFabricHostConfig = {
     const tag = nextReactTag;
     nextReactTag += 2;
 
-    const node = FabricUIManager.createNode(
+    const node = createNode(
       tag, // reactTag
       'RCTRawText', // viewName
       rootContainerInstance, // rootTag
@@ -307,18 +317,23 @@ const ReacFabricHostConfig = {
       let clone;
       if (keepChildren) {
         if (updatePayload !== null) {
-          clone = FabricUIManager.cloneNodeWithNewProps(node, updatePayload);
+          clone = cloneNodeWithNewProps(
+            node,
+            updatePayload,
+            internalInstanceHandle,
+          );
         } else {
-          clone = FabricUIManager.cloneNode(node);
+          clone = cloneNode(node, internalInstanceHandle);
         }
       } else {
         if (updatePayload !== null) {
-          clone = FabricUIManager.cloneNodeWithNewChildrenAndProps(
+          clone = cloneNodeWithNewChildrenAndProps(
             node,
             updatePayload,
+            internalInstanceHandle,
           );
         } else {
-          clone = FabricUIManager.cloneNodeWithNewChildren(node);
+          clone = cloneNodeWithNewChildren(node, internalInstanceHandle);
         }
       }
       return {
@@ -328,21 +343,21 @@ const ReacFabricHostConfig = {
     },
 
     createContainerChildSet(container: Container): ChildSet {
-      return FabricUIManager.createChildSet(container);
+      return createChildSet(container);
     },
 
     appendChildToContainerChildSet(
       childSet: ChildSet,
       child: Instance | TextInstance,
     ): void {
-      FabricUIManager.appendChildToSet(childSet, child.node);
+      appendChildToSet(childSet, child.node);
     },
 
     finalizeContainerChildren(
       container: Container,
       newChildren: ChildSet,
     ): void {
-      FabricUIManager.completeRoot(container, newChildren);
+      completeRoot(container, newChildren);
     },
 
     replaceContainerChildren(
@@ -352,4 +367,4 @@ const ReacFabricHostConfig = {
   },
 };
 
-export default ReacFabricHostConfig;
+export default ReactFabricHostConfig;
diff --git a/packages/react-native-renderer/src/__mocks__/FabricUIManager.js b/packages/react-native-renderer/src/__mocks__/FabricUIManager.js
@@ -65,15 +65,18 @@ const RCTFabricUIManager = {
       children: [],
     };
   }),
-  cloneNode: jest.fn(function cloneNode(node) {
+  cloneNode: jest.fn(function cloneNode(node, instanceHandle) {
     return {
       reactTag: node.reactTag,
       viewName: node.viewName,
       props: node.props,
       children: node.children,
     };
   }),
-  cloneNodeWithNewChildren: jest.fn(function cloneNodeWithNewChildren(node) {
+  cloneNodeWithNewChildren: jest.fn(function cloneNodeWithNewChildren(
+    node,
+    instanceHandle,
+  ) {
     return {
       reactTag: node.reactTag,
       viewName: node.viewName,
@@ -84,6 +87,7 @@ const RCTFabricUIManager = {
   cloneNodeWithNewProps: jest.fn(function cloneNodeWithNewProps(
     node,
     newPropsDiff,
+    instanceHandle,
   ) {
     return {
       reactTag: node.reactTag,
@@ -93,7 +97,11 @@ const RCTFabricUIManager = {
     };
   }),
   cloneNodeWithNewChildrenAndProps: jest.fn(
-    function cloneNodeWithNewChildrenAndProps(node, newPropsDiff) {
+    function cloneNodeWithNewChildrenAndProps(
+      node,
+      newPropsDiff,
+      instanceHandle,
+    ) {
       return {
         reactTag: node.reactTag,
         viewName: node.viewName,

diff --git a/packages/react-native-renderer/src/__tests__/ReactFabric-test.internal.js b/packages/react-native-renderer/src/__tests__/ReactFabric-test.internal.js
@@ -61,7 +61,11 @@ describe('ReactFabric', () => {
     ReactFabric.render(<View foo="bar" />, 11);
 
     expect(FabricUIManager.createNode.mock.calls.length).toBe(1);
-    expect(FabricUIManager.cloneNodeWithNewProps).toBeCalledWith(firstNode, {
+    expect(FabricUIManager.cloneNodeWithNewProps.mock.calls.length).toBe(1);
+    expect(FabricUIManager.cloneNodeWithNewProps.mock.calls[0][0]).toBe(
+      firstNode,
+    );
+    expect(FabricUIManager.cloneNodeWithNewProps.mock.calls[0][1]).toEqual({
       foo: 'bar',
     });
   });

diff --git a/scripts/flow/react-native-host-hooks.js b/scripts/flow/react-native-host-hooks.js
@@ -101,15 +101,20 @@ declare module 'FabricUIManager' {
     props: ?Object,
     instanceHandle: Object,
   ): Object;
-  declare function cloneNode(node: Object): Object;
-  declare function cloneNodeWithNewChildren(node: Object): Object;
+  declare function cloneNode(node: Object, instanceHandle: Object): Object;
+  declare function cloneNodeWithNewChildren(
+    node: Object,
+    instanceHandle: Object,
+  ): Object;
   declare function cloneNodeWithNewProps(
     node: Object,
     newProps: ?Object,
+    instanceHandle: Object,
   ): Object;
   declare function cloneNodeWithNewChildrenAndProps(
     node: Object,
     newProps: ?Object,
+    instanceHandle: Object,
   ): Object;
   declare function appendChild(node: Object, childNode: Object): void;