From 68b4a2f194ce7fe9232d9b79966fa10329b02c31 Mon Sep 17 00:00:00 2001 From: Malachi Gruenhagen <68450431+nurse-the-code@users.noreply.github.com> Date: Wed, 13 Jul 2022 15:45:12 -0400 Subject: [PATCH 1/3] Update debugging.md Clarified and updated instructions on using keyboard shortcuts with MacOS's Simulator app. --- docs/debugging.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/debugging.md b/docs/debugging.md index 67e2944a20a..8c14346bf40 100644 --- a/docs/debugging.md +++ b/docs/debugging.md @@ -19,7 +19,7 @@ Fast Refresh is a React Native feature that allows you to get near-instant feedb ## Enabling Keyboard Shortcuts -React Native supports a few keyboard shortcuts in the iOS Simulator. They are described below. To enable them, open the Hardware menu, select Keyboard, and make sure that "Connect Hardware Keyboard" is checked. +React Native supports a few keyboard shortcuts in the iOS Simulator. They are described below. To enable them on MacOS, inside the Simulator app, open the I/O menu, select Keyboard, and make sure that "Connect Hardware Keyboard" is checked. ## LogBox From 58f4e71038fccb66829a52155e8a241254b58406 Mon Sep 17 00:00:00 2001 From: Malachi Gruenhagen <68450431+nurse-the-code@users.noreply.github.com> Date: Wed, 13 Jul 2022 17:47:24 -0400 Subject: [PATCH 2/3] Update debugging.md Fixed instructions for viewing Safari debug screen when connected to physical device --- docs/debugging.md | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/docs/debugging.md b/docs/debugging.md index 8c14346bf40..8730af1fecc 100644 --- a/docs/debugging.md +++ b/docs/debugging.md @@ -75,8 +75,9 @@ The debugger will receive a list of all project roots, separated by a space. For You can use Safari to debug the iOS version of your app without having to enable "Debug JS Remotely". -- Enable Develop menu in Safari: `Preferences → Advanced → Select "Show Develop menu in menu bar"` -- Select your app's JSContext: `Develop → Simulator → JSContext` +- On a physical device go to: `Settings → Safari → Advanced → Make sure "Web Inspector" is turned on` (This step is not needed on the Simulator) +- On your Mac enable Develop menu in Safari: `Preferences → Advanced → Select "Show Develop menu in menu bar"` +- Select your app's JSContext: `Develop → Simulator (or other device) → JSContext` - Safari's Web Inspector should open which has a Console and a Debugger While sourcemaps may not be enabled by default, you can follow [this guide](http://blog.nparashuram.com/2019/10/debugging-react-native-ios-apps-with.html) or [video](https://www.youtube.com/watch?v=GrGqIIz51k4) to enable them and set break points at the right places in the source code. From 023bab72eecff4756a08cd127e34e8ddef113879 Mon Sep 17 00:00:00 2001 From: Malachi Gruenhagen <68450431+nurse-the-code@users.noreply.github.com> Date: Wed, 13 Jul 2022 18:05:00 -0400 Subject: [PATCH 3/3] Update debugging.md Made "macOS" spelling/formatting consistent. --- docs/debugging.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/debugging.md b/docs/debugging.md index 8730af1fecc..20583c7ee4e 100644 --- a/docs/debugging.md +++ b/docs/debugging.md @@ -7,7 +7,7 @@ import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; import con ## Accessing the In-App Developer Menu -You can access the developer menu by shaking your device or by selecting "Shake Gesture" inside the Hardware menu in the iOS Simulator. You can also use the `⌘D` keyboard shortcut when your app is running in the iOS Simulator, or `⌘M` when running in an Android emulator on Mac OS and `Ctrl+M` on Windows and Linux. Alternatively for Android, you can run the command `adb shell input keyevent 82` to open the dev menu (82 being the Menu key code). +You can access the developer menu by shaking your device or by selecting "Shake Gesture" inside the Hardware menu in the iOS Simulator. You can also use the `⌘D` keyboard shortcut when your app is running in the iOS Simulator, or `⌘M` when running in an Android emulator on macOS and `Ctrl+M` on Windows and Linux. Alternatively for Android, you can run the command `adb shell input keyevent 82` to open the dev menu (82 being the Menu key code). ![](/docs/assets/DeveloperMenu.png) @@ -19,7 +19,7 @@ Fast Refresh is a React Native feature that allows you to get near-instant feedb ## Enabling Keyboard Shortcuts -React Native supports a few keyboard shortcuts in the iOS Simulator. They are described below. To enable them on MacOS, inside the Simulator app, open the I/O menu, select Keyboard, and make sure that "Connect Hardware Keyboard" is checked. +React Native supports a few keyboard shortcuts in the iOS Simulator. They are described below. To enable them on macOS, inside the Simulator app, open the I/O menu, select Keyboard, and make sure that "Connect Hardware Keyboard" is checked. ## LogBox