diff --git a/packages/react-native-renderer/src/__mocks__/FabricUIManager.js b/packages/react-native-renderer/src/__mocks__/FabricUIManager.js
index f4765c95ea58..7bfacbd50614 100644
--- a/packages/react-native-renderer/src/__mocks__/FabricUIManager.js
+++ b/packages/react-native-renderer/src/__mocks__/FabricUIManager.js
@@ -72,21 +72,21 @@ const RCTFabricUIManager = {
}),
cloneNodeWithNewProps: jest.fn(function cloneNodeWithNewProps(
node,
- newProps,
+ newPropsDiff,
) {
return {
reactTag: node.reactTag,
viewName: node.viewName,
- props: newProps,
+ props: {...node.props, ...newPropsDiff},
children: node.children,
};
}),
cloneNodeWithNewChildrenAndProps: jest.fn(
- function cloneNodeWithNewChildrenAndProps(node, newProps) {
+ function cloneNodeWithNewChildrenAndProps(node, newPropsDiff) {
return {
reactTag: node.reactTag,
viewName: node.viewName,
- props: newProps,
+ props: {...node.props, ...newPropsDiff},
children: [],
};
},
diff --git a/packages/react-native-renderer/src/__tests__/ReactFabric-test.internal.js b/packages/react-native-renderer/src/__tests__/ReactFabric-test.internal.js
index 8249904b5c03..a1736cff241e 100644
--- a/packages/react-native-renderer/src/__tests__/ReactFabric-test.internal.js
+++ b/packages/react-native-renderer/src/__tests__/ReactFabric-test.internal.js
@@ -109,6 +109,48 @@ describe('ReactFabric', () => {
).toBe(1);
});
+ it('should only pass props diffs to FabricUIManager.cloneNode', () => {
+ const View = createReactNativeComponentClass('View', () => ({
+ validAttributes: {foo: true, bar: true},
+ uiViewClassName: 'View',
+ }));
+
+ ReactFabric.render(
+
+ 1
+ ,
+ 11,
+ );
+ expect(FabricUIManager.cloneNode).not.toBeCalled();
+ expect(FabricUIManager.cloneNodeWithNewChildren).not.toBeCalled();
+ expect(FabricUIManager.cloneNodeWithNewProps).not.toBeCalled();
+ expect(FabricUIManager.cloneNodeWithNewChildrenAndProps).not.toBeCalled();
+
+ ReactFabric.render(
+
+ 1
+ ,
+ 11,
+ );
+ expect(FabricUIManager.cloneNodeWithNewProps.mock.calls[0][1]).toEqual({
+ bar: 'b',
+ });
+ expect(FabricUIManager.__dumpHierarchyForJestTestsOnly()).toMatchSnapshot();
+
+ ReactFabric.render(
+
+ 2
+ ,
+ 11,
+ );
+ expect(
+ FabricUIManager.cloneNodeWithNewChildrenAndProps.mock.calls[0][1],
+ ).toEqual({
+ foo: 'b',
+ });
+ expect(FabricUIManager.__dumpHierarchyForJestTestsOnly()).toMatchSnapshot();
+ });
+
it('should not call UIManager.updateView from setNativeProps for properties that have not changed', () => {
const View = createReactNativeComponentClass('View', () => ({
validAttributes: {foo: true},
diff --git a/packages/react-native-renderer/src/__tests__/__snapshots__/ReactFabric-test.internal.js.snap b/packages/react-native-renderer/src/__tests__/__snapshots__/ReactFabric-test.internal.js.snap
index 829b12c03a25..cd6ebcb99075 100644
--- a/packages/react-native-renderer/src/__tests__/__snapshots__/ReactFabric-test.internal.js.snap
+++ b/packages/react-native-renderer/src/__tests__/__snapshots__/ReactFabric-test.internal.js.snap
@@ -49,3 +49,15 @@ exports[`ReactFabric renders and reorders children 2`] = `
View {\\"title\\":\\"z\\"}
View {\\"title\\":\\"y\\"}"
`;
+
+exports[`ReactFabric should only pass props diffs to FabricUIManager.cloneNode 1`] = `
+"11
+ View {\\"foo\\":\\"a\\",\\"bar\\":\\"b\\"}
+ RCTRawText {\\"text\\":\\"1\\"}"
+`;
+
+exports[`ReactFabric should only pass props diffs to FabricUIManager.cloneNode 2`] = `
+"11
+ View {\\"foo\\":\\"b\\",\\"bar\\":\\"b\\"}
+ RCTRawText {\\"text\\":\\"2\\"}"
+`;