1

Problem Starting JS debugging from Expo Go doesn't connect to React Native Debugger, but opens a separate dev tools window instead on Windows 11.

Full description I start React Native Debugger (.exe file, v0.13.0), adjust the port to mach expo (19000) and then run my expo (expo v 6.3.2) app ("npx expo start" followed by "A") on a simulated android device with Expo Go (all on Windows 11). Both expo and RNDebugger are on the same port 19000.

Still, starting the JS debugging from the dev menu (or from the expo console with "J") launches a separate Chrome Dev Tools window (which is also separate from any browser) and doesn't connect to React Native Debugger. Does anyone know why? Can I manually force expo to use React Dev Tools instead?

Possible clue? The devtools always launches as a separate chrome dev tools window for me, as opposed to inside my chrome browser. I don't know if this is connected with the above error.

What I've tried

  1. Restarting everything, including the computer.
  2. Launching expo with this command, as suggested elsewhere: "$env:REACT_DEBUGGER="unset ELECTRON_RUN_AS_NODE; start-process 'rndebugger://set-debugger-loc?host=localhost&port=19000'" npx expo start"
  3. Setting "jsEngine": "jsc" in the expo object in app.json, as suggested in another thread. Gave the error: "No compatible apps connected. JavaScript Debugging can only be used with the Hermes engine."
Ylor
  • 693
  • 1
  • 5
  • 10

1 Answers1

6

Edit: After using the "working" solution below for a while, I noticed sometimes code which worked fine would stop working if the RNDebugger was connected. It seems this is because some expo/react native functionality only works with "jsEngine": "hermes", which seems to be the default. Unfortunately, herems is not supported by RNDebugger at the time of writing. For me this means using RNDebugger is not worth it at the moment, since I can't trust the code behaves the same with and without it.

Working solution for me:
I finally managed to make it work myself using the response of Ahmed-Elswerky in this post. Here is the procedure which helped me.

  1. Add the line "jsEngine": "jsc", inside the "expo" object in app.json.
{
  "expo": {
    (...)
    "jsEngine": "jsc",
  }
  (...)
}
  1. Check if adb (part of Android SDK platform-tools) is on your path, by running "adb version" in PowerShell. If not, add it to your path in your environment variables (default: C:\Users\<YOUR_USERNAME>\AppData\Local\Android\Sdk\platform-tools) and restart PowerShell.
  2. Start your virtual Android device.
  3. In PowerShell, run adb reverse tcp:19000 tcp:19000 (given that 19000 is the port used by expo and RNDebugger)
  4. Start expo (npx expo start)
  5. Start React Native Debugger
  6. Make sure your app is started in Expo Go and reloaded.
  7. Start JS debugging from the developer menu inside Expo Go.
  8. For me, the antivirus reacted and I had to allow it.

I hope this helps someone!

Ylor
  • 693
  • 1
  • 5
  • 10