react/packages/react-devtools-extensions
Ruslan Lesiutin 3cde211b0c
React DevTools 7.0.0 -> 7.0.1 (#34926)
Full list of changes:

* Text layout fixes for stack traces with badges
([eps1lon](https://github.com/eps1lon) in
[#34925](https://github.com/facebook/react/pull/34925))
* chore: read from build/COMMIT_SHA fle as fallback for commit hash
([hoxyq](https://github.com/hoxyq) in
[#34915](https://github.com/facebook/react/pull/34915))
* fix: dont ship source maps for css in prod builds
([hoxyq](https://github.com/hoxyq) in
[#34913](https://github.com/facebook/react/pull/34913))
* Lower case "rsc stream" debug info
([sebmarkbage](https://github.com/sebmarkbage) in
[#34921](https://github.com/facebook/react/pull/34921))
* BuiltInCallSite should have padding-left
([sebmarkbage](https://github.com/sebmarkbage) in
[#34922](https://github.com/facebook/react/pull/34922))
* Show the Suspense boundary name in the rect if there's no overlap
([sebmarkbage](https://github.com/sebmarkbage) in
[#34918](https://github.com/facebook/react/pull/34918))
* Don't attach filtered IO to grandparent Suspense
([eps1lon](https://github.com/eps1lon) in
[#34916](https://github.com/facebook/react/pull/34916))
* Infer name from stack if it's the generic "lazy" name
([sebmarkbage](https://github.com/sebmarkbage) in
[#34907](https://github.com/facebook/react/pull/34907))
* Use same Suspense naming heuristics when reconnecting
([eps1lon](https://github.com/eps1lon) in
[#34898](https://github.com/facebook/react/pull/34898))
* Assign a different color and label based on environment
([sebmarkbage](https://github.com/sebmarkbage) in
[#34893](https://github.com/facebook/react/pull/34893))
* Compute environment names for the timeline
([sebmarkbage](https://github.com/sebmarkbage) in
[#34892](https://github.com/facebook/react/pull/34892))
* Don't highlight the root rect if no roots has unique suspenders
([sebmarkbage](https://github.com/sebmarkbage) in
[#34885](https://github.com/facebook/react/pull/34885))
* Highlight the rect when the corresponding timeline bean is hovered
([sebmarkbage](https://github.com/sebmarkbage) in
[#34881](https://github.com/facebook/react/pull/34881))
* Repeat the "name" if there's no short description in groups
([sebmarkbage](https://github.com/sebmarkbage) in
[#34894](https://github.com/facebook/react/pull/34894))
* Tweak the rects design and create multi-environment color scheme
([sebmarkbage](https://github.com/sebmarkbage) in
[#34880](https://github.com/facebook/react/pull/34880))
* Adjust the rects size by one pixel smaller
([sebmarkbage](https://github.com/sebmarkbage) in
[#34876](https://github.com/facebook/react/pull/34876))
* Remove steps title from scrubber
([sebmarkbage](https://github.com/sebmarkbage) in
[#34878](https://github.com/facebook/react/pull/34878))
* Include some sub-pixel precision in rects
([sebmarkbage](https://github.com/sebmarkbage) in
[#34873](https://github.com/facebook/react/pull/34873))
* Don't pluralize if already plural
([sebmarkbage](https://github.com/sebmarkbage) in
[#34870](https://github.com/facebook/react/pull/34870))
* Don't try to load anonymous or empty urls
([sebmarkbage](https://github.com/sebmarkbage) in
[#34869](https://github.com/facebook/react/pull/34869))
* Add inspection button to Suspense tab
([sebmarkbage](https://github.com/sebmarkbage) in
[#34867](https://github.com/facebook/react/pull/34867))
* Don't select on hover ([sebmarkbage](https://github.com/sebmarkbage)
in [#34860](https://github.com/facebook/react/pull/34860))
* Don't highlight on timeline
([sebmarkbage](https://github.com/sebmarkbage) in
[#34861](https://github.com/facebook/react/pull/34861))
* The bridge event types should only be defined in one direction
([sebmarkbage](https://github.com/sebmarkbage) in
[#34859](https://github.com/facebook/react/pull/34859))
* Attempt at a better "unique suspender" text
([sebmarkbage](https://github.com/sebmarkbage) in
[#34854](https://github.com/facebook/react/pull/34854))
* Track whether a boundary is currently suspended and make transparent
([sebmarkbage](https://github.com/sebmarkbage) in
[#34853](https://github.com/facebook/react/pull/34853))
* Don't hide overflow rectangles
([sebmarkbage](https://github.com/sebmarkbage) in
[#34852](https://github.com/facebook/react/pull/34852))
* Measure text nodes ([sebmarkbage](https://github.com/sebmarkbage) in
[#34851](https://github.com/facebook/react/pull/34851))
* Don't measure fallbacks when suspended
([sebmarkbage](https://github.com/sebmarkbage) in
[#34850](https://github.com/facebook/react/pull/34850))
* Filter out built-in stack frames
([sebmarkbage](https://github.com/sebmarkbage) in
[#34828](https://github.com/facebook/react/pull/34828))
* Exclude Suspense boundaries in hidden Activity
([eps1lon](https://github.com/eps1lon) in
[#34756](https://github.com/facebook/react/pull/34756))
* Group consecutive suspended by rows by the same name
([sebmarkbage](https://github.com/sebmarkbage) in
[#34830](https://github.com/facebook/react/pull/34830))
* Preserve the original index when sorting suspended by
([sebmarkbage](https://github.com/sebmarkbage) in
[#34829](https://github.com/facebook/react/pull/34829))
* Don't show the root as being non-compliant
([sebmarkbage](https://github.com/sebmarkbage) in
[#34827](https://github.com/facebook/react/pull/34827))
* Ignore suspense boundaries, without visual representation, in the
timeline ([sebmarkbage](https://github.com/sebmarkbage) in
[#34824](https://github.com/facebook/react/pull/34824))
* Explicitly say which id to scroll to and only once
([sebmarkbage](https://github.com/sebmarkbage) in
[#34823](https://github.com/facebook/react/pull/34823))
* devtools: fix ellipsis truncation for key values
([sophiebits](https://github.com/sophiebits) in
[#34796](https://github.com/facebook/react/pull/34796))
* fix(devtools): remove duplicated "Display density" field in General
settings ([Anatole-Godard](https://github.com/Anatole-Godard) in
[#34792](https://github.com/facebook/react/pull/34792))
* Gate SuspenseTab ([hoxyq](https://github.com/hoxyq) in
[#34754](https://github.com/facebook/react/pull/34754))
* Release `<ViewTransition />` to Canary
([eps1lon](https://github.com/eps1lon) in
[#34712](https://github.com/facebook/react/pull/34712))
2025-10-20 18:39:28 +01:00
..
.circleci Reorganized things again into packages 2019-08-13 11:37:25 -07:00
chrome React DevTools 7.0.0 -> 7.0.1 (#34926) 2025-10-20 18:39:28 +01:00
edge React DevTools 7.0.0 -> 7.0.1 (#34926) 2025-10-20 18:39:28 +01:00
firefox React DevTools 7.0.0 -> 7.0.1 (#34926) 2025-10-20 18:39:28 +01:00
flow-typed lint: enable reportUnusedDisableDirectives and remove unused suppressions (#28721) 2024-06-21 12:24:32 -04:00
icons Optimized DevTools extension images 2021-08-02 09:32:46 -04:00
popups feat[devtools/extension]: show disclaimer when page doesnt run react and refactor react polling logic (#27373) 2023-09-20 13:30:50 +01:00
src [DevTools] fix: dont ship source maps for css in prod builds (#34913) 2025-10-20 13:39:42 +01:00
build.js [DevTools] Use a single Webpack config for the extensions (#34513) 2025-09-17 15:45:25 +02:00
deploy.chrome.html Fixed a bunch of Lint issues 2019-08-13 21:59:07 -07:00
deploy.edge.html React developer tools extension for Microsoft Edge (#18041) 2020-02-18 09:40:30 -08:00
deploy.firefox.html Fixed a bunch of Lint issues 2019-08-13 21:59:07 -07:00
deploy.html make link https (#19147) 2020-06-30 12:43:52 +01:00
deploy.js Added windows powershell syntax to build scripts (#27692) 2023-11-16 11:35:43 +00:00
improveImages.mjs [DevTools] Optimize Images yarn command (part 2) (#21968) 2021-08-02 09:32:17 -04:00
main.html Fixed a bunch of Lint issues 2019-08-13 21:59:07 -07:00
package.json [DevTools] Switch sourcemap-codec dependency (#34569) 2025-09-24 06:11:53 -07:00
panel.html feat[devtools/extension]: show disclaimer when page doesnt run react and refactor react polling logic (#27373) 2023-09-20 13:30:50 +01:00
README.md Include install command for devtools-extension build instructions (#25053) 2022-10-05 11:27:09 -04:00
utils.js [DevTools] chore: read from build/COMMIT_SHA fle as fallback for commit hash (#34915) 2025-10-20 16:14:47 +01:00
webpack.config.js [DevTools] fix: dont ship source maps for css in prod builds (#34913) 2025-10-20 13:39:42 +01:00

This is the source code for the React DevTools browser extension.

Installation

The easiest way to install this extension is as a browser add-on:

Local development

You can also build and install this extension from source.

Prerequisite steps

DevTools depends on local versions of several NPM packages1 also in this workspace. You'll need to either build or download those packages first.

1 Note that at this time, an experimental build is required because DevTools depends on the createRoot API.

To install all necessary dependencies, run the following command from the root of the repository:

yarn install

Build from source

To build dependencies from source, run the following command from the root of the repository:

yarn build-for-devtools

Download from CI

To use the latest build from CI, run the following commands starting from the root of the repository:

cd scripts/release
yarn install
./download-experimental-build.js

Build steps

Once the above packages have been built or downloaded, you can build the extension by running:

cd packages/react-devtools-extensions/

yarn build:chrome # => packages/react-devtools-extensions/chrome/build
yarn run test:chrome # Test Chrome extension

yarn build:firefox # => packages/react-devtools-extensions/firefox/build
yarn run test:firefox # Test Firefox extension

yarn build:edge # => packages/react-devtools-extensions/edge/build
yarn run test:edge # Test Edge extension