Make setNativeProps a no-op with Fabric renderer (#15094)
* Make setNativeProps a no-op with Fabric renderer * Remove unnecessary __DEV__ check
Eli White committed
Mar 29, 2019 at 15:44 UTC
1b94fd215dfd8ea25f1d9197890c613d4c84d915
5 files changed
+70
-84
packages/react-native-renderer/src/NativeMethodsMixin.js
+20
-11
@@ -124,17 +124,6 @@ export default function(
124
* Manipulation](docs/direct-manipulation.html)).
125
*/
126
setNativeProps: function(nativeProps: Object) {
127
- if (__DEV__) {
128
- if (warnAboutDeprecatedSetNativeProps) {
129
- warningWithoutStack(
130
- false,
131
- 'Warning: Calling ref.setNativeProps(nativeProps) ' +
132
- 'is deprecated and will be removed in a future release. ' +
133
- 'Use the setNativeProps export from the react-native package instead.' +
134
- "\n\timport {setNativeProps} from 'react-native';\n\tsetNativeProps(ref, nativeProps);\n",
135
- );
136
- }
137
- }
127
// Class components don't have viewConfig -> validateAttributes.
128
// Nor does it make sense to set native props on a non-native component.
129
// Instead, find the nearest host component and set props on it.
@@ -156,6 +145,26 @@ export default function(
145
return;
146
}
147
148
+ if (maybeInstance.canonical) {
149
+ warningWithoutStack(
150
+ false,
151
+ 'Warning: setNativeProps is not currently supported in Fabric',
152
+ );
153
+ return;
154
+ }
155
+
156
+ if (__DEV__) {
157
+ if (warnAboutDeprecatedSetNativeProps) {
158
+ warningWithoutStack(
159
+ false,
160
+ 'Warning: Calling ref.setNativeProps(nativeProps) ' +
161
+ 'is deprecated and will be removed in a future release. ' +
162
+ 'Use the setNativeProps export from the react-native package instead.' +
163
+ "\n\timport {setNativeProps} from 'react-native';\n\tsetNativeProps(ref, nativeProps);\n",
164
+ );
165
+ }
166
+ }
167
+
168
const nativeTag =
169
maybeInstance._nativeTag || maybeInstance.canonical._nativeTag;
170
const viewConfig: ReactNativeBaseComponentViewConfig<> =
packages/react-native-renderer/src/ReactFabric.js
+8
-2
@@ -32,7 +32,6 @@ import NativeMethodsMixin from './NativeMethodsMixin';
32
import ReactNativeComponent from './ReactNativeComponent';
33
import {getClosestInstanceFromNode} from './ReactFabricComponentTree';
34
import {getInspectorDataForViewTag} from './ReactNativeFiberInspector';
35
-import {setNativeProps} from './ReactNativeRendererSharedExports';
35
36
import ReactSharedInternals from 'shared/ReactSharedInternals';
37
import getComponentName from 'shared/getComponentName';
@@ -105,7 +104,14 @@ const ReactFabric: ReactFabricType = {
104
105
findNodeHandle,
106
108
- setNativeProps,
107
+ setNativeProps(handle: any, nativeProps: Object) {
108
+ warningWithoutStack(
109
+ false,
110
+ 'Warning: setNativeProps is not currently supported in Fabric',
111
+ );
112
+
113
+ return;
114
+ },
115
116
render(element: React$Element<any>, containerTag: any, callback: ?Function) {
117
let root = roots.get(containerTag);
packages/react-native-renderer/src/ReactFabricHostConfig.js
+6
-29
@@ -16,17 +16,13 @@ import type {
16
} from './ReactNativeTypes';
17
import type {ReactEventResponder} from 'shared/ReactTypes';
18
19
-import {
20
- mountSafeCallback_NOT_REALLY_SAFE,
21
- warnForStyleProps,
22
-} from './NativeMethodsMixinUtils';
19
+import {mountSafeCallback_NOT_REALLY_SAFE} from './NativeMethodsMixinUtils';
20
import {create, diff} from './ReactNativeAttributePayload';
21
import {get as getViewConfigForType} from 'ReactNativeViewConfigRegistry';
22
23
import deepFreezeAndThrowOnMutationInDev from 'deepFreezeAndThrowOnMutationInDev';
24
import invariant from 'shared/invariant';
25
import warningWithoutStack from 'shared/warningWithoutStack';
29
-import {warnAboutDeprecatedSetNativeProps} from 'shared/ReactFeatureFlags';
26
27
import {dispatchEvent} from './ReactFabricEventEmitter';
28
@@ -136,31 +132,12 @@ class ReactFabricHostComponent {
132
}
133
134
setNativeProps(nativeProps: Object) {
139
- if (__DEV__) {
140
- if (warnAboutDeprecatedSetNativeProps) {
141
- warningWithoutStack(
142
- false,
143
- 'Warning: Calling ref.setNativeProps(nativeProps) ' +
144
- 'is deprecated and will be removed in a future release. ' +
145
- 'Use the setNativeProps export from the react-native package instead.' +
146
- "\n\timport {setNativeProps} from 'react-native';\n\tsetNativeProps(ref, nativeProps);\n",
147
- );
148
- }
149
- warnForStyleProps(nativeProps, this.viewConfig.validAttributes);
150
- }
135
+ warningWithoutStack(
136
+ false,
137
+ 'Warning: setNativeProps is not currently supported in Fabric',
138
+ );
139
152
- const updatePayload = create(nativeProps, this.viewConfig.validAttributes);
153
-
154
- // Avoid the overhead of bridge calls if there's no update.
155
- // This is an expensive no-op for Android, and causes an unnecessary
156
- // view invalidation for certain components (eg RCTTextInput) on iOS.
157
- if (updatePayload != null) {
158
- UIManager.updateView(
159
- this._nativeTag,
160
- this.viewConfig.uiViewClassName,
161
- updatePayload,
162
- );
163
- }
140
+ return;
141
}
142
}
143
packages/react-native-renderer/src/ReactNativeComponent.js
+20
-12
@@ -135,18 +135,6 @@ export default function(
135
* Manipulation](docs/direct-manipulation.html)).
136
*/
137
setNativeProps(nativeProps: Object): void {
138
- if (__DEV__) {
139
- if (warnAboutDeprecatedSetNativeProps) {
140
- warningWithoutStack(
141
- false,
142
- 'Warning: Calling ref.setNativeProps(nativeProps) ' +
143
- 'is deprecated and will be removed in a future release. ' +
144
- 'Use the setNativeProps export from the react-native package instead.' +
145
- "\n\timport {setNativeProps} from 'react-native';\n\tsetNativeProps(ref, nativeProps);\n",
146
- );
147
- }
148
- }
149
-
138
// Class components don't have viewConfig -> validateAttributes.
139
// Nor does it make sense to set native props on a non-native component.
140
// Instead, find the nearest host component and set props on it.
@@ -168,6 +156,26 @@ export default function(
156
return;
157
}
158
159
+ if (maybeInstance.canonical) {
160
+ warningWithoutStack(
161
+ false,
162
+ 'Warning: setNativeProps is not currently supported in Fabric',
163
+ );
164
+ return;
165
+ }
166
+
167
+ if (__DEV__) {
168
+ if (warnAboutDeprecatedSetNativeProps) {
169
+ warningWithoutStack(
170
+ false,
171
+ 'Warning: Calling ref.setNativeProps(nativeProps) ' +
172
+ 'is deprecated and will be removed in a future release. ' +
173
+ 'Use the setNativeProps export from the react-native package instead.' +
174
+ "\n\timport {setNativeProps} from 'react-native';\n\tsetNativeProps(ref, nativeProps);\n",
175
+ );
176
+ }
177
+ }
178
+
179
const nativeTag =
180
maybeInstance._nativeTag || maybeInstance.canonical._nativeTag;
181
const viewConfig: ReactNativeBaseComponentViewConfig<> =
packages/react-native-renderer/src/__tests__/ReactFabric-test.internal.js
+16
-30
@@ -20,11 +20,8 @@ let FabricUIManager;
20
let StrictMode;
21
let NativeMethodsMixin;
22
23
-const SET_NATIVE_PROPS_DEPRECATION_MESSAGE =
24
- 'Warning: Calling ref.setNativeProps(nativeProps) ' +
25
- 'is deprecated and will be removed in a future release. ' +
26
- 'Use the setNativeProps export from the react-native package instead.' +
27
- "\n\timport {setNativeProps} from 'react-native';\n\tsetNativeProps(ref, nativeProps);\n";
23
+const SET_NATIVE_PROPS_NOT_SUPPORTED_MESSAGE =
24
+ 'Warning: setNativeProps is not currently supported in Fabric';
25
26
jest.mock('shared/ReactFeatureFlags', () =>
27
require('shared/forks/ReactFeatureFlags.native-oss'),
@@ -176,7 +173,7 @@ describe('ReactFabric', () => {
173
expect(FabricUIManager.__dumpHierarchyForJestTestsOnly()).toMatchSnapshot();
174
});
175
179
- it('should not call UIManager.updateView from ref.setNativeProps for properties that have not changed', () => {
176
+ it('should not call UIManager.updateView from ref.setNativeProps', () => {
177
const View = createReactNativeComponentClass('RCTView', () => ({
178
validAttributes: {foo: true},
179
uiViewClassName: 'RCTView',
@@ -212,7 +209,7 @@ describe('ReactFabric', () => {
209
210
expect(() => {
211
viewRef.setNativeProps({});
215
- }).toWarnDev([SET_NATIVE_PROPS_DEPRECATION_MESSAGE], {
212
+ }).toWarnDev([SET_NATIVE_PROPS_NOT_SUPPORTED_MESSAGE], {
213
withoutStack: true,
214
});
215
@@ -220,19 +217,14 @@ describe('ReactFabric', () => {
217
218
expect(() => {
219
viewRef.setNativeProps({foo: 'baz'});
223
- }).toWarnDev([SET_NATIVE_PROPS_DEPRECATION_MESSAGE], {
220
+ }).toWarnDev([SET_NATIVE_PROPS_NOT_SUPPORTED_MESSAGE], {
221
withoutStack: true,
222
});
226
- expect(UIManager.updateView).toHaveBeenCalledTimes(1);
227
- expect(UIManager.updateView).toHaveBeenCalledWith(
228
- expect.any(Number),
229
- 'RCTView',
230
- {foo: 'baz'},
231
- );
223
+ expect(UIManager.updateView).not.toBeCalled();
224
});
225
});
226
235
- it('should be able to setNativeProps on native refs', () => {
227
+ it('setNativeProps on native refs should no-op', () => {
228
const View = createReactNativeComponentClass('RCTView', () => ({
229
validAttributes: {foo: true},
230
uiViewClassName: 'RCTView',
@@ -252,13 +244,12 @@ describe('ReactFabric', () => {
244
);
245
246
expect(UIManager.updateView).not.toBeCalled();
255
- ReactFabric.setNativeProps(viewRef, {foo: 'baz'});
256
- expect(UIManager.updateView).toHaveBeenCalledTimes(1);
257
- expect(UIManager.updateView).toHaveBeenCalledWith(
258
- expect.any(Number),
259
- 'RCTView',
260
- {foo: 'baz'},
261
- );
247
+ expect(() => {
248
+ ReactFabric.setNativeProps(viewRef, {foo: 'baz'});
249
+ }).toWarnDev([SET_NATIVE_PROPS_NOT_SUPPORTED_MESSAGE], {
250
+ withoutStack: true,
251
+ });
252
+ expect(UIManager.updateView).not.toBeCalled();
253
});
254
255
it('should warn and no-op if calling setNativeProps on non native refs', () => {
@@ -303,14 +294,9 @@ describe('ReactFabric', () => {
294
expect(UIManager.updateView).not.toBeCalled();
295
expect(() => {
296
ReactFabric.setNativeProps(viewRef, {foo: 'baz'});
306
- }).toWarnDev(
307
- [
308
- "Warning: setNativeProps was called with a ref that isn't a " +
309
- 'native component. Use React.forwardRef to get access ' +
310
- 'to the underlying native component',
311
- ],
312
- {withoutStack: true},
313
- );
297
+ }).toWarnDev([SET_NATIVE_PROPS_NOT_SUPPORTED_MESSAGE], {
298
+ withoutStack: true,
299
+ });
300
301
expect(UIManager.updateView).not.toBeCalled();
302
});