@office-iss/react-native-win32 0.0.0-canary.245 → 0.0.0-canary.247

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (40) hide show
  1. package/.flowconfig +1 -2
  2. package/CHANGELOG.json +100 -1
  3. package/CHANGELOG.md +33 -8
  4. package/Libraries/Animated/createAnimatedComponent.js +20 -3
  5. package/Libraries/Components/ScrollView/ScrollViewStickyHeader.js +13 -1
  6. package/Libraries/Components/TextInput/TextInput.win32.js +2 -2
  7. package/Libraries/Components/Touchable/TouchableHighlight.d.ts +4 -10
  8. package/Libraries/Components/Touchable/TouchableOpacity.d.ts +4 -15
  9. package/Libraries/Core/Devtools/loadBundleFromServer.js +3 -3
  10. package/Libraries/Core/ErrorHandlers.js +116 -0
  11. package/Libraries/Core/ReactNativeVersion.js +1 -1
  12. package/Libraries/Core/setUpReactDevTools.js +70 -10
  13. package/Libraries/Debugging/DebuggingOverlayRegistry.js +1 -1
  14. package/Libraries/Inspector/ElementBox.js +2 -3
  15. package/Libraries/NativeComponent/NativeComponentRegistry.js +12 -5
  16. package/Libraries/ReactNative/BridgelessUIManager.js +1 -21
  17. package/Libraries/ReactNative/RendererImplementation.js +20 -2
  18. package/Libraries/ReactNative/UIManager.d.ts +0 -21
  19. package/Libraries/ReactNative/UIManagerProperties.js +0 -3
  20. package/Libraries/ReactNative/getNativeComponentAttributes.js +3 -6
  21. package/Libraries/Renderer/shims/ReactFabric.js +3 -0
  22. package/Libraries/Renderer/shims/ReactFeatureFlags.js +3 -0
  23. package/Libraries/Renderer/shims/ReactNative.js +3 -0
  24. package/Libraries/Renderer/shims/ReactNativeTypes.js +25 -1
  25. package/Libraries/Renderer/shims/ReactNativeViewConfigRegistry.js +3 -0
  26. package/Libraries/Renderer/shims/createReactNativeComponentClass.js +3 -0
  27. package/Libraries/StyleSheet/StyleSheetTypes.d.ts +3 -3
  28. package/Libraries/StyleSheet/StyleSheetTypes.js +3 -3
  29. package/Libraries/Utilities/{LoadingView.android.js → DevLoadingView.js} +33 -11
  30. package/Libraries/Utilities/HMRClient.js +8 -8
  31. package/overrides.json +2 -8
  32. package/package.json +17 -16
  33. package/src/private/featureflags/ReactNativeFeatureFlags.js +16 -6
  34. package/src/private/featureflags/specs/NativeReactNativeFeatureFlags.js +4 -2
  35. package/src/private/fusebox/setUpFuseboxReactDevToolsDispatcher.js +108 -0
  36. package/src/private/specs/modules/NativeUIManager.js +0 -7
  37. package/src/private/webapis/performance/PerformanceObserver.js +11 -5
  38. package/Libraries/Components/ScrollView/ScrollView.win32.js +0 -1983
  39. package/Libraries/Utilities/LoadingView.ios.js +0 -50
  40. package/Libraries/Utilities/LoadingView.js +0 -16
package/.flowconfig CHANGED
@@ -14,7 +14,6 @@
14
14
  <PROJECT_ROOT>/Libraries/Components/Button.js
15
15
  <PROJECT_ROOT>/Libraries/Components/Pressable/Pressable.js
16
16
  <PROJECT_ROOT>/Libraries/Components/SafeAreaView/SafeAreaView.js
17
- <PROJECT_ROOT>/Libraries/Components/ScrollView/ScrollView.js
18
17
  <PROJECT_ROOT>/Libraries/Components/TextInput/TextInput.js
19
18
  <PROJECT_ROOT>/Libraries/Components/TextInput/TextInputState.js
20
19
  <PROJECT_ROOT>/Libraries/Components/Touchable/Touchable.js
@@ -154,4 +153,4 @@ untyped-import
154
153
  untyped-type-import
155
154
 
156
155
  [version]
157
- ^0.232.0
156
+ ^0.234.0
package/CHANGELOG.json CHANGED
@@ -2,7 +2,106 @@
2
2
  "name": "@office-iss/react-native-win32",
3
3
  "entries": [
4
4
  {
5
- "date": "Sat, 11 May 2024 05:16:11 GMT",
5
+ "date": "Wed, 22 May 2024 05:15:59 GMT",
6
+ "version": "0.0.0-canary.247",
7
+ "tag": "@office-iss/react-native-win32_v0.0.0-canary.247",
8
+ "comments": {
9
+ "prerelease": [
10
+ {
11
+ "author": "1422161+marlenecota@users.noreply.github.com",
12
+ "package": "@office-iss/react-native-win32",
13
+ "commit": "ef55e6fc47b9adc83afc6ddcae92d7461013512b",
14
+ "comment": "RN Integration 04/20"
15
+ },
16
+ {
17
+ "author": "beachball",
18
+ "package": "@office-iss/react-native-win32",
19
+ "comment": "Bump @rnw-scripts/eslint-config to v1.2.17",
20
+ "commit": "not available"
21
+ },
22
+ {
23
+ "author": "beachball",
24
+ "package": "@office-iss/react-native-win32",
25
+ "comment": "Bump @rnw-scripts/jest-out-of-tree-snapshot-resolver to v1.1.21",
26
+ "commit": "not available"
27
+ },
28
+ {
29
+ "author": "beachball",
30
+ "package": "@office-iss/react-native-win32",
31
+ "comment": "Bump @rnw-scripts/just-task to v2.3.33",
32
+ "commit": "not available"
33
+ },
34
+ {
35
+ "author": "beachball",
36
+ "package": "@office-iss/react-native-win32",
37
+ "comment": "Bump react-native-platform-override to v1.9.34",
38
+ "commit": "not available"
39
+ }
40
+ ]
41
+ }
42
+ },
43
+ {
44
+ "date": "Wed, 15 May 2024 05:14:52 GMT",
45
+ "version": "0.0.0-canary.246",
46
+ "tag": "@office-iss/react-native-win32_v0.0.0-canary.246",
47
+ "comments": {
48
+ "prerelease": [
49
+ {
50
+ "author": "30809111+acoates-ms@users.noreply.github.com",
51
+ "package": "@office-iss/react-native-win32",
52
+ "commit": "5f46361c713a6cd19c07d21163af6ae6a056c545",
53
+ "comment": "Remove unneeded scrollview.win32.js override"
54
+ },
55
+ {
56
+ "author": "email not defined",
57
+ "package": "@office-iss/react-native-win32",
58
+ "commit": "1db259b0c8b028fef09bf42351be8917759ecc17",
59
+ "comment": "0413 integration"
60
+ },
61
+ {
62
+ "author": "beachball",
63
+ "package": "@office-iss/react-native-win32",
64
+ "comment": "Bump @rnw-scripts/eslint-config to v1.2.16",
65
+ "commit": "not available"
66
+ },
67
+ {
68
+ "author": "beachball",
69
+ "package": "@office-iss/react-native-win32",
70
+ "comment": "Bump @rnw-scripts/jest-out-of-tree-snapshot-resolver to v1.1.20",
71
+ "commit": "not available"
72
+ },
73
+ {
74
+ "author": "beachball",
75
+ "package": "@office-iss/react-native-win32",
76
+ "comment": "Bump @rnw-scripts/just-task to v2.3.32",
77
+ "commit": "not available"
78
+ },
79
+ {
80
+ "author": "beachball",
81
+ "package": "@office-iss/react-native-win32",
82
+ "comment": "Bump react-native-platform-override to v1.9.33",
83
+ "commit": "not available"
84
+ }
85
+ ]
86
+ }
87
+ },
88
+ {
89
+ "date": "Tue, 14 May 2024 05:17:51 GMT",
90
+ "version": "0.0.0-canary.245",
91
+ "tag": "@office-iss/react-native-win32_v0.0.0-canary.245",
92
+ "comments": {
93
+ "none": [
94
+ {
95
+ "author": "nate@bracy.dev",
96
+ "package": "@office-iss/react-native-win32",
97
+ "commit": "e2a0c87c3bdaea7cc7065a0aa9de4f899ad11e82",
98
+ "comment": "fix(TextInput/isFocused): correctly handle null focused input"
99
+ }
100
+ ]
101
+ }
102
+ },
103
+ {
104
+ "date": "Sat, 11 May 2024 05:18:28 GMT",
6
105
  "version": "0.0.0-canary.245",
7
106
  "tag": "@office-iss/react-native-win32_v0.0.0-canary.245",
8
107
  "comments": {
package/CHANGELOG.md CHANGED
@@ -1,21 +1,46 @@
1
1
  # Change Log - @office-iss/react-native-win32
2
2
 
3
- This log was last generated on Sat, 11 May 2024 05:16:11 GMT and should not be manually modified.
3
+ This log was last generated on Wed, 22 May 2024 05:15:59 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
- ## 0.0.0-canary.245
7
+ ## 0.0.0-canary.247
8
8
 
9
- Sat, 11 May 2024 05:16:11 GMT
9
+ Wed, 22 May 2024 05:15:59 GMT
10
10
 
11
11
  ### Changes
12
12
 
13
- - integrate rn nightly 4/5/2024 (email not defined)
14
- - Bump @rnw-scripts/eslint-config to v1.2.15
15
- - Bump @rnw-scripts/jest-out-of-tree-snapshot-resolver to v1.1.19
16
- - Bump @rnw-scripts/just-task to v2.3.31
17
- - Bump react-native-platform-override to v1.9.32
13
+ - RN Integration 04/20 (1422161+marlenecota@users.noreply.github.com)
14
+ - Bump @rnw-scripts/eslint-config to v1.2.17
15
+ - Bump @rnw-scripts/jest-out-of-tree-snapshot-resolver to v1.1.21
16
+ - Bump @rnw-scripts/just-task to v2.3.33
17
+ - Bump react-native-platform-override to v1.9.34
18
18
 
19
+ ## 0.0.0-canary.246
20
+
21
+ Wed, 15 May 2024 05:14:52 GMT
22
+
23
+ ### Changes
24
+
25
+ - Remove unneeded scrollview.win32.js override (30809111+acoates-ms@users.noreply.github.com)
26
+ - 0413 integration (email not defined)
27
+ - Bump @rnw-scripts/eslint-config to v1.2.16
28
+ - Bump @rnw-scripts/jest-out-of-tree-snapshot-resolver to v1.1.20
29
+ - Bump @rnw-scripts/just-task to v2.3.32
30
+ - Bump react-native-platform-override to v1.9.33
31
+
32
+ ## 0.0.0-canary.245
33
+
34
+ Sat, 11 May 2024 05:18:28 GMT
35
+
36
+ ### Changes
37
+
38
+ - integrate rn nightly 4/5/2024 (email not defined)
39
+ - Bump @rnw-scripts/eslint-config to v1.2.15
40
+ - Bump @rnw-scripts/jest-out-of-tree-snapshot-resolver to v1.1.19
41
+ - Bump @rnw-scripts/just-task to v2.3.31
42
+ - Bump react-native-platform-override to v1.9.32
43
+
19
44
  ## 0.0.0-canary.244
20
45
 
21
46
  Thu, 09 May 2024 05:18:43 GMT
@@ -8,12 +8,19 @@
8
8
  * @format
9
9
  */
10
10
 
11
+ import View from '../Components/View/View';
11
12
  import useMergeRefs from '../Utilities/useMergeRefs';
12
13
  import useAnimatedProps from './useAnimatedProps';
13
14
  import * as React from 'react';
14
15
 
15
16
  // $FlowFixMe[deprecated-type]
16
- export type AnimatedProps<Props: {...}> = $ObjMap<Props, () => any>;
17
+ export type AnimatedProps<Props: {...}> = $ObjMap<
18
+ Props &
19
+ $ReadOnly<{
20
+ passthroughAnimatedPropExplicitValues?: React.ElementConfig<typeof View>,
21
+ }>,
22
+ () => any,
23
+ >;
17
24
 
18
25
  export type AnimatedComponentType<
19
26
  Props: {...},
@@ -36,9 +43,19 @@ export default function createAnimatedComponent<TProps: {...}, TInstance>(
36
43
  // transformed and Pressable, onPress will not work after transform
37
44
  // without these passthrough values.
38
45
  // $FlowFixMe[prop-missing]
39
- const {style} = reducedProps;
46
+ const {passthroughAnimatedPropExplicitValues, style} = reducedProps;
47
+ const {style: passthroughStyle, ...passthroughProps} =
48
+ passthroughAnimatedPropExplicitValues ?? {};
49
+ const mergedStyle = {...style, ...passthroughStyle};
40
50
 
41
- return <Component {...reducedProps} style={style} ref={ref} />;
51
+ return (
52
+ <Component
53
+ {...reducedProps}
54
+ {...passthroughProps}
55
+ style={mergedStyle}
56
+ ref={ref}
57
+ />
58
+ );
42
59
  },
43
60
  );
44
61
 
@@ -267,7 +267,16 @@ const ScrollViewStickyHeaderWithForwardedRef: React.AbstractComponent<
267
267
 
268
268
  const child = React.Children.only<$FlowFixMe>(props.children);
269
269
 
270
+ const passthroughAnimatedPropExplicitValues =
271
+ isFabric && translateY != null
272
+ ? {
273
+ style: {transform: [{translateY: translateY}]},
274
+ }
275
+ : null;
276
+
270
277
  return (
278
+ /* $FlowFixMe[prop-missing] passthroughAnimatedPropExplicitValues isn't properly
279
+ included in the Animated.View flow type. */
271
280
  <Animated.View
272
281
  collapsable={false}
273
282
  nativeID={props.nativeID}
@@ -277,7 +286,10 @@ const ScrollViewStickyHeaderWithForwardedRef: React.AbstractComponent<
277
286
  child.props.style,
278
287
  styles.header,
279
288
  {transform: [{translateY: animatedTranslateY}]},
280
- ]}>
289
+ ]}
290
+ passthroughAnimatedPropExplicitValues={
291
+ passthroughAnimatedPropExplicitValues
292
+ }>
281
293
  {React.cloneElement(child, {
282
294
  style: styles.fill, // We transfer the child style to the wrapper.
283
295
  onLayout: undefined, // we call this manually through our this._onLayout
@@ -1278,9 +1278,9 @@ function InternalTextInput(props: Props): React.Node {
1278
1278
  );
1279
1279
  }
1280
1280
  },
1281
- // TODO: Fix this returning true on null === null, when no input is focused
1282
1281
  isFocused(): boolean {
1283
- return TextInputState.currentlyFocusedInput() === inputRef.current;
1282
+ const currentlyFocusedInput = TextInputState.currentlyFocusedInput();
1283
+ return currentlyFocusedInput !== null && currentlyFocusedInput === inputRef.current;
1284
1284
  },
1285
1285
  getNativeRef(): ?React.ElementRef<HostComponent<mixed>> {
1286
1286
  return inputRef.current;
@@ -8,12 +8,9 @@
8
8
  */
9
9
 
10
10
  import type * as React from 'react';
11
- import {Constructor} from '../../../types/private/Utilities';
12
- import {TimerMixin} from '../../../types/private/TimerMixin';
13
- import {NativeMethods} from '../../../types/public/ReactNativeTypes';
14
11
  import {ColorValue, StyleProp} from '../../StyleSheet/StyleSheet';
15
12
  import {ViewStyle} from '../../StyleSheet/StyleSheetTypes';
16
- import {TouchableMixin} from './Touchable';
13
+ import {View} from '../../Components/View/View';
17
14
  import {TouchableWithoutFeedbackProps} from './TouchableWithoutFeedback';
18
15
 
19
16
  /**
@@ -60,9 +57,6 @@ export interface TouchableHighlightProps extends TouchableWithoutFeedbackProps {
60
57
  *
61
58
  * @see https://reactnative.dev/docs/touchablehighlight
62
59
  */
63
- declare class TouchableHighlightComponent extends React.Component<TouchableHighlightProps> {}
64
- declare const TouchableHighlightBase: Constructor<NativeMethods> &
65
- Constructor<TimerMixin> &
66
- Constructor<TouchableMixin> &
67
- typeof TouchableHighlightComponent;
68
- export class TouchableHighlight extends TouchableHighlightBase {}
60
+ export const TouchableHighlight: React.ForwardRefExoticComponent<
61
+ React.PropsWithoutRef<TouchableHighlightProps> & React.RefAttributes<View>
62
+ >;
@@ -8,10 +8,7 @@
8
8
  */
9
9
 
10
10
  import type * as React from 'react';
11
- import {Constructor} from '../../../types/private/Utilities';
12
- import {TimerMixin} from '../../../types/private/TimerMixin';
13
- import {NativeMethods} from '../../../types/public/ReactNativeTypes';
14
- import {TouchableMixin} from './Touchable';
11
+ import {View} from '../../Components/View/View';
15
12
  import {TouchableWithoutFeedbackProps} from './TouchableWithoutFeedback';
16
13
 
17
14
  export interface TVProps {
@@ -79,14 +76,6 @@ export interface TouchableOpacityProps
79
76
  *
80
77
  * @see https://reactnative.dev/docs/touchableopacity
81
78
  */
82
- declare class TouchableOpacityComponent extends React.Component<TouchableOpacityProps> {}
83
- declare const TouchableOpacityBase: Constructor<TimerMixin> &
84
- Constructor<TouchableMixin> &
85
- Constructor<NativeMethods> &
86
- typeof TouchableOpacityComponent;
87
- export class TouchableOpacity extends TouchableOpacityBase {
88
- /**
89
- * Animate the touchable to a new opacity.
90
- */
91
- setOpacityTo: (value: number) => void;
92
- }
79
+ export const TouchableOpacity: React.ForwardRefExoticComponent<
80
+ React.PropsWithoutRef<TouchableOpacityProps> & React.RefAttributes<View>
81
+ >;
@@ -10,8 +10,8 @@
10
10
  */
11
11
 
12
12
  import Networking from '../../Network/RCTNetworking';
13
+ import DevLoadingView from '../../Utilities/DevLoadingView';
13
14
  import HMRClient from '../../Utilities/HMRClient';
14
- import LoadingView from '../../Utilities/LoadingView';
15
15
  import getDevServer from './getDevServer';
16
16
 
17
17
  declare var global: {globalEvalWithSourceUrl?: (string, string) => mixed, ...};
@@ -110,7 +110,7 @@ module.exports = function (bundlePathAndQuery: string): Promise<void> {
110
110
  if (loadPromise) {
111
111
  return loadPromise;
112
112
  }
113
- LoadingView.showMessage('Downloading...', 'load');
113
+ DevLoadingView.showMessage('Downloading...', 'load');
114
114
  ++pendingRequests;
115
115
 
116
116
  loadPromise = asyncRequest(requestUrl)
@@ -143,7 +143,7 @@ module.exports = function (bundlePathAndQuery: string): Promise<void> {
143
143
  })
144
144
  .finally(() => {
145
145
  if (!--pendingRequests) {
146
- LoadingView.hide();
146
+ DevLoadingView.hide();
147
147
  }
148
148
  });
149
149
 
@@ -0,0 +1,116 @@
1
+ /**
2
+ * Copyright (c) Meta Platforms, Inc. and 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 strict
9
+ */
10
+
11
+ 'use strict';
12
+
13
+ import type {ExtendedError} from './ExtendedError';
14
+
15
+ import {SyntheticError, handleException} from './ExceptionsManager';
16
+
17
+ type ErrorInfo = {
18
+ +componentStack?: ?string,
19
+ // $FlowFixMe[unclear-type] unknown props and state.
20
+ +errorBoundary?: ?React$Component<any, any>,
21
+ };
22
+
23
+ export function onUncaughtError(errorValue: mixed, errorInfo: ErrorInfo): void {
24
+ let error;
25
+
26
+ // Typically, `errorValue` should be an error. However, other values such as
27
+ // strings (or even null) are sometimes thrown.
28
+ if (errorValue instanceof Error) {
29
+ /* $FlowFixMe[class-object-subtyping] added when improving typing for
30
+ * this parameters */
31
+ error = (errorValue: ExtendedError);
32
+ } else if (typeof errorValue === 'string') {
33
+ /* $FlowFixMe[class-object-subtyping] added when improving typing for
34
+ * this parameters */
35
+ error = (new SyntheticError(errorValue): ExtendedError);
36
+ } else {
37
+ /* $FlowFixMe[class-object-subtyping] added when improving typing for
38
+ * this parameters */
39
+ error = (new SyntheticError('Unspecified error'): ExtendedError);
40
+ }
41
+ try {
42
+ // $FlowFixMe[incompatible-use] this is in try/catch.
43
+ error.componentStack = errorInfo.componentStack;
44
+ error.isComponentError = true;
45
+ } catch {
46
+ // Ignored.
47
+ }
48
+
49
+ // Uncaught errors are fatal.
50
+ handleException(error, true);
51
+ }
52
+
53
+ export function onCaughtError(errorValue: mixed, errorInfo: ErrorInfo): void {
54
+ let error;
55
+
56
+ // Typically, `errorValue` should be an error. However, other values such as
57
+ // strings (or even null) are sometimes thrown.
58
+ if (errorValue instanceof Error) {
59
+ /* $FlowFixMe[class-object-subtyping] added when improving typing for
60
+ * this parameters */
61
+ error = (errorValue: ExtendedError);
62
+ } else if (typeof errorValue === 'string') {
63
+ /* $FlowFixMe[class-object-subtyping] added when improving typing for
64
+ * this parameters */
65
+ error = (new SyntheticError(errorValue): ExtendedError);
66
+ } else {
67
+ /* $FlowFixMe[class-object-subtyping] added when improving typing for
68
+ * this parameters */
69
+ error = (new SyntheticError('Unspecified error'): ExtendedError);
70
+ }
71
+ try {
72
+ // $FlowFixMe[incompatible-use] this is in try/catch.
73
+ error.componentStack = errorInfo.componentStack;
74
+ error.isComponentError = true;
75
+ } catch {
76
+ // Ignored.
77
+ }
78
+
79
+ // Caught errors are not fatal.
80
+ handleException(error, false);
81
+ }
82
+
83
+ export function onRecoverableError(
84
+ errorValue: mixed,
85
+ errorInfo: ErrorInfo,
86
+ ): void {
87
+ let error;
88
+
89
+ // Typically, `errorValue` should be an error. However, other values such as
90
+ // strings (or even null) are sometimes thrown.
91
+ if (errorValue instanceof Error) {
92
+ /* $FlowFixMe[class-object-subtyping] added when improving typing for
93
+ * this parameters */
94
+ error = (errorValue: ExtendedError);
95
+ } else if (typeof errorValue === 'string') {
96
+ /* $FlowFixMe[class-object-subtyping] added when improving typing for
97
+ * this parameters */
98
+ error = (new SyntheticError(errorValue): ExtendedError);
99
+ } else {
100
+ /* $FlowFixMe[class-object-subtyping] added when improving typing for
101
+ * this parameters */
102
+ error = (new SyntheticError('Unspecified error'): ExtendedError);
103
+ }
104
+ try {
105
+ // $FlowFixMe[incompatible-use] this is in try/catch.
106
+ error.componentStack = errorInfo.componentStack;
107
+ error.isComponentError = true;
108
+ } catch {
109
+ // Ignored.
110
+ }
111
+
112
+ // Recoverable errors should only be warnings.
113
+ // This will make it a soft error in LogBox.
114
+ // TODO: improve the logging for recoverable errors in prod.
115
+ console.warn(error);
116
+ }
@@ -17,7 +17,7 @@ const version: $ReadOnly<{
17
17
  major: 0,
18
18
  minor: 75,
19
19
  patch: 0,
20
- prerelease: 'nightly-20240406-a05466c5b',
20
+ prerelease: 'nightly-20240420-03a51da72',
21
21
  };
22
22
 
23
23
  module.exports = {version};
@@ -10,12 +10,52 @@
10
10
 
11
11
  'use strict';
12
12
 
13
+ import type {Domain} from '../../src/private/fusebox/setUpFuseboxReactDevToolsDispatcher';
14
+
13
15
  if (__DEV__) {
14
- let isWebSocketOpen = false;
15
- let ws = null;
16
+ // Register dispatcher on global, which can be used later by Chrome DevTools frontend
17
+ require('../../src/private/fusebox/setUpFuseboxReactDevToolsDispatcher');
16
18
 
19
+ // Install hook before React is loaded.
17
20
  const reactDevTools = require('react-devtools-core');
18
- const connectToDevTools = () => {
21
+ // This should be defined in DEV, otherwise error is expected.
22
+ const fuseboxReactDevToolsDispatcher =
23
+ global.__FUSEBOX_REACT_DEVTOOLS_DISPATCHER__;
24
+ const reactDevToolsFuseboxGlobalBindingName =
25
+ fuseboxReactDevToolsDispatcher.BINDING_NAME;
26
+
27
+ const ReactNativeStyleAttributes = require('../Components/View/ReactNativeStyleAttributes');
28
+ const devToolsSettingsManager = require('../DevToolsSettings/DevToolsSettingsManager');
29
+ const resolveRNStyle = require('../StyleSheet/flattenStyle');
30
+
31
+ let disconnect = null;
32
+ function disconnectBackendFromReactDevToolsInFuseboxIfNeeded() {
33
+ if (disconnect != null) {
34
+ disconnect();
35
+ disconnect = null;
36
+ }
37
+ }
38
+
39
+ function connectToReactDevToolsInFusebox(domain: Domain) {
40
+ disconnect = reactDevTools.connectWithCustomMessagingProtocol({
41
+ onSubscribe: listener => {
42
+ domain.onMessage.addEventListener(listener);
43
+ },
44
+ onUnsubscribe: listener => {
45
+ domain.onMessage.removeEventListener(listener);
46
+ },
47
+ onMessage: (event, payload) => {
48
+ domain.sendMessage({event, payload});
49
+ },
50
+ settingsManager: devToolsSettingsManager,
51
+ nativeStyleEditorValidAttributes: Object.keys(ReactNativeStyleAttributes),
52
+ resolveRNStyle,
53
+ });
54
+ }
55
+
56
+ let isWebSocketOpen = false;
57
+ let ws = null;
58
+ function connectToWSBasedReactDevToolsFrontend() {
19
59
  if (ws !== null && isWebSocketOpen) {
20
60
  // If the DevTools backend is already connected, don't recreate the WebSocket.
21
61
  // This would break the connection.
@@ -61,12 +101,9 @@ if (__DEV__) {
61
101
  isWebSocketOpen = true;
62
102
  });
63
103
 
64
- const ReactNativeStyleAttributes = require('../Components/View/ReactNativeStyleAttributes');
65
- const devToolsSettingsManager = require('../DevToolsSettings/DevToolsSettingsManager');
66
-
67
104
  reactDevTools.connectToDevTools({
68
105
  isAppActive,
69
- resolveRNStyle: require('../StyleSheet/flattenStyle'),
106
+ resolveRNStyle,
70
107
  nativeStyleEditorValidAttributes: Object.keys(
71
108
  ReactNativeStyleAttributes,
72
109
  ),
@@ -74,9 +111,32 @@ if (__DEV__) {
74
111
  devToolsSettingsManager,
75
112
  });
76
113
  }
77
- };
114
+ }
115
+
116
+ // 1. If React DevTools has already been opened and initialized in Fusebox, bindings survive reloads
117
+ if (global[reactDevToolsFuseboxGlobalBindingName] != null) {
118
+ disconnectBackendFromReactDevToolsInFuseboxIfNeeded();
119
+ const domain =
120
+ fuseboxReactDevToolsDispatcher.initializeDomain('react-devtools');
121
+ connectToReactDevToolsInFusebox(domain);
122
+ }
123
+
124
+ // 2. If React DevTools panel in Fusebox was opened for the first time after the runtime has been created
125
+ // 2. OR if React DevTools frontend was re-initialized: Chrome DevTools was closed and then re-opened
126
+ global.__FUSEBOX_REACT_DEVTOOLS_DISPATCHER__.onDomainInitialization.addEventListener(
127
+ (domain: Domain) => {
128
+ if (domain.name === 'react-devtools') {
129
+ disconnectBackendFromReactDevToolsInFuseboxIfNeeded();
130
+ connectToReactDevToolsInFusebox(domain);
131
+ }
132
+ },
133
+ );
78
134
 
135
+ // 3. Fallback to attempting to connect WS-based RDT frontend
79
136
  const RCTNativeAppEventEmitter = require('../EventEmitter/RCTNativeAppEventEmitter');
80
- RCTNativeAppEventEmitter.addListener('RCTDevMenuShown', connectToDevTools);
81
- connectToDevTools(); // Try connecting once on load
137
+ RCTNativeAppEventEmitter.addListener(
138
+ 'RCTDevMenuShown',
139
+ connectToWSBasedReactDevToolsFrontend,
140
+ );
141
+ connectToWSBasedReactDevToolsFrontend(); // Try connecting once on load
82
142
  }
@@ -62,9 +62,9 @@ class DebuggingOverlayRegistry {
62
62
  constructor() {
63
63
  if (reactDevToolsHook?.reactDevtoolsAgent != null) {
64
64
  this.#onReactDevToolsAgentAttached(reactDevToolsHook.reactDevtoolsAgent);
65
- return;
66
65
  }
67
66
 
67
+ // There could be cases when frontend is disconnected and then connected again for the same React Native runtime.
68
68
  reactDevToolsHook?.on?.(
69
69
  'react-devtools',
70
70
  this.#onReactDevToolsAgentAttached,
@@ -20,10 +20,9 @@ const React = require('react');
20
20
 
21
21
  class ElementBox extends React.Component<$FlowFixMeProps> {
22
22
  render(): React.Node {
23
- // $FlowFixMe[underconstrained-implicit-instantiation]
24
23
  const style = flattenStyle(this.props.style) || {};
25
- let margin = resolveBoxStyle('margin', style);
26
- let padding = resolveBoxStyle('padding', style);
24
+ let margin: ?$ReadOnly<Style> = resolveBoxStyle('margin', style);
25
+ let padding: ?$ReadOnly<Style> = resolveBoxStyle('padding', style);
27
26
 
28
27
  const frameStyle = {...this.props.frame};
29
28
  const contentStyle: {width: number, height: number} = {
@@ -62,14 +62,21 @@ export function get<Config>(
62
62
 
63
63
  let viewConfig;
64
64
  if (native) {
65
- viewConfig = getNativeComponentAttributes(name);
65
+ viewConfig =
66
+ getNativeComponentAttributes(name) ??
67
+ createViewConfig(viewConfigProvider());
66
68
  } else {
67
- viewConfig = createViewConfig(viewConfigProvider());
68
- if (viewConfig == null) {
69
- viewConfig = getNativeComponentAttributes(name);
70
- }
69
+ viewConfig =
70
+ createViewConfig(viewConfigProvider()) ??
71
+ getNativeComponentAttributes(name);
71
72
  }
72
73
 
74
+ invariant(
75
+ viewConfig != null,
76
+ 'NativeComponentRegistry.get: both static and native view config are missing for native component "%s".',
77
+ name,
78
+ );
79
+
73
80
  if (verify) {
74
81
  const nativeViewConfig = native
75
82
  ? viewConfig
@@ -160,27 +160,7 @@ const UIManagerJSUnusedInNewArchAPIs = {
160
160
  * them from React Native.
161
161
  */
162
162
  const UIManagerJSDeprecatedPlatformAPIs = Platform.select({
163
- android: {
164
- // TODO(T175424986): Remove UIManager.showPopupMenu() in React Native v0.75.
165
- showPopupMenu: (
166
- reactTag: number,
167
- items: Array<string>,
168
- error: (error: Object) => void,
169
- success: (event: string, selected?: number) => void,
170
- ): void => {
171
- raiseSoftError(
172
- 'showPopupMenu',
173
- 'Please use the <PopupMenuAndroid /> component instead.',
174
- );
175
- },
176
- // TODO(T175424986): Remove UIManager.dismissPopupMenu() in React Native v0.75.
177
- dismissPopupMenu: (): void => {
178
- raiseSoftError(
179
- 'dismissPopupMenu',
180
- 'Please use the <PopupMenuAndroid /> component instead.',
181
- );
182
- },
183
- },
163
+ android: {},
184
164
  });
185
165
 
186
166
  const UIManagerJSPlatformAPIs = Platform.select({