From 1ac3dab6e55ed3b5ec8d2c2daa4fd3c4c37d8abe Mon Sep 17 00:00:00 2001
From: Alex Hunt <huntie@meta.com>
Date: Mon, 18 Sep 2023 11:18:59 -0700
Subject: [PATCH] Improve "Open Debugger" error guidance (#39521)

Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/39521

Minor Dev Menu changes:

- Improve guidance when failing to connect to the debugger.
- Align "Show Element Inspector" wording on iOS.

Changelog: [Internal]

Reviewed By: blakef

Differential Revision: D49375789

fbshipit-source-id: 092da6cae1a62a1bcc4dc877ab01369db6876741
---
 .../React/CoreModules/RCTDevMenu.mm           | 25 +++++++++++--------
 .../main/res/devsupport/values/strings.xml    |  2 +-
 2 files changed, 15 insertions(+), 12 deletions(-)

diff --git a/packages/react-native/React/CoreModules/RCTDevMenu.mm b/packages/react-native/React/CoreModules/RCTDevMenu.mm
index 4db65d3a910..2154e3ebefc 100644
--- a/packages/react-native/React/CoreModules/RCTDevMenu.mm
+++ b/packages/react-native/React/CoreModules/RCTDevMenu.mm
@@ -261,23 +261,26 @@ RCT_EXPORT_MODULE()
 #if RCT_ENABLE_INSPECTOR
     if (devSettings.isDeviceDebuggingAvailable) {
       // On-device JS debugging (CDP). Render action to open debugger frontend.
-      [items addObject:[RCTDevMenuItem
-                           buttonItemWithTitleBlock:^NSString * {
-                             return @"Open Debugger";
-                           }
-                           handler:^{
-                             [RCTInspectorDevServerHelper
-                                     openDebugger:bundleManager.bundleURL
-                                 withErrorMessage:
-                                     @"Failed to open debugger. Please check that the dev server is running."];
-                           }]];
+      [items
+          addObject:
+              [RCTDevMenuItem
+                  buttonItemWithTitleBlock:^NSString * {
+                    return @"Open Debugger";
+                  }
+                  handler:^{
+                    [RCTInspectorDevServerHelper
+                            openDebugger:bundleManager.bundleURL
+                        withErrorMessage:
+                            @"Failed to open debugger. Please check that the dev server is running and reload the app."];
+                  }]];
     }
 #endif
   }
 
   [items addObject:[RCTDevMenuItem
                        buttonItemWithTitleBlock:^NSString * {
-                         return devSettings.isElementInspectorShown ? @"Hide Inspector" : @"Show Inspector";
+                         return devSettings.isElementInspectorShown ? @"Hide Element Inspector"
+                                                                    : @"Show Element Inspector";
                        }
                        handler:^{
                          [devSettings toggleElementInspector];
diff --git a/packages/react-native/ReactAndroid/src/main/res/devsupport/values/strings.xml b/packages/react-native/ReactAndroid/src/main/res/devsupport/values/strings.xml
index aeecbb6d32a..7ed097b8613 100644
--- a/packages/react-native/ReactAndroid/src/main/res/devsupport/values/strings.xml
+++ b/packages/react-native/ReactAndroid/src/main/res/devsupport/values/strings.xml
@@ -3,7 +3,7 @@
   <string name="catalyst_reload" project="catalyst" translatable="false">Reload</string>
   <string name="catalyst_reload_error" project="catalyst" translatable="false">Failed to load bundle. Try restarting the bundler or reconnecting your device.</string>
   <string name="catalyst_change_bundle_location" project="catalyst" translatable="false">Change Bundle Location</string>
-  <string name="catalyst_open_debugger_error" project="catalyst" translatable="false">Failed to open debugger. Please check that the dev server is running.</string>
+  <string name="catalyst_open_debugger_error" project="catalyst" translatable="false">Failed to open debugger. Please check that the dev server is running and reload the app.</string>
   <string name="catalyst_debug_open" project="catalyst" translatable="false">Open Debugger</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>