Pass instance handle to all Fabric clone methods (#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.
Sebastian Markbåge committed
May 15, 2018 at 14:35 UTC
f79227597202336b5a6e62642dc42646d9639cee
4 files changed
+51
-19
packages/react-native-renderer/src/ReactFabricHostConfig.js
+28
-13
@@ -25,7 +25,17 @@ import invariant from 'fbjs/lib/invariant';
25
26
// Modules provided by RN:
27
import TextInputState from 'TextInputState';
28
-import FabricUIManager from 'FabricUIManager';
28
+import {
29
+ createNode,
30
+ cloneNode,
31
+ cloneNodeWithNewChildren,
32
+ cloneNodeWithNewChildrenAndProps,
33
+ cloneNodeWithNewProps,
34
+ createChildSet,
35
+ appendChild,
36
+ appendChildToSet,
37
+ completeRoot,
38
+} from 'FabricUIManager';
39
import UIManager from 'UIManager';
40
41
// Counter for uniquely identifying views.
@@ -126,12 +136,12 @@ type TextInstance = {
136
node: Node,
137
};
138
129
-const ReacFabricHostConfig = {
139
+const ReactFabricHostConfig = {
140
appendInitialChild(
141
parentInstance: Instance,
142
child: Instance | TextInstance,
143
): void {
134
- FabricUIManager.appendChild(parentInstance.node, child.node);
144
+ appendChild(parentInstance.node, child.node);
145
},
146
147
createInstance(
@@ -164,7 +174,7 @@ const ReacFabricHostConfig = {
174
viewConfig.validAttributes,
175
);
176
167
- const node = FabricUIManager.createNode(
177
+ const node = createNode(
178
tag, // reactTag
179
viewConfig.uiViewClassName, // viewName
180
rootContainerInstance, // rootTag
@@ -194,7 +204,7 @@ const ReacFabricHostConfig = {
204
const tag = nextReactTag;
205
nextReactTag += 2;
206
197
- const node = FabricUIManager.createNode(
207
+ const node = createNode(
208
tag, // reactTag
209
'RCTRawText', // viewName
210
rootContainerInstance, // rootTag
@@ -307,18 +317,23 @@ const ReacFabricHostConfig = {
317
let clone;
318
if (keepChildren) {
319
if (updatePayload !== null) {
310
- clone = FabricUIManager.cloneNodeWithNewProps(node, updatePayload);
320
+ clone = cloneNodeWithNewProps(
321
+ node,
322
+ updatePayload,
323
+ internalInstanceHandle,
324
+ );
325
} else {
312
- clone = FabricUIManager.cloneNode(node);
326
+ clone = cloneNode(node, internalInstanceHandle);
327
}
328
} else {
329
if (updatePayload !== null) {
316
- clone = FabricUIManager.cloneNodeWithNewChildrenAndProps(
330
+ clone = cloneNodeWithNewChildrenAndProps(
331
node,
332
updatePayload,
333
+ internalInstanceHandle,
334
);
335
} else {
321
- clone = FabricUIManager.cloneNodeWithNewChildren(node);
336
+ clone = cloneNodeWithNewChildren(node, internalInstanceHandle);
337
}
338
}
339
return {
@@ -328,21 +343,21 @@ const ReacFabricHostConfig = {
343
},
344
345
createContainerChildSet(container: Container): ChildSet {
331
- return FabricUIManager.createChildSet(container);
346
+ return createChildSet(container);
347
},
348
349
appendChildToContainerChildSet(
350
childSet: ChildSet,
351
child: Instance | TextInstance,
352
): void {
338
- FabricUIManager.appendChildToSet(childSet, child.node);
353
+ appendChildToSet(childSet, child.node);
354
},
355
356
finalizeContainerChildren(
357
container: Container,
358
newChildren: ChildSet,
359
): void {
345
- FabricUIManager.completeRoot(container, newChildren);
360
+ completeRoot(container, newChildren);
361
},
362
363
replaceContainerChildren(
@@ -352,4 +367,4 @@ const ReacFabricHostConfig = {
367
},
368
};
369
355
-export default ReacFabricHostConfig;
370
+export default ReactFabricHostConfig;
packages/react-native-renderer/src/__mocks__/FabricUIManager.js
+11
-3
@@ -65,7 +65,7 @@ const RCTFabricUIManager = {
65
children: [],
66
};
67
}),
68
- cloneNode: jest.fn(function cloneNode(node) {
68
+ cloneNode: jest.fn(function cloneNode(node, instanceHandle) {
69
return {
70
reactTag: node.reactTag,
71
viewName: node.viewName,
@@ -73,7 +73,10 @@ const RCTFabricUIManager = {
73
children: node.children,
74
};
75
}),
76
- cloneNodeWithNewChildren: jest.fn(function cloneNodeWithNewChildren(node) {
76
+ cloneNodeWithNewChildren: jest.fn(function cloneNodeWithNewChildren(
77
+ node,
78
+ instanceHandle,
79
+ ) {
80
return {
81
reactTag: node.reactTag,
82
viewName: node.viewName,
@@ -84,6 +87,7 @@ const RCTFabricUIManager = {
87
cloneNodeWithNewProps: jest.fn(function cloneNodeWithNewProps(
88
node,
89
newPropsDiff,
90
+ instanceHandle,
91
) {
92
return {
93
reactTag: node.reactTag,
@@ -93,7 +97,11 @@ const RCTFabricUIManager = {
97
};
98
}),
99
cloneNodeWithNewChildrenAndProps: jest.fn(
96
- function cloneNodeWithNewChildrenAndProps(node, newPropsDiff) {
100
+ function cloneNodeWithNewChildrenAndProps(
101
+ node,
102
+ newPropsDiff,
103
+ instanceHandle,
104
+ ) {
105
return {
106
reactTag: node.reactTag,
107
viewName: node.viewName,
packages/react-native-renderer/src/__tests__/ReactFabric-test.internal.js
+5
-1
@@ -61,7 +61,11 @@ describe('ReactFabric', () => {
61
ReactFabric.render(<View foo="bar" />, 11);
62
63
expect(FabricUIManager.createNode.mock.calls.length).toBe(1);
64
- expect(FabricUIManager.cloneNodeWithNewProps).toBeCalledWith(firstNode, {
64
+ expect(FabricUIManager.cloneNodeWithNewProps.mock.calls.length).toBe(1);
65
+ expect(FabricUIManager.cloneNodeWithNewProps.mock.calls[0][0]).toBe(
66
+ firstNode,
67
+ );
68
+ expect(FabricUIManager.cloneNodeWithNewProps.mock.calls[0][1]).toEqual({
69
foo: 'bar',
70
});
71
});
scripts/flow/react-native-host-hooks.js
+7
-2
@@ -101,15 +101,20 @@ declare module 'FabricUIManager' {
101
props: ?Object,
102
instanceHandle: Object,
103
): Object;
104
- declare function cloneNode(node: Object): Object;
105
- declare function cloneNodeWithNewChildren(node: Object): Object;
104
+ declare function cloneNode(node: Object, instanceHandle: Object): Object;
105
+ declare function cloneNodeWithNewChildren(
106
+ node: Object,
107
+ instanceHandle: Object,
108
+ ): Object;
109
declare function cloneNodeWithNewProps(
110
node: Object,
111
newProps: ?Object,
112
+ instanceHandle: Object,
113
): Object;
114
declare function cloneNodeWithNewChildrenAndProps(
115
node: Object,
116
newProps: ?Object,
117
+ instanceHandle: Object,
118
): Object;
119
declare function appendChild(node: Object, childNode: Object): void;
120