Skip to content

Commit 451736b

Browse files
mondaychenmondaychen
authored
[DevTools][BE] move shared types & constants to consolidated locations (#26572)
## Summary This pull request aims to improve the maintainability of the codebase by consolidating types and constants that are shared between the backend and frontend. This consolidation will allow us to maintain backwards compatibility in the frontend in the future. To achieve this, we have moved the shared types and constants to the following blessed files: - react-devtools-shared/src/constants - react-devtools-shared/src/types - react-devtools-shared/src/backend/types - react-devtools-shared/src/backend/NativeStyleEditor/types Please note that the inclusion of NativeStyleEditor in this list is temporary, and we plan to remove it once we have a better plugin system in place. ## How did you test this change? I have tested it by running `yarn flow dom-node`, which reports no errors.
1 parent fec97ec commit 451736b

File tree

19 files changed

+398
-374
lines changed

19 files changed

+398
-374
lines changed

‎packages/react-devtools-core/src/cachedSettings.js‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,10 +7,8 @@
77
* @flow
88
*/
99

10-
import {
11-
type ConsolePatchSettings,
12-
writeConsolePatchSettingsToWindow,
13-
} from 'react-devtools-shared/src/backend/console';
10+
import type {ConsolePatchSettings} from 'react-devtools-shared/src/backend/types';
11+
import {writeConsolePatchSettingsToWindow} from 'react-devtools-shared/src/backend/console';
1412
import {castBool, castBrowserTheme} from 'react-devtools-shared/src/utils';
1513

1614
// Note: all keys should be optional in this type, because users can use newer

‎packages/react-devtools-core/src/standalone.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ import {
3030
__DEBUG__,
3131
LOCAL_STORAGE_DEFAULT_TAB_KEY,
3232
} from 'react-devtools-shared/src/constants';
33-
import {localStorageSetItem} from '../../react-devtools-shared/src/storage';
33+
import {localStorageSetItem} from 'react-devtools-shared/src/storage';
3434

3535
import type {FrontendBridge} from 'react-devtools-shared/src/bridge';
3636
import type {InspectedElement} from 'react-devtools-shared/src/devtools/views/Components/types';

‎packages/react-devtools-extensions/src/main.js‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,6 @@ import {createRoot} from 'react-dom/client';
66
import Bridge from 'react-devtools-shared/src/bridge';
77
import Store from 'react-devtools-shared/src/devtools/store';
88
import {IS_CHROME, IS_EDGE, getBrowserTheme} from './utils';
9-
import {LOCAL_STORAGE_TRACE_UPDATES_ENABLED_KEY} from 'react-devtools-shared/src/constants';
109
import {registerDevToolsEventLogger} from 'react-devtools-shared/src/registerDevToolsEventLogger';
1110
import {
1211
getAppendComponentStack,
@@ -21,7 +20,10 @@ import {
2120
localStorageSetItem,
2221
} from 'react-devtools-shared/src/storage';
2322
import DevTools from 'react-devtools-shared/src/devtools/views/DevTools';
24-
import {__DEBUG__} from 'react-devtools-shared/src/constants';
23+
import {
24+
__DEBUG__,
25+
LOCAL_STORAGE_TRACE_UPDATES_ENABLED_KEY,
26+
} from 'react-devtools-shared/src/constants';
2527
import {logEvent} from 'react-devtools-shared/src/Logger';
2628

2729
const LOCAL_STORAGE_SUPPORTS_PROFILING_KEY =

‎packages/react-devtools-shared/src/backend/agent.js‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ import {
2525
initialize as setupTraceUpdates,
2626
toggleEnabled as setTraceUpdatesEnabled,
2727
} from './views/TraceUpdates';
28-
import {patch as patchConsole, type ConsolePatchSettings} from './console';
28+
import {patch as patchConsole} from './console';
2929
import {currentBridgeProtocol} from 'react-devtools-shared/src/bridge';
3030

3131
import type {BackendBridge} from 'react-devtools-shared/src/bridge';
@@ -37,10 +37,13 @@ import type {
3737
PathMatch,
3838
RendererID,
3939
RendererInterface,
40+
ConsolePatchSettings,
4041
} from './types';
41-
import type {ComponentFilter} from '../types';
42+
import type {
43+
ComponentFilter,
44+
BrowserTheme,
45+
} from 'react-devtools-shared/src/types';
4246
import {isSynchronousXHRSupported} from './utils';
43-
import type {BrowserTheme} from 'react-devtools-shared/src/devtools/views/DevTools';
4447

4548
const debug = (methodName: string, ...args: Array<string>) => {
4649
if (__DEBUG__) {

‎packages/react-devtools-shared/src/backend/console.js‎

Lines changed: 7 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,12 @@
88
*/
99

1010
import type {Fiber} from 'react-reconciler/src/ReactInternalTypes';
11-
import type {CurrentDispatcherRef, ReactRenderer, WorkTagMap} from './types';
12-
import type {BrowserTheme} from 'react-devtools-shared/src/devtools/views/DevTools';
11+
import type {
12+
CurrentDispatcherRef,
13+
ReactRenderer,
14+
WorkTagMap,
15+
ConsolePatchSettings,
16+
} from './types';
1317
import {format, formatWithStyles} from './utils';
1418

1519
import {getInternalReactConstants} from './renderer';
@@ -136,22 +140,14 @@ export function registerRenderer(
136140
}
137141
}
138142

139-
const consoleSettingsRef = {
143+
const consoleSettingsRef: ConsolePatchSettings = {
140144
appendComponentStack: false,
141145
breakOnConsoleErrors: false,
142146
showInlineWarningsAndErrors: false,
143147
hideConsoleLogsInStrictMode: false,
144148
browserTheme: 'dark',
145149
};
146150

147-
export type ConsolePatchSettings = {
148-
appendComponentStack: boolean,
149-
breakOnConsoleErrors: boolean,
150-
showInlineWarningsAndErrors: boolean,
151-
hideConsoleLogsInStrictMode: boolean,
152-
browserTheme: BrowserTheme,
153-
};
154-
155151
// Patches console methods to append component stack for the current fiber.
156152
// Call unpatch() to remove the injected behavior.
157153
export function patch({

‎packages/react-devtools-shared/src/backend/types.js‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,13 @@
77
* @flow
88
*/
99

10+
/**
11+
* WARNING:
12+
* This file contains types that are conceptually related to React internals and
13+
* DevTools backends, but can be passed to frontend via the bridge.
14+
* Be mindful of backwards compatibility when making changes.
15+
*/
16+
1017
import type {ReactContext, Wakeable} from 'shared/ReactTypes';
1118
import type {Source} from 'shared/ReactElementType';
1219
import type {Fiber} from 'react-reconciler/src/ReactInternalTypes';
@@ -17,6 +24,7 @@ import type {
1724
} from 'react-devtools-shared/src/types';
1825
import type {ResolveNativeStyle} from 'react-devtools-shared/src/backend/NativeStyleEditor/setupNativeStyleEditor';
1926
import type {TimelineDataExport} from 'react-devtools-timeline/src/types';
27+
import type {BrowserTheme} from 'react-devtools-shared/src/types';
2028

2129
type BundleType =
2230
| 0 // PROD
@@ -492,3 +500,11 @@ export type DevToolsHook = {
492500

493501
...
494502
};
503+
504+
export type ConsolePatchSettings = {
505+
appendComponentStack: boolean,
506+
breakOnConsoleErrors: boolean,
507+
showInlineWarningsAndErrors: boolean,
508+
hideConsoleLogsInStrictMode: boolean,
509+
browserTheme: BrowserTheme,
510+
};

‎packages/react-devtools-shared/src/bridge.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,9 +15,9 @@ import type {
1515
OwnersList,
1616
ProfilingDataBackend,
1717
RendererID,
18+
ConsolePatchSettings,
1819
} from 'react-devtools-shared/src/backend/types';
1920
import type {StyleAndLayout as StyleAndLayoutPayload} from 'react-devtools-shared/src/backend/NativeStyleEditor/types';
20-
import type {ConsolePatchSettings} from 'react-devtools-shared/src/backend/console';
2121

2222
const BATCH_DURATION = 100;
2323

0 commit comments

Comments
 (0)