@samitouri / QOS-React / commits / 2d6be757df

[Native] Delete NativeComponent and NativeMethodsMixin (#18036)

* [Native] Delete NativeComponent and NativeMethodsMixin * Remove more files

Eli White committed Feb 13, 2020 at 15:09 UTC 2d6be757df86177ca8590bf7c361d6c910640895
10 files changed +260 -1257
packages/react-native-renderer/src/NativeMethodsMixin.js deleted
-330
@@ -1,330 +0,0 @@
1 -/**
2 - * Copyright (c) Facebook, Inc. and its affiliates.
3 - *
4 - * This source code is licensed under the MIT license found in the
5 - * LICENSE file in the root directory of this source tree.
6 - *
7 - * @flow
8 - */
9 -
10 -import type {
11 - MeasureInWindowOnSuccessCallback,
12 - MeasureLayoutOnSuccessCallback,
13 - MeasureOnSuccessCallback,
14 - NativeMethodsMixinType,
15 - ReactNativeBaseComponentViewConfig,
16 -} from './ReactNativeTypes';
17 -
18 -import invariant from 'shared/invariant';
19 -// Modules provided by RN:
20 -import {
21 - TextInputState,
22 - UIManager,
23 -} from 'react-native/Libraries/ReactPrivate/ReactNativePrivateInterface';
24 -
25 -import {create} from './ReactNativeAttributePayload';
26 -import {
27 - mountSafeCallback_NOT_REALLY_SAFE,
28 - throwOnStylesProp,
29 - warnForStyleProps,
30 -} from './NativeMethodsMixinUtils';
31 -
32 -export default function(
33 - findNodeHandle: any => ?number,
34 - findHostInstance: any => any,
35 -) {
36 - /**
37 - * `NativeMethodsMixin` provides methods to access the underlying native
38 - * component directly. This can be useful in cases when you want to focus
39 - * a view or measure its on-screen dimensions, for example.
40 - *
41 - * The methods described here are available on most of the default components
42 - * provided by React Native. Note, however, that they are *not* available on
43 - * composite components that aren't directly backed by a native view. This will
44 - * generally include most components that you define in your own app. For more
45 - * information, see [Direct
46 - * Manipulation](docs/direct-manipulation.html).
47 - *
48 - * Note the Flow $Exact<> syntax is required to support mixins.
49 - * React createClass mixins can only be used with exact types.
50 - */
51 - const NativeMethodsMixin: $Exact<NativeMethodsMixinType> = {
52 - /**
53 - * Determines the location on screen, width, and height of the given view and
54 - * returns the values via an async callback. If successful, the callback will
55 - * be called with the following arguments:
56 - *
57 - * - x
58 - * - y
59 - * - width
60 - * - height
61 - * - pageX
62 - * - pageY
63 - *
64 - * Note that these measurements are not available until after the rendering
65 - * has been completed in native. If you need the measurements as soon as
66 - * possible, consider using the [`onLayout`
67 - * prop](docs/view.html#onlayout) instead.
68 - */
69 - measure: function(callback: MeasureOnSuccessCallback) {
70 - let maybeInstance;
71 -
72 - // Fiber errors if findNodeHandle is called for an umounted component.
73 - // Tests using ReactTestRenderer will trigger this case indirectly.
74 - // Mimicking stack behavior, we should silently ignore this case.
75 - // TODO Fix ReactTestRenderer so we can remove this try/catch.
76 - try {
77 - maybeInstance = findHostInstance(this);
78 - } catch (error) {}
79 -
80 - // If there is no host component beneath this we should fail silently.
81 - // This is not an error; it could mean a class component rendered null.
82 - if (maybeInstance == null) {
83 - return;
84 - }
85 -
86 - if (maybeInstance.canonical) {
87 - // We can't call FabricUIManager here because it won't be loaded in paper
88 - // at initialization time. See https://github.com/facebook/react/pull/15490
89 - // for more info.
90 - nativeFabricUIManager.measure(
91 - maybeInstance.node,
92 - mountSafeCallback_NOT_REALLY_SAFE(this, callback),
93 - );
94 - } else {
95 - UIManager.measure(
96 - findNodeHandle(this),
97 - mountSafeCallback_NOT_REALLY_SAFE(this, callback),
98 - );
99 - }
100 - },
101 -
102 - /**
103 - * Determines the location of the given view in the window and returns the
104 - * values via an async callback. If the React root view is embedded in
105 - * another native view, this will give you the absolute coordinates. If
106 - * successful, the callback will be called with the following
107 - * arguments:
108 - *
109 - * - x
110 - * - y
111 - * - width
112 - * - height
113 - *
114 - * Note that these measurements are not available until after the rendering
115 - * has been completed in native.
116 - */
117 - measureInWindow: function(callback: MeasureInWindowOnSuccessCallback) {
118 - let maybeInstance;
119 -
120 - // Fiber errors if findNodeHandle is called for an umounted component.
121 - // Tests using ReactTestRenderer will trigger this case indirectly.
122 - // Mimicking stack behavior, we should silently ignore this case.
123 - // TODO Fix ReactTestRenderer so we can remove this try/catch.
124 - try {
125 - maybeInstance = findHostInstance(this);
126 - } catch (error) {}
127 -
128 - // If there is no host component beneath this we should fail silently.
129 - // This is not an error; it could mean a class component rendered null.
130 - if (maybeInstance == null) {
131 - return;
132 - }
133 -
134 - if (maybeInstance.canonical) {
135 - // We can't call FabricUIManager here because it won't be loaded in paper
136 - // at initialization time. See https://github.com/facebook/react/pull/15490
137 - // for more info.
138 - nativeFabricUIManager.measureInWindow(
139 - maybeInstance.node,
140 - mountSafeCallback_NOT_REALLY_SAFE(this, callback),
141 - );
142 - } else {
143 - UIManager.measureInWindow(
144 - findNodeHandle(this),
145 - mountSafeCallback_NOT_REALLY_SAFE(this, callback),
146 - );
147 - }
148 - },
149 -
150 - /**
151 - * Like [`measure()`](#measure), but measures the view relative an ancestor,
152 - * specified as `relativeToNativeNode`. This means that the returned x, y
153 - * are relative to the origin x, y of the ancestor view.
154 - *
155 - * As always, to obtain a native node handle for a component, you can use
156 - * `findNodeHandle(component)`.
157 - */
158 - measureLayout: function(
159 - relativeToNativeNode: number | Object,
160 - onSuccess: MeasureLayoutOnSuccessCallback,
161 - onFail?: () => void /* currently unused */,
162 - ) {
163 - let maybeInstance;
164 -
165 - // Fiber errors if findNodeHandle is called for an umounted component.
166 - // Tests using ReactTestRenderer will trigger this case indirectly.
167 - // Mimicking stack behavior, we should silently ignore this case.
168 - // TODO Fix ReactTestRenderer so we can remove this try/catch.
169 - try {
170 - maybeInstance = findHostInstance(this);
171 - } catch (error) {}
172 -
173 - // If there is no host component beneath this we should fail silently.
174 - // This is not an error; it could mean a class component rendered null.
175 - if (maybeInstance == null) {
176 - return;
177 - }
178 -
179 - if (maybeInstance.canonical) {
180 - if (__DEV__) {
181 - console.error(
182 - 'Warning: measureLayout on components using NativeMethodsMixin ' +
183 - 'or ReactNative.NativeComponent is not currently supported in Fabric. ' +
184 - 'measureLayout must be called on a native ref. Consider using forwardRef.',
185 - );
186 - }
187 - return;
188 - } else {
189 - let relativeNode;
190 -
191 - if (typeof relativeToNativeNode === 'number') {
192 - // Already a node handle
193 - relativeNode = relativeToNativeNode;
194 - } else if (relativeToNativeNode._nativeTag) {
195 - relativeNode = relativeToNativeNode._nativeTag;
196 - }
197 -
198 - if (relativeNode == null) {
199 - if (__DEV__) {
200 - console.error(
201 - 'Warning: ref.measureLayout must be called with a node handle or a ref to a native component.',
202 - );
203 - }
204 -
205 - return;
206 - }
207 -
208 - UIManager.measureLayout(
209 - findNodeHandle(this),
210 - relativeNode,
211 - mountSafeCallback_NOT_REALLY_SAFE(this, onFail),
212 - mountSafeCallback_NOT_REALLY_SAFE(this, onSuccess),
213 - );
214 - }
215 - },
216 -
217 - /**
218 - * This function sends props straight to native. They will not participate in
219 - * future diff process - this means that if you do not include them in the
220 - * next render, they will remain active (see [Direct
221 - * Manipulation](docs/direct-manipulation.html)).
222 - */
223 - setNativeProps: function(nativeProps: Object) {
224 - // Class components don't have viewConfig -> validateAttributes.
225 - // Nor does it make sense to set native props on a non-native component.
226 - // Instead, find the nearest host component and set props on it.
227 - // Use findNodeHandle() rather than findNodeHandle() because
228 - // We want the instance/wrapper (not the native tag).
229 - let maybeInstance;
230 -
231 - // Fiber errors if findNodeHandle is called for an umounted component.
232 - // Tests using ReactTestRenderer will trigger this case indirectly.
233 - // Mimicking stack behavior, we should silently ignore this case.
234 - // TODO Fix ReactTestRenderer so we can remove this try/catch.
235 - try {
236 - maybeInstance = findHostInstance(this);
237 - } catch (error) {}
238 -
239 - // If there is no host component beneath this we should fail silently.
240 - // This is not an error; it could mean a class component rendered null.
241 - if (maybeInstance == null) {
242 - return;
243 - }
244 -
245 - if (maybeInstance.canonical) {
246 - if (__DEV__) {
247 - console.error(
248 - 'Warning: setNativeProps is not currently supported in Fabric',
249 - );
250 - }
251 - return;
252 - }
253 -
254 - const nativeTag =
255 - maybeInstance._nativeTag || maybeInstance.canonical._nativeTag;
256 - const viewConfig: ReactNativeBaseComponentViewConfig<> =
257 - maybeInstance.viewConfig || maybeInstance.canonical.viewConfig;
258 -
259 - if (__DEV__) {
260 - warnForStyleProps(nativeProps, viewConfig.validAttributes);
261 - }
262 -
263 - const updatePayload = create(nativeProps, viewConfig.validAttributes);
264 -
265 - // Avoid the overhead of bridge calls if there's no update.
266 - // This is an expensive no-op for Android, and causes an unnecessary
267 - // view invalidation for certain components (eg RCTTextInput) on iOS.
268 - if (updatePayload != null) {
269 - UIManager.updateView(
270 - nativeTag,
271 - viewConfig.uiViewClassName,
272 - updatePayload,
273 - );
274 - }
275 - },
276 -
277 - /**
278 - * Requests focus for the given input or view. The exact behavior triggered
279 - * will depend on the platform and type of view.
280 - */
281 - focus: function() {
282 - TextInputState.focusTextInput(findNodeHandle(this));
283 - },
284 -
285 - /**
286 - * Removes focus from an input or view. This is the opposite of `focus()`.
287 - */
288 - blur: function() {
289 - TextInputState.blurTextInput(findNodeHandle(this));
290 - },
291 - };
292 -
293 - if (__DEV__) {
294 - // hide this from Flow since we can't define these properties outside of
295 - // __DEV__ without actually implementing them (setting them to undefined
296 - // isn't allowed by ReactClass)
297 - const NativeMethodsMixin_DEV = (NativeMethodsMixin: any);
298 - invariant(
299 - !NativeMethodsMixin_DEV.componentWillMount &&
300 - !NativeMethodsMixin_DEV.componentWillReceiveProps &&
301 - !NativeMethodsMixin_DEV.UNSAFE_componentWillMount &&
302 - !NativeMethodsMixin_DEV.UNSAFE_componentWillReceiveProps,
303 - 'Do not override existing functions.',
304 - );
305 - // TODO (bvaughn) Remove cWM and cWRP in a future version of React Native,
306 - // Once these lifecycles have been remove from the reconciler.
307 - NativeMethodsMixin_DEV.componentWillMount = function() {
308 - throwOnStylesProp(this, this.props);
309 - };
310 - NativeMethodsMixin_DEV.componentWillReceiveProps = function(newProps) {
311 - throwOnStylesProp(this, newProps);
312 - };
313 - NativeMethodsMixin_DEV.UNSAFE_componentWillMount = function() {
314 - throwOnStylesProp(this, this.props);
315 - };
316 - NativeMethodsMixin_DEV.UNSAFE_componentWillReceiveProps = function(
317 - newProps,
318 - ) {
319 - throwOnStylesProp(this, newProps);
320 - };
321 -
322 - // React may warn about cWM/cWRP/cWU methods being deprecated.
323 - // Add a flag to suppress these warnings for this special case.
324 - // TODO (bvaughn) Remove this flag once the above methods have been removed.
325 - NativeMethodsMixin_DEV.componentWillMount.__suppressDeprecationWarning = true;
326 - NativeMethodsMixin_DEV.componentWillReceiveProps.__suppressDeprecationWarning = true;
327 - }
328 -
329 - return NativeMethodsMixin;
330 -}
packages/react-native-renderer/src/ReactFabric.js
+1 -8
@@ -32,8 +32,6 @@ import ReactVersion from 'shared/ReactVersion';
32 // Module provided by RN:
33 import {UIManager} from 'react-native/Libraries/ReactPrivate/ReactNativePrivateInterface';
34
35 -import NativeMethodsMixin from './NativeMethodsMixin';
36 -import ReactNativeComponent from './ReactNativeComponent';
35 import {getClosestInstanceFromNode} from './ReactFabricComponentTree';
36 import {getInspectorDataForViewTag} from './ReactNativeFiberInspector';
37
@@ -155,8 +153,6 @@ setBatchingImplementation(
153 const roots = new Map();
154
155 const ReactFabric: ReactFabricType = {
158 - NativeComponent: ReactNativeComponent(findNodeHandle, findHostInstance),
159 -
156 // This is needed for implementation details of TouchableNativeFeedback
157 // Remove this once TouchableNativeFeedback doesn't use cloneElement
158 findHostInstance_DEPRECATED,
@@ -223,10 +219,7 @@ const ReactFabric: ReactFabricType = {
219 return createPortal(children, containerTag, null, key);
220 },
221
226 - __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: {
227 - // Used as a mixin in many createClass-based components
228 - NativeMethodsMixin: NativeMethodsMixin(findNodeHandle, findHostInstance),
229 - },
222 + __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: {},
223 };
224
225 injectIntoDevTools({
packages/react-native-renderer/src/ReactNativeComponent.js deleted
-285
@@ -1,285 +0,0 @@
1 -/**
2 - * Copyright (c) Facebook, Inc. and its affiliates.
3 - *
4 - * This source code is licensed under the MIT license found in the
5 - * LICENSE file in the root directory of this source tree.
6 - *
7 - * @flow
8 - * @format
9 - */
10 -
11 -import type {
12 - MeasureInWindowOnSuccessCallback,
13 - MeasureLayoutOnSuccessCallback,
14 - MeasureOnSuccessCallback,
15 - NativeMethods,
16 - ReactNativeBaseComponentViewConfig,
17 -} from './ReactNativeTypes';
18 -
19 -import React from 'react';
20 -// Modules provided by RN:
21 -import {
22 - TextInputState,
23 - UIManager,
24 -} from 'react-native/Libraries/ReactPrivate/ReactNativePrivateInterface';
25 -
26 -import {create} from './ReactNativeAttributePayload';
27 -import {mountSafeCallback_NOT_REALLY_SAFE} from './NativeMethodsMixinUtils';
28 -
29 -export default function(
30 - findNodeHandle: any => ?number,
31 - findHostInstance: any => any,
32 -) {
33 - /**
34 - * Superclass that provides methods to access the underlying native component.
35 - * This can be useful when you want to focus a view or measure its dimensions.
36 - *
37 - * Methods implemented by this class are available on most default components
38 - * provided by React Native. However, they are *not* available on composite
39 - * components that are not directly backed by a native view. For more
40 - * information, see [Direct Manipulation](docs/direct-manipulation.html).
41 - *
42 - * @abstract
43 - */
44 - class ReactNativeComponent<Props> extends React.Component<Props> {
45 - /**
46 - * Due to bugs in Flow's handling of React.createClass, some fields already
47 - * declared in the base class need to be redeclared below.
48 - */
49 - props: Props;
50 -
51 - /**
52 - * Removes focus. This is the opposite of `focus()`.
53 - */
54 - blur(): void {
55 - TextInputState.blurTextInput(findNodeHandle(this));
56 - }
57 -
58 - /**
59 - * Requests focus. The exact behavior depends on the platform and view.
60 - */
61 - focus(): void {
62 - TextInputState.focusTextInput(findNodeHandle(this));
63 - }
64 -
65 - /**
66 - * Measures the on-screen location and dimensions. If successful, the callback
67 - * will be called asynchronously with the following arguments:
68 - *
69 - * - x
70 - * - y
71 - * - width
72 - * - height
73 - * - pageX
74 - * - pageY
75 - *
76 - * These values are not available until after natives rendering completes. If
77 - * you need the measurements as soon as possible, consider using the
78 - * [`onLayout` prop](docs/view.html#onlayout) instead.
79 - */
80 - measure(callback: MeasureOnSuccessCallback): void {
81 - let maybeInstance;
82 -
83 - // Fiber errors if findNodeHandle is called for an umounted component.
84 - // Tests using ReactTestRenderer will trigger this case indirectly.
85 - // Mimicking stack behavior, we should silently ignore this case.
86 - // TODO Fix ReactTestRenderer so we can remove this try/catch.
87 - try {
88 - maybeInstance = findHostInstance(this);
89 - } catch (error) {}
90 -
91 - // If there is no host component beneath this we should fail silently.
92 - // This is not an error; it could mean a class component rendered null.
93 - if (maybeInstance == null) {
94 - return;
95 - }
96 -
97 - if (maybeInstance.canonical) {
98 - // We can't call FabricUIManager here because it won't be loaded in paper
99 - // at initialization time. See https://github.com/facebook/react/pull/15490
100 - // for more info.
101 - nativeFabricUIManager.measure(
102 - maybeInstance.node,
103 - mountSafeCallback_NOT_REALLY_SAFE(this, callback),
104 - );
105 - } else {
106 - UIManager.measure(
107 - findNodeHandle(this),
108 - mountSafeCallback_NOT_REALLY_SAFE(this, callback),
109 - );
110 - }
111 - }
112 -
113 - /**
114 - * Measures the on-screen location and dimensions. Even if the React Native
115 - * root view is embedded within another native view, this method will give you
116 - * the absolute coordinates measured from the window. If successful, the
117 - * callback will be called asynchronously with the following arguments:
118 - *
119 - * - x
120 - * - y
121 - * - width
122 - * - height
123 - *
124 - * These values are not available until after natives rendering completes.
125 - */
126 - measureInWindow(callback: MeasureInWindowOnSuccessCallback): void {
127 - let maybeInstance;
128 -
129 - // Fiber errors if findNodeHandle is called for an umounted component.
130 - // Tests using ReactTestRenderer will trigger this case indirectly.
131 - // Mimicking stack behavior, we should silently ignore this case.
132 - // TODO Fix ReactTestRenderer so we can remove this try/catch.
133 - try {
134 - maybeInstance = findHostInstance(this);
135 - } catch (error) {}
136 -
137 - // If there is no host component beneath this we should fail silently.
138 - // This is not an error; it could mean a class component rendered null.
139 - if (maybeInstance == null) {
140 - return;
141 - }
142 -
143 - if (maybeInstance.canonical) {
144 - // We can't call FabricUIManager here because it won't be loaded in paper
145 - // at initialization time. See https://github.com/facebook/react/pull/15490
146 - // for more info.
147 - nativeFabricUIManager.measureInWindow(
148 - maybeInstance.node,
149 - mountSafeCallback_NOT_REALLY_SAFE(this, callback),
150 - );
151 - } else {
152 - UIManager.measureInWindow(
153 - findNodeHandle(this),
154 - mountSafeCallback_NOT_REALLY_SAFE(this, callback),
155 - );
156 - }
157 - }
158 -
159 - /**
160 - * Similar to [`measure()`](#measure), but the resulting location will be
161 - * relative to the supplied ancestor's location.
162 - *
163 - * Obtain a native node handle with `ReactNative.findNodeHandle(component)`.
164 - */
165 - measureLayout(
166 - relativeToNativeNode: number | Object,
167 - onSuccess: MeasureLayoutOnSuccessCallback,
168 - onFail?: () => void /* currently unused */,
169 - ): void {
170 - let maybeInstance;
171 -
172 - // Fiber errors if findNodeHandle is called for an umounted component.
173 - // Tests using ReactTestRenderer will trigger this case indirectly.
174 - // Mimicking stack behavior, we should silently ignore this case.
175 - // TODO Fix ReactTestRenderer so we can remove this try/catch.
176 - try {
177 - maybeInstance = findHostInstance(this);
178 - } catch (error) {}
179 -
180 - // If there is no host component beneath this we should fail silently.
181 - // This is not an error; it could mean a class component rendered null.
182 - if (maybeInstance == null) {
183 - return;
184 - }
185 -
186 - if (maybeInstance.canonical) {
187 - if (__DEV__) {
188 - console.error(
189 - 'Warning: measureLayout on components using NativeMethodsMixin ' +
190 - 'or ReactNative.NativeComponent is not currently supported in Fabric. ' +
191 - 'measureLayout must be called on a native ref. Consider using forwardRef.',
192 - );
193 - }
194 - return;
195 - } else {
196 - let relativeNode;
197 -
198 - if (typeof relativeToNativeNode === 'number') {
199 - // Already a node handle
200 - relativeNode = relativeToNativeNode;
201 - } else if (relativeToNativeNode._nativeTag) {
202 - relativeNode = relativeToNativeNode._nativeTag;
203 - }
204 -
205 - if (relativeNode == null) {
206 - if (__DEV__) {
207 - console.error(
208 - 'Warning: ref.measureLayout must be called with a node handle or a ref to a native component.',
209 - );
210 - }
211 -
212 - return;
213 - }
214 -
215 - UIManager.measureLayout(
216 - findNodeHandle(this),
217 - relativeNode,
218 - mountSafeCallback_NOT_REALLY_SAFE(this, onFail),
219 - mountSafeCallback_NOT_REALLY_SAFE(this, onSuccess),
220 - );
221 - }
222 - }
223 -
224 - /**
225 - * This function sends props straight to native. They will not participate in
226 - * future diff process - this means that if you do not include them in the
227 - * next render, they will remain active (see [Direct
228 - * Manipulation](docs/direct-manipulation.html)).
229 - */
230 - setNativeProps(nativeProps: Object): void {
231 - // Class components don't have viewConfig -> validateAttributes.
232 - // Nor does it make sense to set native props on a non-native component.
233 - // Instead, find the nearest host component and set props on it.
234 - // Use findNodeHandle() rather than ReactNative.findNodeHandle() because
235 - // We want the instance/wrapper (not the native tag).
236 - let maybeInstance;
237 -
238 - // Fiber errors if findNodeHandle is called for an umounted component.
239 - // Tests using ReactTestRenderer will trigger this case indirectly.
240 - // Mimicking stack behavior, we should silently ignore this case.
241 - // TODO Fix ReactTestRenderer so we can remove this try/catch.
242 - try {
243 - maybeInstance = findHostInstance(this);
244 - } catch (error) {}
245 -
246 - // If there is no host component beneath this we should fail silently.
247 - // This is not an error; it could mean a class component rendered null.
248 - if (maybeInstance == null) {
249 - return;
250 - }
251 -
252 - if (maybeInstance.canonical) {
253 - if (__DEV__) {
254 - console.error(
255 - 'Warning: setNativeProps is not currently supported in Fabric',
256 - );
257 - }
258 - return;
259 - }
260 -
261 - const nativeTag =
262 - maybeInstance._nativeTag || maybeInstance.canonical._nativeTag;
263 - const viewConfig: ReactNativeBaseComponentViewConfig<> =
264 - maybeInstance.viewConfig || maybeInstance.canonical.viewConfig;
265 -
266 - const updatePayload = create(nativeProps, viewConfig.validAttributes);
267 -
268 - // Avoid the overhead of bridge calls if there's no update.
269 - // This is an expensive no-op for Android, and causes an unnecessary
270 - // view invalidation for certain components (eg RCTTextInput) on iOS.
271 - if (updatePayload != null) {
272 - UIManager.updateView(
273 - nativeTag,
274 - viewConfig.uiViewClassName,
275 - updatePayload,
276 - );
277 - }
278 - }
279 - }
280 -
281 - // eslint-disable-next-line no-unused-expressions
282 - (ReactNativeComponent.prototype: NativeMethods);
283 -
284 - return ReactNativeComponent;
285 -}
packages/react-native-renderer/src/ReactNativeFiberHostComponent.js
-7
@@ -28,13 +28,6 @@ import {
28 warnForStyleProps,
29 } from './NativeMethodsMixinUtils';
30
31 -/**
32 - * This component defines the same methods as NativeMethodsMixin but without the
33 - * findNodeHandle wrapper. This wrapper is unnecessary for HostComponent views
34 - * and would also result in a circular require.js dependency (since
35 - * ReactNativeFiber depends on this component and NativeMethodsMixin depends on
36 - * ReactNativeFiber).
37 - */
31 class ReactNativeFiberHostComponent {
32 _children: Array<Instance | number>;
33 _nativeTag: number;
packages/react-native-renderer/src/ReactNativeRenderer.js
-6
@@ -35,8 +35,6 @@ import ReactVersion from 'shared/ReactVersion';
35 // Module provided by RN:
36 import {UIManager} from 'react-native/Libraries/ReactPrivate/ReactNativePrivateInterface';
37
38 -import NativeMethodsMixin from './NativeMethodsMixin';
39 -import ReactNativeComponent from './ReactNativeComponent';
38 import {getClosestInstanceFromNode} from './ReactNativeComponentTree';
39 import {getInspectorDataForViewTag} from './ReactNativeFiberInspector';
40
@@ -164,8 +162,6 @@ function computeComponentStackForErrorReporting(reactTag: number): string {
162 const roots = new Map();
163
164 const ReactNativeRenderer: ReactNativeType = {
167 - NativeComponent: ReactNativeComponent(findNodeHandle, findHostInstance),
168 -
165 // This is needed for implementation details of TouchableNativeFeedback
166 // Remove this once TouchableNativeFeedback doesn't use cloneElement
167 findHostInstance_DEPRECATED,
@@ -235,8 +231,6 @@ const ReactNativeRenderer: ReactNativeType = {
231 unstable_batchedUpdates: batchedUpdates,
232
233 __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: {
238 - // Used as a mixin in many createClass-based components
239 - NativeMethodsMixin: NativeMethodsMixin(findNodeHandle, findHostInstance),
234 computeComponentStackForErrorReporting,
235 },
236 };
packages/react-native-renderer/src/ReactNativeTypes.js
+2 -34
@@ -8,7 +8,7 @@
8 * @flow
9 */
10
11 -import React, {type ElementRef, type AbstractComponent} from 'react';
11 +import type {ElementRef, AbstractComponent} from 'react';
12
13 export type MeasureOnSuccessCallback = (
14 x: number,
@@ -77,31 +77,6 @@ export type ReactNativeBaseComponentViewConfig<
77
78 export type ViewConfigGetter = () => ReactNativeBaseComponentViewConfig<>;
79
80 -/**
81 - * Class only exists for its Flow type.
82 - */
83 -class ReactNativeComponent<Props> extends React.Component<Props> {
84 - blur(): void {}
85 - focus(): void {}
86 - measure(callback: MeasureOnSuccessCallback): void {}
87 - measureInWindow(callback: MeasureInWindowOnSuccessCallback): void {}
88 - measureLayout(
89 - relativeToNativeNode: number | ElementRef<HostComponent<mixed>>,
90 - onSuccess: MeasureLayoutOnSuccessCallback,
91 - onFail?: () => void,
92 - ): void {}
93 - setNativeProps(nativeProps: Object): void {}
94 -}
95 -
96 -// This type is only used for FlowTests. It shouldn't be imported directly
97 -export type _InternalReactNativeComponentClass<Props> = Class<
98 - ReactNativeComponent<Props>,
99 ->;
100 -
101 -/**
102 - * This type keeps ReactNativeFiberHostComponent and NativeMethodsMixin in sync.
103 - * It can also provide types for ReactNative applications that use NMM or refs.
104 - */
80 export type NativeMethods = {
81 blur(): void,
82 focus(): void,
@@ -116,28 +91,22 @@ export type NativeMethods = {
91 ...
92 };
93
119 -export type NativeMethodsMixinType = NativeMethods;
94 export type HostComponent<T> = AbstractComponent<T, $ReadOnly<NativeMethods>>;
95
96 type SecretInternalsType = {
123 - NativeMethodsMixin: NativeMethodsMixinType,
97 computeComponentStackForErrorReporting(tag: number): string,
98 // TODO (bvaughn) Decide which additional types to expose here?
99 // And how much information to fill in for the above types.
100 ...
101 };
102
130 -type SecretInternalsFabricType = {
131 - NativeMethodsMixin: NativeMethodsMixinType,
132 - ...
133 -};
103 +type SecretInternalsFabricType = {...};
104
105 /**
106 * Flat ReactNative renderer bundles are too big for Flow to parse efficiently.
107 * Provide minimal Flow typing for the high-level RN API and call it a day.
108 */
109 export type ReactNativeType = {
140 - NativeComponent: typeof ReactNativeComponent,
110 findHostInstance_DEPRECATED(
111 componentOrHandle: any,
112 ): ?ElementRef<HostComponent<mixed>>,
@@ -157,7 +126,6 @@ export type ReactNativeType = {
126 };
127
128 export type ReactFabricType = {
160 - NativeComponent: typeof ReactNativeComponent,
129 findHostInstance_DEPRECATED(componentOrHandle: any): ?HostComponent<mixed>,
130 findNodeHandle(componentOrHandle: any): ?number,
131 dispatchCommand(handle: any, command: string, args: Array<any>): void,
packages/react-native-renderer/src/__tests__/ReactFabric-test.internal.js
+114 -255
@@ -13,11 +13,9 @@
13 let React;
14 let ReactFabric;
15 let ReactFeatureFlags;
16 -let createReactClass;
16 let createReactNativeComponentClass;
17 let UIManager;
18 let StrictMode;
20 -let NativeMethodsMixin;
19
20 const SET_NATIVE_PROPS_NOT_SUPPORTED_MESSAGE =
21 'Warning: setNativeProps is not currently supported in Fabric';
@@ -42,16 +40,8 @@ describe('ReactFabric', () => {
40 ReactFeatureFlags = require('shared/ReactFeatureFlags');
41 UIManager = require('react-native/Libraries/ReactPrivate/ReactNativePrivateInterface')
42 .UIManager;
45 - createReactClass = require('create-react-class/factory')(
46 - React.Component,
47 - React.isValidElement,
48 - new React.Component().updater,
49 - );
43 createReactNativeComponentClass = require('react-native/Libraries/ReactPrivate/ReactNativePrivateInterface')
44 .ReactNativeViewConfigRegistry.register;
52 - NativeMethodsMixin =
53 - ReactFabric.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED
54 - .NativeMethodsMixin;
45 });
46
47 it('should be able to create and render a native component', () => {
@@ -213,49 +203,34 @@ describe('ReactFabric', () => {
203 uiViewClassName: 'RCTView',
204 }));
205
216 - class Subclass extends ReactFabric.NativeComponent {
217 - render() {
218 - return <View />;
219 - }
220 - }
206 + UIManager.updateView.mockReset();
207
222 - const CreateClass = createReactClass({
223 - mixins: [NativeMethodsMixin],
224 - render: () => {
225 - return <View />;
226 - },
208 + let viewRef;
209 + ReactFabric.render(
210 + <View
211 + foo="bar"
212 + ref={ref => {
213 + viewRef = ref;
214 + }}
215 + />,
216 + 11,
217 + );
218 + expect(UIManager.updateView).not.toBeCalled();
219 +
220 + expect(() => {
221 + viewRef.setNativeProps({});
222 + }).toErrorDev([SET_NATIVE_PROPS_NOT_SUPPORTED_MESSAGE], {
223 + withoutStack: true,
224 });
225
229 - [View, Subclass, CreateClass].forEach(Component => {
230 - UIManager.updateView.mockReset();
226 + expect(UIManager.updateView).not.toBeCalled();
227
232 - let viewRef;
233 - ReactFabric.render(
234 - <Component
235 - foo="bar"
236 - ref={ref => {
237 - viewRef = ref;
238 - }}
239 - />,
240 - 11,
241 - );
242 - expect(UIManager.updateView).not.toBeCalled();
243 -
244 - expect(() => {
245 - viewRef.setNativeProps({});
246 - }).toErrorDev([SET_NATIVE_PROPS_NOT_SUPPORTED_MESSAGE], {
247 - withoutStack: true,
248 - });
249 -
250 - expect(UIManager.updateView).not.toBeCalled();
251 -
252 - expect(() => {
253 - viewRef.setNativeProps({foo: 'baz'});
254 - }).toErrorDev([SET_NATIVE_PROPS_NOT_SUPPORTED_MESSAGE], {
255 - withoutStack: true,
256 - });
257 - expect(UIManager.updateView).not.toBeCalled();
228 + expect(() => {
229 + viewRef.setNativeProps({foo: 'baz'});
230 + }).toErrorDev([SET_NATIVE_PROPS_NOT_SUPPORTED_MESSAGE], {
231 + withoutStack: true,
232 });
233 + expect(UIManager.updateView).not.toBeCalled();
234 });
235
236 it('should call dispatchCommand for native refs', () => {
@@ -264,75 +239,53 @@ describe('ReactFabric', () => {
239 uiViewClassName: 'RCTView',
240 }));
241
267 - [View].forEach(Component => {
268 - nativeFabricUIManager.dispatchCommand.mockClear();
242 + nativeFabricUIManager.dispatchCommand.mockClear();
243
270 - let viewRef;
271 - ReactFabric.render(
272 - <Component
273 - ref={ref => {
274 - viewRef = ref;
275 - }}
276 - />,
277 - 11,
278 - );
244 + let viewRef;
245 + ReactFabric.render(
246 + <View
247 + ref={ref => {
248 + viewRef = ref;
249 + }}
250 + />,
251 + 11,
252 + );
253
280 - expect(nativeFabricUIManager.dispatchCommand).not.toBeCalled();
281 - ReactFabric.dispatchCommand(viewRef, 'updateCommand', [10, 20]);
282 - expect(nativeFabricUIManager.dispatchCommand).toHaveBeenCalledTimes(1);
283 - expect(
284 - nativeFabricUIManager.dispatchCommand,
285 - ).toHaveBeenCalledWith(expect.any(Object), 'updateCommand', [10, 20]);
286 - });
254 + expect(nativeFabricUIManager.dispatchCommand).not.toBeCalled();
255 + ReactFabric.dispatchCommand(viewRef, 'updateCommand', [10, 20]);
256 + expect(nativeFabricUIManager.dispatchCommand).toHaveBeenCalledTimes(1);
257 + expect(
258 + nativeFabricUIManager.dispatchCommand,
259 + ).toHaveBeenCalledWith(expect.any(Object), 'updateCommand', [10, 20]);
260 });
261
262 it('should warn and no-op if calling dispatchCommand on non native refs', () => {
290 - const View = createReactNativeComponentClass('RCTView', () => ({
291 - validAttributes: {foo: true},
292 - uiViewClassName: 'RCTView',
293 - }));
294 -
263 class BasicClass extends React.Component {
264 render() {
265 return <React.Fragment />;
266 }
267 }
268
301 - class Subclass extends ReactFabric.NativeComponent {
302 - render() {
303 - return <View />;
304 - }
305 - }
269 + nativeFabricUIManager.dispatchCommand.mockReset();
270
307 - const CreateClass = createReactClass({
308 - mixins: [NativeMethodsMixin],
309 - render: () => {
310 - return <View />;
311 - },
312 - });
313 -
314 - [BasicClass, Subclass, CreateClass].forEach(Component => {
315 - nativeFabricUIManager.dispatchCommand.mockReset();
316 -
317 - let viewRef;
318 - ReactFabric.render(
319 - <Component
320 - ref={ref => {
321 - viewRef = ref;
322 - }}
323 - />,
324 - 11,
325 - );
326 -
327 - expect(nativeFabricUIManager.dispatchCommand).not.toBeCalled();
328 - expect(() => {
329 - ReactFabric.dispatchCommand(viewRef, 'updateCommand', [10, 20]);
330 - }).toErrorDev([DISPATCH_COMMAND_REQUIRES_HOST_COMPONENT], {
331 - withoutStack: true,
332 - });
271 + let viewRef;
272 + ReactFabric.render(
273 + <BasicClass
274 + ref={ref => {
275 + viewRef = ref;
276 + }}
277 + />,
278 + 11,
279 + );
280
334 - expect(nativeFabricUIManager.dispatchCommand).not.toBeCalled();
281 + expect(nativeFabricUIManager.dispatchCommand).not.toBeCalled();
282 + expect(() => {
283 + ReactFabric.dispatchCommand(viewRef, 'updateCommand', [10, 20]);
284 + }).toErrorDev([DISPATCH_COMMAND_REQUIRES_HOST_COMPONENT], {
285 + withoutStack: true,
286 });
287 +
288 + expect(nativeFabricUIManager.dispatchCommand).not.toBeCalled();
289 });
290
291 it('should call FabricUIManager.measure on ref.measure', () => {
@@ -341,39 +294,24 @@ describe('ReactFabric', () => {
294 uiViewClassName: 'RCTView',
295 }));
296
344 - class Subclass extends ReactFabric.NativeComponent {
345 - render() {
346 - return <View>{this.props.children}</View>;
347 - }
348 - }
349 -
350 - const CreateClass = createReactClass({
351 - mixins: [NativeMethodsMixin],
352 - render() {
353 - return <View>{this.props.children}</View>;
354 - },
355 - });
356 -
357 - [View, Subclass, CreateClass].forEach(Component => {
358 - nativeFabricUIManager.measure.mockClear();
297 + nativeFabricUIManager.measure.mockClear();
298
360 - let viewRef;
361 - ReactFabric.render(
362 - <Component
363 - ref={ref => {
364 - viewRef = ref;
365 - }}
366 - />,
367 - 11,
368 - );
299 + let viewRef;
300 + ReactFabric.render(
301 + <View
302 + ref={ref => {
303 + viewRef = ref;
304 + }}
305 + />,
306 + 11,
307 + );
308
370 - expect(nativeFabricUIManager.measure).not.toBeCalled();
371 - const successCallback = jest.fn();
372 - viewRef.measure(successCallback);
373 - expect(nativeFabricUIManager.measure).toHaveBeenCalledTimes(1);
374 - expect(successCallback).toHaveBeenCalledTimes(1);
375 - expect(successCallback).toHaveBeenCalledWith(10, 10, 100, 100, 0, 0);
376 - });
309 + expect(nativeFabricUIManager.measure).not.toBeCalled();
310 + const successCallback = jest.fn();
311 + viewRef.measure(successCallback);
312 + expect(nativeFabricUIManager.measure).toHaveBeenCalledTimes(1);
313 + expect(successCallback).toHaveBeenCalledTimes(1);
314 + expect(successCallback).toHaveBeenCalledWith(10, 10, 100, 100, 0, 0);
315 });
316
317 it('should call FabricUIManager.measureInWindow on ref.measureInWindow', () => {
@@ -382,39 +320,24 @@ describe('ReactFabric', () => {
320 uiViewClassName: 'RCTView',
321 }));
322
385 - class Subclass extends ReactFabric.NativeComponent {
386 - render() {
387 - return <View>{this.props.children}</View>;
388 - }
389 - }
323 + nativeFabricUIManager.measureInWindow.mockClear();
324
391 - const CreateClass = createReactClass({
392 - mixins: [NativeMethodsMixin],
393 - render() {
394 - return <View>{this.props.children}</View>;
395 - },
396 - });
397 -
398 - [View, Subclass, CreateClass].forEach(Component => {
399 - nativeFabricUIManager.measureInWindow.mockClear();
400 -
401 - let viewRef;
402 - ReactFabric.render(
403 - <Component
404 - ref={ref => {
405 - viewRef = ref;
406 - }}
407 - />,
408 - 11,
409 - );
325 + let viewRef;
326 + ReactFabric.render(
327 + <View
328 + ref={ref => {
329 + viewRef = ref;
330 + }}
331 + />,
332 + 11,
333 + );
334
411 - expect(nativeFabricUIManager.measureInWindow).not.toBeCalled();
412 - const successCallback = jest.fn();
413 - viewRef.measureInWindow(successCallback);
414 - expect(nativeFabricUIManager.measureInWindow).toHaveBeenCalledTimes(1);
415 - expect(successCallback).toHaveBeenCalledTimes(1);
416 - expect(successCallback).toHaveBeenCalledWith(10, 10, 100, 100);
417 - });
335 + expect(nativeFabricUIManager.measureInWindow).not.toBeCalled();
336 + const successCallback = jest.fn();
337 + viewRef.measureInWindow(successCallback);
338 + expect(nativeFabricUIManager.measureInWindow).toHaveBeenCalledTimes(1);
339 + expect(successCallback).toHaveBeenCalledTimes(1);
340 + expect(successCallback).toHaveBeenCalledWith(10, 10, 100, 100);
341 });
342
343 it('should support ref in ref.measureLayout', () => {
@@ -423,98 +346,34 @@ describe('ReactFabric', () => {
346 uiViewClassName: 'RCTView',
347 }));
348
426 - [View].forEach(Component => {
427 - nativeFabricUIManager.measureLayout.mockClear();
428 -
429 - let viewRef;
430 - let otherRef;
431 - ReactFabric.render(
432 - <Component>
433 - <Component
434 - foo="bar"
435 - ref={ref => {
436 - viewRef = ref;
437 - }}
438 - />
439 - <View
440 - ref={ref => {
441 - otherRef = ref;
442 - }}
443 - />
444 - </Component>,
445 - 11,
446 - );
447 -
448 - expect(nativeFabricUIManager.measureLayout).not.toBeCalled();
449 - const successCallback = jest.fn();
450 - const failureCallback = jest.fn();
451 - viewRef.measureLayout(otherRef, successCallback, failureCallback);
452 - expect(nativeFabricUIManager.measureLayout).toHaveBeenCalledTimes(1);
453 - expect(successCallback).toHaveBeenCalledTimes(1);
454 - expect(successCallback).toHaveBeenCalledWith(1, 1, 100, 100);
455 - });
456 - });
349 + nativeFabricUIManager.measureLayout.mockClear();
350
458 - it('should warn when calling measureLayout on Subclass and NativeMethodsMixin', () => {
459 - const View = createReactNativeComponentClass('RCTView', () => ({
460 - validAttributes: {foo: true},
461 - uiViewClassName: 'RCTView',
462 - }));
463 -
464 - class Subclass extends ReactFabric.NativeComponent {
465 - render() {
466 - return <View>{this.props.children}</View>;
467 - }
468 - }
469 -
470 - const CreateClass = createReactClass({
471 - mixins: [NativeMethodsMixin],
472 - render() {
473 - return <View>{this.props.children}</View>;
474 - },
475 - });
476 -
477 - [Subclass, CreateClass].forEach(Component => {
478 - nativeFabricUIManager.measureLayout.mockReset();
479 -
480 - let viewRef;
481 - let otherRef;
482 - ReactFabric.render(
483 - <Component>
484 - <Component
485 - foo="bar"
486 - ref={ref => {
487 - viewRef = ref;
488 - }}
489 - />
490 - <View
491 - ref={ref => {
492 - otherRef = ref;
493 - }}
494 - />
495 - </Component>,
496 - 11,
497 - );
498 -
499 - const successCallback = jest.fn();
500 - const failureCallback = jest.fn();
501 -
502 - expect(() => {
503 - viewRef.measureLayout(otherRef, successCallback, failureCallback);
504 - }).toErrorDev(
505 - [
506 - 'Warning: measureLayout on components using NativeMethodsMixin ' +
507 - 'or ReactNative.NativeComponent is not currently supported in Fabric. ' +
508 - 'measureLayout must be called on a native ref. Consider using forwardRef.',
509 - ],
510 - {
511 - withoutStack: true,
512 - },
513 - );
351 + let viewRef;
352 + let otherRef;
353 + ReactFabric.render(
354 + <View>
355 + <View
356 + foo="bar"
357 + ref={ref => {
358 + viewRef = ref;
359 + }}
360 + />
361 + <View
362 + ref={ref => {
363 + otherRef = ref;
364 + }}
365 + />
366 + </View>,
367 + 11,
368 + );
369
515 - expect(nativeFabricUIManager.measureLayout).not.toBeCalled();
516 - expect(UIManager.measureLayout).not.toBeCalled();
517 - });
370 + expect(nativeFabricUIManager.measureLayout).not.toBeCalled();
371 + const successCallback = jest.fn();
372 + const failureCallback = jest.fn();
373 + viewRef.measureLayout(otherRef, successCallback, failureCallback);
374 + expect(nativeFabricUIManager.measureLayout).toHaveBeenCalledTimes(1);
375 + expect(successCallback).toHaveBeenCalledTimes(1);
376 + expect(successCallback).toHaveBeenCalledWith(1, 1, 100, 100);
377 });
378
379 it('returns the correct instance and calls it in the callback', () => {
packages/react-native-renderer/src/__tests__/ReactNativeMount-test.internal.js
+143 -237
@@ -13,10 +13,8 @@
13 let React;
14 let StrictMode;
15 let ReactNative;
16 -let createReactClass;
16 let createReactNativeComponentClass;
17 let UIManager;
19 -let NativeMethodsMixin;
18
19 const DISPATCH_COMMAND_REQUIRES_HOST_COMPONENT =
20 "Warning: dispatchCommand was called with a ref that isn't a " +
@@ -31,16 +29,8 @@ describe('ReactNative', () => {
29 ReactNative = require('react-native-renderer');
30 UIManager = require('react-native/Libraries/ReactPrivate/ReactNativePrivateInterface')
31 .UIManager;
34 - createReactClass = require('create-react-class/factory')(
35 - React.Component,
36 - React.isValidElement,
37 - new React.Component().updater,
38 - );
32 createReactNativeComponentClass = require('react-native/Libraries/ReactPrivate/ReactNativePrivateInterface')
33 .ReactNativeViewConfigRegistry.register;
41 - NativeMethodsMixin =
42 - ReactNative.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED
43 - .NativeMethodsMixin;
34 });
35
36 it('should be able to create and render a native component', () => {
@@ -109,75 +99,53 @@ describe('ReactNative', () => {
99 uiViewClassName: 'RCTView',
100 }));
101
112 - [View].forEach(Component => {
113 - UIManager.dispatchViewManagerCommand.mockClear();
102 + UIManager.dispatchViewManagerCommand.mockClear();
103
115 - let viewRef;
116 - ReactNative.render(
117 - <Component
118 - ref={ref => {
119 - viewRef = ref;
120 - }}
121 - />,
122 - 11,
123 - );
104 + let viewRef;
105 + ReactNative.render(
106 + <View
107 + ref={ref => {
108 + viewRef = ref;
109 + }}
110 + />,
111 + 11,
112 + );
113
125 - expect(UIManager.dispatchViewManagerCommand).not.toBeCalled();
126 - ReactNative.dispatchCommand(viewRef, 'updateCommand', [10, 20]);
127 - expect(UIManager.dispatchViewManagerCommand).toHaveBeenCalledTimes(1);
128 - expect(
129 - UIManager.dispatchViewManagerCommand,
130 - ).toHaveBeenCalledWith(expect.any(Number), 'updateCommand', [10, 20]);
131 - });
114 + expect(UIManager.dispatchViewManagerCommand).not.toBeCalled();
115 + ReactNative.dispatchCommand(viewRef, 'updateCommand', [10, 20]);
116 + expect(UIManager.dispatchViewManagerCommand).toHaveBeenCalledTimes(1);
117 + expect(
118 + UIManager.dispatchViewManagerCommand,
119 + ).toHaveBeenCalledWith(expect.any(Number), 'updateCommand', [10, 20]);
120 });
121
122 it('should warn and no-op if calling dispatchCommand on non native refs', () => {
135 - const View = createReactNativeComponentClass('RCTView', () => ({
136 - validAttributes: {foo: true},
137 - uiViewClassName: 'RCTView',
138 - }));
139 -
123 class BasicClass extends React.Component {
124 render() {
125 return <React.Fragment />;
126 }
127 }
128
146 - class Subclass extends ReactNative.NativeComponent {
147 - render() {
148 - return <View />;
149 - }
150 - }
151 -
152 - const CreateClass = createReactClass({
153 - mixins: [NativeMethodsMixin],
154 - render: () => {
155 - return <View />;
156 - },
157 - });
158 -
159 - [BasicClass, Subclass, CreateClass].forEach(Component => {
160 - UIManager.dispatchViewManagerCommand.mockReset();
129 + UIManager.dispatchViewManagerCommand.mockReset();
130
162 - let viewRef;
163 - ReactNative.render(
164 - <Component
165 - ref={ref => {
166 - viewRef = ref;
167 - }}
168 - />,
169 - 11,
170 - );
171 -
172 - expect(UIManager.dispatchViewManagerCommand).not.toBeCalled();
173 - expect(() => {
174 - ReactNative.dispatchCommand(viewRef, 'updateCommand', [10, 20]);
175 - }).toErrorDev([DISPATCH_COMMAND_REQUIRES_HOST_COMPONENT], {
176 - withoutStack: true,
177 - });
131 + let viewRef;
132 + ReactNative.render(
133 + <BasicClass
134 + ref={ref => {
135 + viewRef = ref;
136 + }}
137 + />,
138 + 11,
139 + );
140
179 - expect(UIManager.dispatchViewManagerCommand).not.toBeCalled();
141 + expect(UIManager.dispatchViewManagerCommand).not.toBeCalled();
142 + expect(() => {
143 + ReactNative.dispatchCommand(viewRef, 'updateCommand', [10, 20]);
144 + }).toErrorDev([DISPATCH_COMMAND_REQUIRES_HOST_COMPONENT], {
145 + withoutStack: true,
146 });
147 +
148 + expect(UIManager.dispatchViewManagerCommand).not.toBeCalled();
149 });
150
151 it('should not call UIManager.updateView from ref.setNativeProps for properties that have not changed', () => {
@@ -186,46 +154,31 @@ describe('ReactNative', () => {
154 uiViewClassName: 'RCTView',
155 }));
156
189 - class Subclass extends ReactNative.NativeComponent {
190 - render() {
191 - return <View />;
192 - }
193 - }
157 + UIManager.updateView.mockReset();
158
195 - const CreateClass = createReactClass({
196 - mixins: [NativeMethodsMixin],
197 - render: () => {
198 - return <View />;
199 - },
200 - });
201 -
202 - [View, Subclass, CreateClass].forEach(Component => {
203 - UIManager.updateView.mockReset();
204 -
205 - let viewRef;
206 - ReactNative.render(
207 - <Component
208 - foo="bar"
209 - ref={ref => {
210 - viewRef = ref;
211 - }}
212 - />,
213 - 11,
214 - );
159 + let viewRef;
160 + ReactNative.render(
161 + <View
162 + foo="bar"
163 + ref={ref => {
164 + viewRef = ref;
165 + }}
166 + />,
167 + 11,
168 + );
169
216 - expect(UIManager.updateView).not.toBeCalled();
170 + expect(UIManager.updateView).not.toBeCalled();
171
218 - viewRef.setNativeProps({});
219 - expect(UIManager.updateView).not.toBeCalled();
172 + viewRef.setNativeProps({});
173 + expect(UIManager.updateView).not.toBeCalled();
174
221 - viewRef.setNativeProps({foo: 'baz'});
222 - expect(UIManager.updateView).toHaveBeenCalledTimes(1);
223 - expect(UIManager.updateView).toHaveBeenCalledWith(
224 - expect.any(Number),
225 - 'RCTView',
226 - {foo: 'baz'},
227 - );
228 - });
175 + viewRef.setNativeProps({foo: 'baz'});
176 + expect(UIManager.updateView).toHaveBeenCalledTimes(1);
177 + expect(UIManager.updateView).toHaveBeenCalledWith(
178 + expect.any(Number),
179 + 'RCTView',
180 + {foo: 'baz'},
181 + );
182 });
183
184 it('should call UIManager.measure on ref.measure', () => {
@@ -234,39 +187,24 @@ describe('ReactNative', () => {
187 uiViewClassName: 'RCTView',
188 }));
189
237 - class Subclass extends ReactNative.NativeComponent {
238 - render() {
239 - return <View>{this.props.children}</View>;
240 - }
241 - }
190 + UIManager.measure.mockClear();
191
243 - const CreateClass = createReactClass({
244 - mixins: [NativeMethodsMixin],
245 - render() {
246 - return <View>{this.props.children}</View>;
247 - },
248 - });
249 -
250 - [View, Subclass, CreateClass].forEach(Component => {
251 - UIManager.measure.mockClear();
192 + let viewRef;
193 + ReactNative.render(
194 + <View
195 + ref={ref => {
196 + viewRef = ref;
197 + }}
198 + />,
199 + 11,
200 + );
201
253 - let viewRef;
254 - ReactNative.render(
255 - <Component
256 - ref={ref => {
257 - viewRef = ref;
258 - }}
259 - />,
260 - 11,
261 - );
262 -
263 - expect(UIManager.measure).not.toBeCalled();
264 - const successCallback = jest.fn();
265 - viewRef.measure(successCallback);
266 - expect(UIManager.measure).toHaveBeenCalledTimes(1);
267 - expect(successCallback).toHaveBeenCalledTimes(1);
268 - expect(successCallback).toHaveBeenCalledWith(10, 10, 100, 100, 0, 0);
269 - });
202 + expect(UIManager.measure).not.toBeCalled();
203 + const successCallback = jest.fn();
204 + viewRef.measure(successCallback);
205 + expect(UIManager.measure).toHaveBeenCalledTimes(1);
206 + expect(successCallback).toHaveBeenCalledTimes(1);
207 + expect(successCallback).toHaveBeenCalledWith(10, 10, 100, 100, 0, 0);
208 });
209
210 it('should call UIManager.measureInWindow on ref.measureInWindow', () => {
@@ -275,39 +213,24 @@ describe('ReactNative', () => {
213 uiViewClassName: 'RCTView',
214 }));
215
278 - class Subclass extends ReactNative.NativeComponent {
279 - render() {
280 - return <View>{this.props.children}</View>;
281 - }
282 - }
283 -
284 - const CreateClass = createReactClass({
285 - mixins: [NativeMethodsMixin],
286 - render() {
287 - return <View>{this.props.children}</View>;
288 - },
289 - });
216 + UIManager.measureInWindow.mockClear();
217
291 - [View, Subclass, CreateClass].forEach(Component => {
292 - UIManager.measureInWindow.mockClear();
218 + let viewRef;
219 + ReactNative.render(
220 + <View
221 + ref={ref => {
222 + viewRef = ref;
223 + }}
224 + />,
225 + 11,
226 + );
227
294 - let viewRef;
295 - ReactNative.render(
296 - <Component
297 - ref={ref => {
298 - viewRef = ref;
299 - }}
300 - />,
301 - 11,
302 - );
303 -
304 - expect(UIManager.measureInWindow).not.toBeCalled();
305 - const successCallback = jest.fn();
306 - viewRef.measureInWindow(successCallback);
307 - expect(UIManager.measureInWindow).toHaveBeenCalledTimes(1);
308 - expect(successCallback).toHaveBeenCalledTimes(1);
309 - expect(successCallback).toHaveBeenCalledWith(10, 10, 100, 100);
310 - });
228 + expect(UIManager.measureInWindow).not.toBeCalled();
229 + const successCallback = jest.fn();
230 + viewRef.measureInWindow(successCallback);
231 + expect(UIManager.measureInWindow).toHaveBeenCalledTimes(1);
232 + expect(successCallback).toHaveBeenCalledTimes(1);
233 + expect(successCallback).toHaveBeenCalledWith(10, 10, 100, 100);
234 });
235
236 it('should support reactTag in ref.measureLayout', () => {
@@ -316,53 +239,38 @@ describe('ReactNative', () => {
239 uiViewClassName: 'RCTView',
240 }));
241
319 - class Subclass extends ReactNative.NativeComponent {
320 - render() {
321 - return <View>{this.props.children}</View>;
322 - }
323 - }
324 -
325 - const CreateClass = createReactClass({
326 - mixins: [NativeMethodsMixin],
327 - render() {
328 - return <View>{this.props.children}</View>;
329 - },
330 - });
242 + UIManager.measureLayout.mockClear();
243
332 - [View, Subclass, CreateClass].forEach(Component => {
333 - UIManager.measureLayout.mockClear();
244 + let viewRef;
245 + let otherRef;
246 + ReactNative.render(
247 + <View>
248 + <View
249 + foo="bar"
250 + ref={ref => {
251 + viewRef = ref;
252 + }}
253 + />
254 + <View
255 + ref={ref => {
256 + otherRef = ref;
257 + }}
258 + />
259 + </View>,
260 + 11,
261 + );
262
335 - let viewRef;
336 - let otherRef;
337 - ReactNative.render(
338 - <Component>
339 - <Component
340 - foo="bar"
341 - ref={ref => {
342 - viewRef = ref;
343 - }}
344 - />
345 - <Component
346 - ref={ref => {
347 - otherRef = ref;
348 - }}
349 - />
350 - </Component>,
351 - 11,
352 - );
353 -
354 - expect(UIManager.measureLayout).not.toBeCalled();
355 - const successCallback = jest.fn();
356 - const failureCallback = jest.fn();
357 - viewRef.measureLayout(
358 - ReactNative.findNodeHandle(otherRef),
359 - successCallback,
360 - failureCallback,
361 - );
362 - expect(UIManager.measureLayout).toHaveBeenCalledTimes(1);
363 - expect(successCallback).toHaveBeenCalledTimes(1);
364 - expect(successCallback).toHaveBeenCalledWith(1, 1, 100, 100);
365 - });
263 + expect(UIManager.measureLayout).not.toBeCalled();
264 + const successCallback = jest.fn();
265 + const failureCallback = jest.fn();
266 + viewRef.measureLayout(
267 + ReactNative.findNodeHandle(otherRef),
268 + successCallback,
269 + failureCallback,
270 + );
271 + expect(UIManager.measureLayout).toHaveBeenCalledTimes(1);
272 + expect(successCallback).toHaveBeenCalledTimes(1);
273 + expect(successCallback).toHaveBeenCalledWith(1, 1, 100, 100);
274 });
275
276 it('should support ref in ref.measureLayout of host components', () => {
@@ -371,36 +279,34 @@ describe('ReactNative', () => {
279 uiViewClassName: 'RCTView',
280 }));
281
374 - [View].forEach(Component => {
375 - UIManager.measureLayout.mockClear();
282 + UIManager.measureLayout.mockClear();
283
377 - let viewRef;
378 - let otherRef;
379 - ReactNative.render(
380 - <Component>
381 - <Component
382 - foo="bar"
383 - ref={ref => {
384 - viewRef = ref;
385 - }}
386 - />
387 - <View
388 - ref={ref => {
389 - otherRef = ref;
390 - }}
391 - />
392 - </Component>,
393 - 11,
394 - );
395 -
396 - expect(UIManager.measureLayout).not.toBeCalled();
397 - const successCallback = jest.fn();
398 - const failureCallback = jest.fn();
399 - viewRef.measureLayout(otherRef, successCallback, failureCallback);
400 - expect(UIManager.measureLayout).toHaveBeenCalledTimes(1);
401 - expect(successCallback).toHaveBeenCalledTimes(1);
402 - expect(successCallback).toHaveBeenCalledWith(1, 1, 100, 100);
403 - });
284 + let viewRef;
285 + let otherRef;
286 + ReactNative.render(
287 + <View>
288 + <View
289 + foo="bar"
290 + ref={ref => {
291 + viewRef = ref;
292 + }}
293 + />
294 + <View
295 + ref={ref => {
296 + otherRef = ref;
297 + }}
298 + />
299 + </View>,
300 + 11,
301 + );
302 +
303 + expect(UIManager.measureLayout).not.toBeCalled();
304 + const successCallback = jest.fn();
305 + const failureCallback = jest.fn();
306 + viewRef.measureLayout(otherRef, successCallback, failureCallback);
307 + expect(UIManager.measureLayout).toHaveBeenCalledTimes(1);
308 + expect(successCallback).toHaveBeenCalledTimes(1);
309 + expect(successCallback).toHaveBeenCalledWith(1, 1, 100, 100);
310 });
311
312 it('returns the correct instance and calls it in the callback', () => {
packages/react/src/__tests__/createReactClassIntegration-test.internal.js deleted
-74
@@ -1,74 +0,0 @@
1 -/**
2 - * Copyright (c) Facebook, Inc. and its affiliates.
3 - *
4 - * This source code is licensed under the MIT license found in the
5 - * LICENSE file in the root directory of this source tree.
6 - *
7 - * @emails react-core
8 - */
9 -
10 -'use strict';
11 -
12 -describe('create-react-class-integration', () => {
13 - describe('ReactNative NativeMethodsMixin', () => {
14 - let React;
15 - let ReactNative;
16 - let NativeMethodsMixin;
17 - let createReactClass;
18 -
19 - beforeEach(() => {
20 - jest.resetModules();
21 -
22 - React = require('react');
23 -
24 - createReactClass = require('create-react-class/factory')(
25 - React.Component,
26 - React.isValidElement,
27 - new React.Component().updater,
28 - );
29 -
30 - ReactNative = require('react-native-renderer');
31 - NativeMethodsMixin =
32 - ReactNative.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED
33 - .NativeMethodsMixin;
34 - });
35 -
36 - it('should not warn about default DEV-only legacy lifecycle methods', () => {
37 - const View = createReactClass({
38 - mixins: [NativeMethodsMixin],
39 - render: () => null,
40 - });
41 -
42 - ReactNative.render(<View />, 1);
43 - });
44 -
45 - it('should warn if users specify their own legacy componentWillMount', () => {
46 - const View = createReactClass({
47 - displayName: 'MyNativeComponent',
48 - mixins: [NativeMethodsMixin],
49 - componentWillMount: () => {},
50 - render: () => null,
51 - });
52 -
53 - expect(() =>
54 - ReactNative.render(<View />, 1),
55 - ).toWarnDev('componentWillMount has been renamed', {withoutStack: true});
56 - });
57 -
58 - it('should warn if users specify their own legacy componentWillReceiveProps', () => {
59 - const View = createReactClass({
60 - displayName: 'MyNativeComponent',
61 - mixins: [NativeMethodsMixin],
62 - componentWillReceiveProps: () => {},
63 - render: () => null,
64 - });
65 -
66 - expect(() => ReactNative.render(<View />, 1)).toWarnDev(
67 - 'componentWillReceiveProps has been renamed',
68 - {
69 - withoutStack: true,
70 - },
71 - );
72 - });
73 - });
74 -});
scripts/rollup/shims/react-native/NativeMethodsMixin.js deleted
-21
@@ -1,21 +0,0 @@
1 -/**
2 - * Copyright (c) Facebook, Inc. and its affiliates.
3 - *
4 - * This source code is licensed under the MIT license found in the
5 - * LICENSE file in the root directory of this source tree.
6 - *
7 - * @format
8 - * @flow
9 - */
10 -
11 -'use strict';
12 -
13 -const {
14 - __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED,
15 -} = require('./ReactNative');
16 -
17 -import type {NativeMethodsMixinType} from './ReactNativeTypes';
18 -
19 -const {NativeMethodsMixin} = __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
20 -
21 -module.exports = ((NativeMethodsMixin: any): $Exact<NativeMethodsMixinType>);