94

Steps to Reproduce / Screenshots

Apply all operations from the instruction:

  1. Create a blank React Native project with $ react-native init [project name].

  2. From the command Palette (Cmd-Shift-P), choose "Nuclide React Native: Start Packager" to start the React Native Server.

  3. After starting the server, you can prime the React Native Debugger for when the application begins running. From the command Palette (Cmd-Shift-P), launch "Nuclide React Native: Start Debugging".

  4. Ensure that you are in the root directory of the React Native project, then run the application from the command-line: $ react-native run-ios (or choose another existing simulator, for example, react-native run-ios --simulator="iPhone4s").

(Important: #4 should follow AFTER #3, and chrome debugger should be closed).

  1. From the iOS simulator, press Cmd-D (Ctrl-D on Linux). This will bring up the debug options for your application. For example, select Debug JS Remotely.

Environment

  • Atom version 1.15.0
  • Nuclide plugin version 0.214.0
  • React Native version: 0.42.3
  • Platform(s) (iOS, Android, or both?): iOS
  • Device info Simulator/Device? - Simulator iOS 10.2 / iOS 8.1
  • OS version? - MacOS 10.12.3
  • Debug/Release? - Debug

In the same doc said: "...After you enable debugging (#5) from the simulated application, Nuclide will attach to that debugging process automatically since we primed the Debugger above (#3)." So before I clicked Debug JS Remotely I saw the working react app as expected:

working react app

And after I clicked Debug JS Remotely I see that the Nuclide debugger changed its status from Starting debugger... to The debuggee is currently running. as expected as well:

The debuggee is currently running

BUT after I click Debug JS Remotely I see white screen only

white screen

And there are no errors. As soon as I turn off remote debugging, everything loads fine again.

This happens with Nuclide debugger only, with chrome debugger, everything works well.

Kofi
  • 1,224
  • 1
  • 10
  • 21
Stich
  • 2,331
  • 1
  • 15
  • 31
  • Although [here](http://stackoverflow.com/questions/40539806/react-native-debug-js-remotely-white-screen-on-ios) described that the problem is only on the real device, not in the simulator and I tried this trick in my case (made changes in "AppDelegate.m") but the issue with white screen still remains. – Stich Apr 01 '17 at 09:26
  • Have you tried skipping step 2 so that the it uses the standard react-native packager? (regular packager will be launched in step 4 automatically) – ostergaard Apr 02 '17 at 06:36
  • @ostergaard yes, I see the same white screen with standard react-native packager + Nuclide debugger as well – Stich Apr 02 '17 at 09:54
  • Happen to me as well. When I am using Nuclide the debugger can't connect to process. Remote debugging when using Android simulator works fine. Atom: 1.16.0 Xcode: 8.3.1 Android Studio: 2.3 RN: 0.42.0 – b-asaf Apr 20 '17 at 13:55
  • Could you please type the same here https://github.com/facebook/nuclide/issues/1080? Thanks. – Stich Apr 26 '17 at 12:59
  • same here, any solution? – Tommaso Resti Jun 13 '17 at 14:46
  • @TommasoResti @Stich I was facing a similar issue, the blank white screen, just without Nuclide, and figured it out by running `react-native log-ios` in a separate Terminal tab. For me the problem had to do with the http request to get the js bundle file being prevented: `App Transport Security has blocked a cleartext HTTP (http://) resource load since it is insecure. Temporary exceptions can be configured via your app’s Info.plist file` – Pat Needham Jul 07 '17 at 18:01
  • Does your app crash or show errors or warnings without the Debug mode? – Pierre Janineh Jan 10 '22 at 08:32

1 Answers1

1

check maybe there is no breakage in your code. it sometimes happens when you skip some minor errors.

Paul
  • 11
  • 2