react/packages/react-devtools-shell
James Friend ed023cfc73
[devtools-shell] layout options for testing (#33516)
## Summary

This PR adds a 'Layout' selector to the devtools shell main example, as
well as a resizable split pane, allowing more realistic testing of how
the devtools behaves when used in a vertical or horizontal layout and at
different sizes (e.g. when resizing the Chrome Dev Tools pane).

## How did you test this change?



https://github.com/user-attachments/assets/81179413-7b46-47a9-bc52-4f7ec414e8be
2025-06-13 15:25:04 +01:00
..
src [DevTools] Use Popover API for TraceUpdates highlighting (#32614) 2025-05-07 15:48:17 +01:00
constants.js chore[devtools]: upgrade to webpack v5 (#26887) 2023-06-14 13:15:52 +01:00
e2e-regression.html DevTools] e2e Regression Testing App (#24619) 2022-05-26 11:36:00 -04:00
e2e.html Refactored DevTools test shell for e2e (#22968) 2021-12-15 11:42:59 -05:00
index.html [devtools-shell] layout options for testing (#33516) 2025-06-13 15:25:04 +01:00
multi.html DevTools: Support mulitple DevTools instances per page (#22949) 2021-12-14 12:16:16 -05:00
package.json chore[devtools]: upgrade to webpack v5 (#26887) 2023-06-14 13:15:52 +01:00
perf-regression.html [DevTools] add perf regression test page in shell (#25078) 2023-01-04 17:31:13 -05:00
README.md [devtools] 1st class support of used Thenables (#32989) 2025-04-24 13:46:31 +02:00
webpack-server.js [devtools] 1st class support of used Thenables (#32989) 2025-04-24 13:46:31 +02:00

Harness for testing local changes to the react-devtools-inline and react-devtools-shared packages.

Development

This target should be run in parallel with the react-devtools-inline package. The first step then is to run that target following the instructions in the react-devtools-inline README's local development section.

The test harness can then be run as follows:

cd packages/react-devtools-shell

yarn start

Once you set both up, you can view the test harness with inlined devtools in browser at http://localhost:8080/