Skip to content

Commit eb71fd5

Browse files
authored
[docs] Remove Remote JavaScript Debugging (facebook#4523)
1 parent a0bbfe6 commit eb71fd5

File tree

2 files changed

+6
-65
lines changed

2 files changed

+6
-65
lines changed

docs/debugging.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ React Native DevTools is only available with the Hermes engine, and requires eit
4747

4848
React Native DevTools replaces the previous Flipper, Experimental Debugger, and Hermes debugger (Chrome) frontends. If you are on an older version of React Native, please go to the docs [for your version](/versions).
4949

50-
We continue to offer legacy debugging methods such as Direct JSC Debugging and Remote JS Debugging (deprecated) (see [Other Debugging Methods](./other-debugging-methods)).
50+
For apps using JavaScriptCore instead of Hermes, Direct JSC Debugging is still available (see [Other Debugging Methods](./other-debugging-methods)).
5151

5252
React Native DevTools is designed for debugging React app concerns, and not to replace native tools. If you want to inspect React Native’s underlying platform layers (for example, while developing a Native Module), please use the debugging tools available in Xcode and Android Studio (see [Debugging Native Code](/docs/next/debugging-native-code)).
5353

docs/other-debugging-methods.md

Lines changed: 5 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -25,71 +25,12 @@ While source maps may not be enabled by default, you can follow [this guide](htt
2525
Every time the app is reloaded, a new JSContext is created. Choosing "Automatically Show Web Inspectors for JSContexts" saves you from having to select the latest JSContext manually.
2626
:::
2727

28-
## Remote JavaScript Debugging (deprecated)
28+
## Remote JavaScript Debugging (removed)
2929

30-
:::warning
31-
Remote JavaScript Debugging is deprecated in React Native 0.73 and will be removed in a future release.
32-
:::
33-
34-
Remote JavaScript Debugging connects an external web browser (Chrome) to your app and runs your JavaScript code inside a web page. This allows you to use Chrome's debugger as you would with any web app. Note that the browser environment can be very different, and not all React Native modules will work when debugging this way.
35-
36-
### Setup
37-
38-
Since React Native 0.73, Remote JavaScript Debugging must be **manually enabled** using the `NativeDevSettings` module.
39-
40-
```js
41-
import NativeDevSettings from 'react-native/Libraries/NativeModules/specs/NativeDevSettings';
42-
43-
function MyApp() {
44-
// Assign this to a dev-only button or useEffect call
45-
const connectToRemoteDebugger = () => {
46-
NativeDevSettings.setIsDebuggingRemotely(true);
47-
};
48-
}
49-
```
50-
51-
When `NativeDevSettings.setIsDebuggingRemotely(true)` is invoked, this will open a new tab at [http://localhost:8081/debugger-ui](http://localhost:8081/debugger-ui).
30+
:::warning Important
31+
Remote JavaScript Debugging has been removed as of React Native 0.79. See the original [deprecation announcement](https://github.com/react-native-community/discussions-and-proposals/discussions/734).
5232

53-
From this page, open Chrome DevTools via:
54-
55-
- View > Developer > Developer Tools
56-
- <kbd>⌥ Option</kbd> + <kbd>Cmd ⌘</kbd> + <kbd>I</kbd> (macOS) / <kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd> (Windows and Linux).
57-
58-
The Console and Sources panels will allow you to inspect your React Native code.
59-
60-
![The remote debugger window in Chrome](/docs/assets/debugging-chrome-remote-debugger.jpg)
61-
62-
:::info
63-
Under Remote JavaScript Debugging, the web version of React DevTools in Chrome will not work with React Native. See the [React Native DevTools](./react-native-devtools) guide to explore how to use React DevTools in our integrated debugger.
33+
If you are on an older version of React Native, please go to the docs [for your version](/versions).
6434
:::
6535

66-
:::note
67-
On Android, if the times between the debugger and device have drifted, things such as animations and event behavior might not work properly. This can be fixed by running ``adb shell "date `date +%m%d%H%M%Y.%S%3N`"``. Root access is required if using a physical device.
68-
:::
69-
70-
### Debugging on a physical device
71-
72-
:::info
73-
If you're using Expo CLI, this is configured for you already.
74-
:::
75-
76-
<Tabs groupId="platform" defaultValue={constants.defaultPlatform} values={constants.platforms} className="pill-tabs">
77-
<TabItem value="ios">
78-
79-
On iOS devices, open the file [`RCTWebSocketExecutor.mm`](https://github.com/facebook/react-native/blob/master/packages/react-native/React/CoreModules/RCTWebSocketExecutor.mm) and change "localhost" to the IP address of your computer.
80-
81-
</TabItem>
82-
<TabItem value="android">
83-
84-
On Android 5.0+ devices connected via USB, you can use the [`adb` command line tool](http://developer.android.com/tools/help/adb.html) to set up port forwarding from the device to your computer:
85-
86-
```sh
87-
adb reverse tcp:8081 tcp:8081
88-
```
89-
90-
</TabItem>
91-
</Tabs>
92-
93-
:::note
94-
If you run into any issues, it may be possible that one of your Chrome extensions is interacting in unexpected ways with the debugger. Try disabling all of your extensions and re-enabling them one-by-one until you find the problematic extension.
95-
:::
36+
![The remote debugger window in Chrome](/docs/assets/debugging-chrome-remote-debugger.jpg)

0 commit comments

Comments
 (0)