mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Remove remote debugging from dev menu (#36754)
Summary:
This PR proposes the removal of the ability to use remote JS debugging (a.k.a Chrome Debugging) from the DevMenu.
This change has been suggested previously on the contributor's Discord server and it is motivated by the fact that generally speaking, this feature does not work with the new architecture and most of the popular modules these days. The remote JS debugging is basically broken if you use Turbo Modules, Fabric, or sync native module calls.
People tend to assume that if something is part of the dev tools UI, it is going to work reliably. However, when it comes to remote debugging using JSC that's increasingly unlikely to be the case. Having it continue to exist as an option has created some confusion, or at least that's what we've seen within the Expo community.
### How to manually enable remote debugging
If your project depends on remote debugging, you can still enable it manually through the `NativeDevSettings`. E.g.
```jsx
import NativeDevSettings from 'react-native/Libraries/NativeModules/specs/NativeDevSettings';
export default function App() {
return (
<Button
title="Enable remote debugging"
onPress={() => NativeDevSettings.setIsDebuggingRemotely(!true)}
/>
);
}
```
### Next steps
Once this has been released and we are sure that this doesn't cause a lot of problems for people we can remove the ability entirely in a follow-up PR
## Changelog:
[General] [Removed] - Remove remote debugging from the dev menu
Pull Request resolved: https://github.com/facebook/react-native/pull/36754
Test Plan:
Locally run rn-tester using JSC on Android and iOS and open the dev menu
<table>
<tr><th>iOS</th><th>Android</th></tr>
<tr>
<td>
<img src="https://user-images.githubusercontent.com/11707729/229229079-03f98eed-0765-4cc8-b972-0c4ff041b611.png" />
</td>
<td>
<img src="https://user-images.githubusercontent.com/11707729/229229103-b57e8fd2-9aca-4780-8a8f-0fd5b2e53590.png" />
</td>
</tr>
</table>
Reviewed By: christophpurrer
Differential Revision: D45278061
Pulled By: huntie
fbshipit-source-id: 842c33102cd34730c14acece8e318cb263e5c9e5
This commit is contained in:
committed by
Facebook GitHub Bot
parent
f92d438649
commit
28e1ca9873
@@ -284,46 +284,8 @@ RCT_EXPORT_MODULE()
|
||||
withBundleURL:bundleManager.bundleURL
|
||||
withErrorMessage:@"Failed to open Flipper. Please check that Metro is running."];
|
||||
}]];
|
||||
} else if (devSettings.isRemoteDebuggingAvailable) {
|
||||
#else
|
||||
if (devSettings.isRemoteDebuggingAvailable) {
|
||||
#endif
|
||||
// For remote debugging, we open up Chrome running the app in a web worker.
|
||||
// Note that this requires async communication, which will not work for Turbo Modules.
|
||||
[items addObject:[RCTDevMenuItem
|
||||
buttonItemWithTitleBlock:^NSString * {
|
||||
return devSettings.isDebuggingRemotely ? @"Stop Debugging" : @"Debug with Chrome";
|
||||
}
|
||||
handler:^{
|
||||
devSettings.isDebuggingRemotely = !devSettings.isDebuggingRemotely;
|
||||
}]];
|
||||
} else {
|
||||
// If neither are available, we're defaulting to a message that tells you about remote debugging.
|
||||
[items
|
||||
addObject:[RCTDevMenuItem
|
||||
buttonItemWithTitle:@"Debugger Unavailable"
|
||||
handler:^{
|
||||
NSString *message = RCTTurboModuleEnabled()
|
||||
? @"Debugging with Chrome is not supported when TurboModules are enabled."
|
||||
: @"Include the RCTWebSocket library to enable JavaScript debugging.";
|
||||
UIAlertController *alertController =
|
||||
[UIAlertController alertControllerWithTitle:@"Debugger Unavailable"
|
||||
message:message
|
||||
preferredStyle:UIAlertControllerStyleAlert];
|
||||
__weak __typeof__(alertController) weakAlertController = alertController;
|
||||
[alertController
|
||||
addAction:[UIAlertAction actionWithTitle:@"OK"
|
||||
style:UIAlertActionStyleDefault
|
||||
handler:^(__unused UIAlertAction *action) {
|
||||
[weakAlertController
|
||||
dismissViewControllerAnimated:YES
|
||||
completion:nil];
|
||||
}]];
|
||||
[RCTPresentedViewController() presentViewController:alertController
|
||||
animated:YES
|
||||
completion:NULL];
|
||||
}]];
|
||||
}
|
||||
#endif
|
||||
}
|
||||
|
||||
[items addObject:[RCTDevMenuItem
|
||||
|
||||
-16
@@ -115,22 +115,6 @@ public final class BridgeDevSupportManager extends DevSupportManagerBase {
|
||||
toggleJSSamplingProfiler();
|
||||
}
|
||||
});
|
||||
|
||||
if (!getDevSettings().isDeviceDebugEnabled()) {
|
||||
// For remote debugging, we open up Chrome running the app in a web worker.
|
||||
// Note that this requires async communication, which will not work for Turbo Modules.
|
||||
addCustomDevOption(
|
||||
getDevSettings().isRemoteJSDebugEnabled()
|
||||
? applicationContext.getString(com.facebook.react.R.string.catalyst_debug_stop)
|
||||
: applicationContext.getString(com.facebook.react.R.string.catalyst_debug),
|
||||
new DevOptionHandler() {
|
||||
@Override
|
||||
public void onOptionSelected() {
|
||||
getDevSettings().setRemoteJSDebugEnabled(!getDevSettings().isRemoteJSDebugEnabled());
|
||||
handleReloadJS();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
public DevLoadingViewManager getDevLoadingViewManager() {
|
||||
|
||||
@@ -6,12 +6,8 @@
|
||||
<string name="catalyst_open_flipper_error" project="catalyst" translatable="false">Failed to open Flipper. Please check that Metro is running.</string>
|
||||
<string name="catalyst_devtools_open" project="catalyst" translatable="false">Open React DevTools</string>
|
||||
<string name="catalyst_debug_open" project="catalyst" translatable="false">Open Debugger</string>
|
||||
<string name="catalyst_debug" project="catalyst" translatable="false">Debug</string>
|
||||
<string name="catalyst_debug_stop" project="catalyst" translatable="false">Stop Debugging</string>
|
||||
<string name="catalyst_debug_connecting" project="catalyst" translatable="false">Connecting to debugger...</string>
|
||||
<string name="catalyst_debug_error" project="catalyst" translatable="false">Failed to connect to debugger!</string>
|
||||
<string name="catalyst_debug_chrome" project="catalyst" translatable="false">Debug with Chrome</string>
|
||||
<string name="catalyst_debug_chrome_stop" project="catalyst" translatable="false">Stop Chrome Debugging</string>
|
||||
<string name="catalyst_hot_reloading" project="catalyst" translatable="false">Enable Fast Refresh</string>
|
||||
<string name="catalyst_hot_reloading_stop" project="catalyst" translatable="false">Disable Fast Refresh</string>
|
||||
<string name="catalyst_hot_reloading_auto_disable" project="catalyst" translatable="false">Disabling Fast Refresh because it requires a development bundle.</string>
|
||||
|
||||
Reference in New Issue
Block a user