24

On React-Native, how can I know if "Debug JS Remotely" is enabled?

I tried looking in RN docs and various NPM packages, but couldn't find out how...

7 Answers 7

15

How to programmatically check if remote debugging is enabled (just found this peculiar behaviour today on another SO question). Tested on RN 0.43 and with Chrome debugger + React Native Debugger :

const isDebuggingEnabled = (typeof atob !== 'undefined');

Edit: just noticed this was asked over half a year ago :D... well, I leave it here for future generations.

1
  • If you are using react-native-web isDebuggingEnabled will always be true 👎
    – n1ru4l
    Dec 19, 2018 at 20:03
10

A class DedicatedWorkerGlobalScope exists iff remote debugging is enabled (it is the constructor of global object in that case). Thus we can:

const haveRemoteDev = (typeof DedicatedWorkerGlobalScope) !== 'undefined';
0
8

You can check global.nativeCallSyncHook

if (!global.nativeCallSyncHook) {
  console.log("Debug JS Remotely")
}

see more at: https://github.com/facebook/react-native/commit/417e191a1cfd6a049d1d4b0a511f87aa7f176082

6

Ran across this answer, but wasn't happy with checking for atob or being constrained to android. I found a function that appears to be a pretty good proxy for if the debugger is running, which is a global called __REMOTEDEV__.

In my case, I wanted to see requests made by the app in react-native-debugger, my full code is as follows:

/**
 * When the debugger is connected, remove the XHR polyfill
 * so that the chrome inspector will be able to see requests
 */
if (typeof global.__REMOTEDEV__ !== 'undefined') {
  const _XHR = GLOBAL.originalXMLHttpRequest ?
      GLOBAL.originalXMLHttpRequest :
      GLOBAL.XMLHttpRequest;

  global.XMLHttpRequest = _XHR;
}
2
  • 6
    global.__REMOTEDEV__ is undefined even in debug mode. Sep 1, 2017 at 12:16
  • not working in RN 0.55 / Chrome 66 :( not sure when they changed it
    – Jokester
    May 16, 2018 at 18:15
6

Check __REMOTEDEV__ in a simple way:

if(global.__REMOTEDEV__) { console.log('Remote Debug'); }
1

So, any of the following answers didn't work for me...

I found out that the location pathname changes to /debugger-ui on global object:

if (global.location && global.location.pathname.includes('/debugger-ui')) {
  Alert.alert('Remote debug is on');
} else {
  Alert.alert('Remote debug is off');
}

Working on RN 0.59.

1
  • Not sure why other answers have many upvotes and your has 0, it is indeed the only one working for me on RN 0.63
    – gbalduzzi
    May 7, 2021 at 9:45
0

For Android, in the a shared preferences you can find the remote debug status. When I open the sharedPreferences file for my app.

Remote debug active

<map>
    <boolean name="remote_js_debug" value="true" />
    <boolean name="hot_module_replacement" value="true" />
    <boolean name="reload_on_js_change" value="true" />
</map>

Remote debug inactive

<map>
    <boolean name="remote_js_debug" value="false" />
    <boolean name="hot_module_replacement" value="true" />
    <boolean name="reload_on_js_change" value="true" />
</map>

So (Android only), you can use a module like this one : https://github.com/sriraman/react-native-shared-preferences to check if the remote debug is active.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.