Skip to content

Commit 4841373

Browse files
hoxyqfacebook-github-bot
authored andcommitted
fix: defer ReactDevToolsOverlay import (#43690)
Summary: Pull Request resolved: #43690 # Changelog: [Internal] Fixes #43678. The issue is that once `getInspectorDataForViewAtPoint` is imported, it should throw if RDT global hook was not injected. ReactDevTools overlay imports `getInspectorDataForViewAtPoint`, this is why it did throw in testing environment. ReactDevToolsOverlay JSX-element is already gated with RDT global hook check, adding a deferred import, same as it was already implemented for Inspector. Still unclear to me how this didn't throw all this time while using the Catalyst / RNTester. Reviewed By: cortinico Differential Revision: D55474774 fbshipit-source-id: 759e5e8227cc7534193e5b95616b6099c15f5cb5
1 parent 8e7263a commit 4841373

1 file changed

Lines changed: 21 additions & 2 deletions

File tree

packages/react-native/Libraries/ReactNative/AppContainer-dev.js

Lines changed: 21 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,6 @@ import View from '../Components/View/View';
2020
import DebuggingOverlay from '../Debugging/DebuggingOverlay';
2121
import useSubscribeToDebuggingOverlayRegistry from '../Debugging/useSubscribeToDebuggingOverlayRegistry';
2222
import RCTDeviceEventEmitter from '../EventEmitter/RCTDeviceEventEmitter';
23-
import ReactDevToolsOverlay from '../Inspector/ReactDevToolsOverlay';
2423
import LogBoxNotificationContainer from '../LogBox/LogBoxNotificationContainer';
2524
import StyleSheet from '../StyleSheet/StyleSheet';
2625
import {RootTagContext, createRootTag} from './RootTag';
@@ -64,6 +63,26 @@ const InspectorDeferred = ({
6463
);
6564
};
6665

66+
type ReactDevToolsOverlayDeferredProps = {
67+
inspectedViewRef: InspectedViewRef,
68+
reactDevToolsAgent: ReactDevToolsAgent,
69+
};
70+
71+
const ReactDevToolsOverlayDeferred = ({
72+
inspectedViewRef,
73+
reactDevToolsAgent,
74+
}: ReactDevToolsOverlayDeferredProps) => {
75+
const ReactDevToolsOverlay =
76+
require('../Inspector/ReactDevToolsOverlay').default;
77+
78+
return (
79+
<ReactDevToolsOverlay
80+
inspectedViewRef={inspectedViewRef}
81+
reactDevToolsAgent={reactDevToolsAgent}
82+
/>
83+
);
84+
};
85+
6786
const AppContainer = ({
6887
children,
6988
fabric,
@@ -155,7 +174,7 @@ const AppContainer = ({
155174
<DebuggingOverlay ref={debuggingOverlayRef} />
156175

157176
{reactDevToolsAgent != null && (
158-
<ReactDevToolsOverlay
177+
<ReactDevToolsOverlayDeferred
159178
inspectedViewRef={innerViewRef}
160179
reactDevToolsAgent={reactDevToolsAgent}
161180
/>

0 commit comments

Comments
 (0)