React-native: [Debugger] Error for newbs trying to debug on-device

[jaygarcia]

I love the idea being able to debug on the phone (it's quite essential, actually). However for newbs doing it for the first time (/me raises hand), we're greeted with the following error:

2015-06-11 16:55:27.840 [error][tid:com.facebook.React.WebSocketExecutor][RCTWebSocketExecutor.m:117] WebSocket connection failed with error Error Domain=NSPOSIXErrorDomain Code=61 "The operation couldn’t be completed. Connection refused"
2015-06-11 16:55:29.802 [error][tid:main][RCTWebSocketExecutor.m:58] Connection to http://localhost:8081/debugger-proxy timed out. Are you running node proxy? If                   you are running on the device, check if you have the right IP                   address in `RCTWebSocketExecutor.m`.

I think it's bad form to ask non-objc devs to edit a class file. There has to be some type of configuration that we can edit outside of a class file buried deep in the depths of a subproject dependency.

Thoughts?

[jaygarcia]

eeeeeh.... :-

Maybe the real issue is "Can this be configured for on-device debugging"?

The following error makes complete and logical sense.

[jaygarcia]

OK, the issue is that i was running from a JS bundle. The docs should state how to get this done properly. Currently there is no mention of updating AppDelegate.m also.

To debug on a real device: Open the file RCTWebSocketExecutor.m and change localhost to the IP address of your computer. Shake the device to open the development menu with the option to start debugging.

Having to update configuration strings in two different places really seems counterintuitive.

I once published the idea of having end-developers update Info.plist. What are your thoughts on leveraging Info.plist for these types of configs?

[jtremback]

IMO, it'd be nice to keep that config in package.json. I hate xcode's point and click configuration stuff. Takes longer, needs to be manually reproduced, and you need to put screenshots in tutorials.

[ide]

The biggest reason to move it into package.json is the write once run everwhere aspect. Android =)

[jaygarcia]

Hell yes. That's even a better solution than what I proposed.

[schickling]

+1

[AlwaysBCoding]

+1 -- it would be super helpful to only have to pass the computer IP address to a single location.

[danieldunderfelt]

Another +1 for package.json!

[ask10000]

+1 for package.json

[elijah-tai]

+1 for package.json!

[idibidiart]

+1111

[gastonmorixe]

+1111

[marinetraffic-zz]

+1

[terran42]

package.json is version controlled, so it's not a place suitable for a local configuration that differs for each developer.

An option to manually set an IP address becomes not very handy when you are switching between different network environments (home/company) and the IP address changes constantly.

The solution I'm using is this:
http://moduscreate.com/automated-ip-configuration-for-react-native-development/

I find it convenient. Would be great to be integrated into react-native master.

[aleclarson]

6362 and #6345 both have a go at fixing this issue

[tarang9211]

When I tap Debug JS Remotely on my iPhone, i get the same error. Where should I be looking to fix this?

[mkonicek]

Hi there! This issue is being closed because it has been inactive for a while.

But don't worry, it will live on with ProductPains! Check out its new home: https://productpains.com/post/react-native/debugger-error-for-newbs-trying-to-debug-on-device

ProductPains helps the community prioritize the most important issues thanks to its voting feature.
It is easy to use - just login with GitHub. GitHub issues have voting too, nevertheless
Product Pains has been very useful in highlighting the top bugs and feature requests:
https://productpains.com/product/react-native?tab=top

Also, if this issue is a bug, please consider sending a pull request with a fix.
We're a small team and rely on the community for bug fixes of issues that don't affect fb apps.