The web browser displayed here is actually an Embedded Chrome DevTools Panel
, which can typically be found within your node_modules
.
As stated on this documentation page:
Hermes supports the Chrome debugger by implementing the Chrome
DevTools Protocol. This means Chrome's tools can be used to directly
debug JavaScript running on Hermes, on an emulator or on a physical
device.
In the Hermes Debugger/Expo
tab, it only references Chrome for debugging purposes. However, I have discovered a detailed guide outlining how to set up remote debugging:
- Visit the debugger URL in your browser. For example: http://localhost:8081/debugger-ui
- Open the Console using CMD + Shift + J.
- Press CMD + D on Simulator and choose "Debug JS Remotely".
- Press CMD + R on Simulator.
- Check the Console in the Browser.
Although this method is now deprecated in react-native 0.73, it remains functional on version 0.72.5. It may still run slowly as it continues to rely on chrome for debugging purposes.
If you wish to explore the newer debugging approaches in later versions of react-native, including utilizing Safari for debugging, refer to the steps outlined on this page.
You could also experiment with Flipper
to see if it offers improved speed, but keep in mind that it also utilizes the same chrome Devtools Panel according to the documentation.
https://i.sstatic.net/ZSSyb.png