Files
react-native/packages/debugger-shell
Moti Zilberman adf1b62c76 Normalise shell name/version strings, add commit hash when prebuilt (#53480)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/53480

Changelog: [Internal]

Improves the way `--version` and the User-Agent header work in `debugger-shell`.

* The same app name and version string format will be used across the `dev` and `prebuilt` flavours. Previously, `dev` would report itself as being `Electron v37.2.6` while `prebuilt` would report `react-native/debugger-shell v0.82.0-main`.
* `prebuilt` now also reports the original Meta-internal commit hash as a suffix `-rFBS..........` added to the semver string taken from `package.json`, while `dev` will have a `-dev` suffix in the same place.
  * We do **not** modify the version in `package.json` during the build, nor do we pass the commit hash to `electron/packager`, because this would impose inconvenient platform-specific restrictions on the version string's format.

Reviewed By: huntie

Differential Revision: D81120181

fbshipit-source-id: e730dd35da78dfbb8de326f9a3ab76b747fdb0b3
2025-08-27 11:05:02 -07:00
..
2025-08-26 03:43:22 -07:00

@react-native/debugger-shell

npm package

Experimental Electron-based shell for React Native DevTools. This package is not part of React Native's public API.

Why Electron?

The React Native DevTools frontend is based on Chrome DevTools, which is a web app, but is not particularly portable: it's designed to run in Chromium, and Chromium only. Prior to @react-native/debugger-shell, we would run it in hosted mode in an instance of Chrome or Edge.

Relying on hosted mode presents a variety of UX issues in the debugging workflow, such as the need to ask developers to install a particular browser before they can debug in React Native, and the inability to foreground/reuse existing debugger windows when relaunching the debugger for the same app. In order to address these issues effectively, we fundamentally need to leave the browser sandbox and run the debugger in a shell we can bundle with React Native, and whose behavior we can control.

Electron is a tried-and-tested framework for the specific task of embedding a Chromium browser in a portable, customized shell. As a rule we'll hold a high bar for performance and reliability, and we'll only add features to the shell if they are strictly necessary to complement the DevTools frontend's built-in capabilities.