Add support for debugging on native iOS devices (over USB)

[cjam]

About

In react native, this library works great when running on a simulator as localhost will resolve to the host running the packager. However, when running on an actual iOS device, the hostname needs to be the IP Address of the machine running the packager. This can be retrieved through:

import { NativeModules } from 'react-native';
const scriptUrl = NativeModules.SourceCode.scriptURL;

However, there are no options to add the host name into these devtools since by default the native will use localhost:

https://github.com/FormidableLabs/urql-devtools-exchange/blob/3c61033465cd4e40430b6b224f750d332de86532/src/utils/messaging.ts#L21-L30

[andyrichardson]

Hey @cjam thanks for the issue report!

There's definitely room for improvement in terms of how we set up communication between a physical device and a running devtools instance. I'm not sure what the best route is to take but we've been considering using CDP - we're open to discussion and contributions if this is something you want to get involved with.

For now, we're probably only going to support high level messaging protocols (i.e. websocket w/ reverse tunnelling, CDP, etc) to avoid having an influx of bug reports related to networking problems.

[cjam]

Thanks for the quick response @andyrichardson. CDP, sounds interesting. For now, I've just got the app running in the simulator, but sometimes it's nice to run it on a physical device.

What would the developer flow / experience look like for using CDP? Start up the urlq-devtools app and then put your native app into debug mode? Would it interfere with being able to have a debugger attached at the same time? I tend to use vscode for debugging, would it be possible to be running both at once?

[andyrichardson]

sometimes it's nice to run it on a physical device

I hear you - I've updated the issue title to encapsulate this issue 👍

What would the developer flow / experience look like for using CDP

Good question, from a devtools perspective, it looks like there would be an inversion of control (i.e. socket server lives on device). For native Android devices, it again looks to be pretty straight forward but for IOS, not so much.

I'm fairly confident the react-native team have solved this problem (bidirectional messing to native devices over USB) but some time needs to be spent looking into how they achieve that.