Skip to content

[react-devtools-facade] 4/ multi-root and multi-renderer tests#36599

Open
hoxyq wants to merge 6 commits into
mainfrom
rdt-facade-4-multi-renderer
Open

[react-devtools-facade] 4/ multi-root and multi-renderer tests#36599
hoxyq wants to merge 6 commits into
mainfrom
rdt-facade-4-multi-renderer

Conversation

@hoxyq
Copy link
Copy Markdown
Contributor

@hoxyq hoxyq commented Jun 2, 2026

Stacked on #36598, see this commit.

This PR just adds more tests that validate Facade's implementation against setups with multiple React roots or Renderers.

@meta-cla meta-cla Bot added the CLA Signed label Jun 2, 2026
@react-sizebot
Copy link
Copy Markdown

react-sizebot commented Jun 2, 2026

Comparing: 63e95c2...18d8faa

Critical size changes

Includes critical production bundles, as well as any change greater than 2%:

Name +/- Base Current +/- gzip Base gzip Current gzip
oss-stable/react-dom/cjs/react-dom.production.js = 6.84 kB 6.84 kB = 1.88 kB 1.88 kB
oss-stable/react-dom/cjs/react-dom-client.production.js = 614.26 kB 614.26 kB = 108.57 kB 108.57 kB
oss-experimental/react-dom/cjs/react-dom.production.js = 6.84 kB 6.84 kB = 1.88 kB 1.88 kB
oss-experimental/react-dom/cjs/react-dom-client.production.js = 680.19 kB 680.19 kB = 119.51 kB 119.51 kB
facebook-www/ReactDOM-prod.classic.js = 700.61 kB 700.61 kB = 123.09 kB 123.09 kB
facebook-www/ReactDOM-prod.modern.js = 690.93 kB 690.93 kB = 121.48 kB 121.48 kB

Significant size changes

Includes any change greater than 0.2%:

Expand to show
Name +/- Base Current +/- gzip Base gzip Current gzip
oss-experimental/react-debug-tools/cjs/react-debug-tools.development.js +1.96% 33.37 kB 34.02 kB +1.25% 5.93 kB 6.00 kB
oss-stable-semver/react-debug-tools/cjs/react-debug-tools.development.js +1.96% 33.37 kB 34.02 kB +1.25% 5.93 kB 6.00 kB
oss-stable/react-debug-tools/cjs/react-debug-tools.development.js +1.96% 33.37 kB 34.02 kB +1.25% 5.93 kB 6.00 kB
oss-experimental/react-debug-tools/cjs/react-debug-tools.production.js +1.90% 29.78 kB 30.34 kB +1.26% 5.81 kB 5.88 kB
oss-stable-semver/react-debug-tools/cjs/react-debug-tools.production.js +1.90% 29.78 kB 30.34 kB +1.26% 5.81 kB 5.88 kB
oss-stable/react-debug-tools/cjs/react-debug-tools.production.js +1.90% 29.78 kB 30.34 kB +1.26% 5.81 kB 5.88 kB

Generated by 🚫 dangerJS against 18d8faa

hoxyq added 4 commits June 3, 2026 17:26
inspectHooks/inspectHooksOfFiber default currentDispatcher to
ReactSharedInternals, and shared/ReactSharedInternals imports React — so bundling
them drags all of React in, even for callers that always pass the renderer's
injected dispatcher (e.g. react-devtools-facade).

Extract the shared logic into private inspectHooksImpl / inspectHooksOfFiberImpl,
which require an explicit dispatcher and never reference ReactSharedInternals.
inspectHooks and inspectHooksOfFiber keep their existing behavior as thin
wrappers that supply the ReactSharedInternals default. Add exported
inspectHooksWithoutDefaultDispatcher and
inspectHooksOfFiberWithoutDefaultDispatcher that delegate to the Impls directly,
so a bundle importing only them references no React.
Move getDispatcherRef out of backend/fiber/renderer.js into
backend/shared/DevToolsReactDispatcher.js and import it back. This lets other
consumers (e.g. react-devtools-facade) reuse the renderer-dispatcher adapter
without importing the whole renderer module.
Introduces react-devtools-facade, a private, source-only library of building
blocks for querying React runtime state.

This first commit adds installFacade(target): it installs only
__REACT_DEVTOOLS_GLOBAL_HOOK__ (the global React looks for at init) and returns
a Facade handle {hook, fiberRoots, rendererInternals, profilingState}. It
installs no tool globals — integrators (e.g. a chrome-devtools-mcp package)
compose the Facade into tools and decide what to expose.

Its tests rely on the devtools build/dev setup, so the package is excluded from
the general test runners and runs only under the build-devtools jest project —
matching react-devtools-shared and react-devtools-extensions.

Tool building blocks and a createTools(facade) assembler land in follow-ups.
Adds the component-tree building blocks and the createTools assembler.

createTools(facade) reads the facade's tracked state and returns the tools
object (no globals): getComponentTree, getComponentByLabel, findComponents,
getComponentSource, getOwnersStack, getOwnersBranch. Tools return typed plain
JavaScript values (see DevToolsFacadeTreeTools); serialization is left to the
integration package.

getComponentByLabel includes the component's props and, for function
components, its inspected hooks tree, obtained via react-debug-tools'
inspectHooksOfFiberWithoutDefaultDispatcher with the renderer's injected
dispatcher (normalized by getDispatcherRef), so the facade never falls back to
(and bundles) React's shared internals.
@hoxyq hoxyq changed the title [react-devtools-facade] multi-root and multi-renderer tests [react-devtools-facade] 4/ multi-root and multi-renderer tests Jun 3, 2026
Adds the profiler building blocks to createTools: startProfiling,
stopProfiling, getTraceOverview, getCommitReport. A profiling session records
per-commit render timing (via the hook's onCommit/onPostCommit, wired in the
scaffold commit) and reports per-component actual/self durations, sorted
descending. Tools return typed plain JavaScript values; serialization is left
to the integration package.
@hoxyq hoxyq force-pushed the rdt-facade-4-multi-renderer branch from b797a8e to d421519 Compare June 3, 2026 17:35
Adds cross-cutting tests that exercise the tools across multiple React roots:
- inject() registers additional renderers and initializes their internals
- getComponentTree and findComponents aggregate across roots with globally
  unique labels
- getComponentByLabel resolves labels from any root
- profiling records one commit per root with correctly attributed components

Completes the react-devtools-facade building-block package.
@hoxyq hoxyq force-pushed the rdt-facade-4-multi-renderer branch from d421519 to 18d8faa Compare June 3, 2026 17:42
@hoxyq hoxyq marked this pull request as ready for review June 3, 2026 17:43
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants