0

Pre-story:

Nexus 5X has USB-C to USB-C cable out-of-the-box which is obviously not compatible with USB-A without any addition equipment (USB-C to USB-A cable). Both of the mentioned above cables seem to be quite expensive, and I don't want to buy another cable for the newly purchased phone.

Problem:

I need to debug a website in Chrome on Android device - Nexus 5X - and see what is exactly happening with a page on Chrome on my Mac without USB cable connection. I know that this is possible via port forwarding feature Google Chrome dev-tools has.

The main idea is that I do not need to debug native Android apps so all the suggested steps with adb would not make any sense.

I am able to access web apps running on my localhost Apache web server (device ip address:port number), but I cannot see what's exactly happening on the device screen if something is broken.

Same link suggests that first I need to connect my device via USB to use it afterwards on without the USB and then configure the port forwarding. This means that I need to do connect/disconnect procedure every time I need to debug a website, what does not seem very convenient.

Question:

How can I debug Nexus 5X Android 6.0.1 Chrome app (44.0.2403.133) to my desktop Chrome app (53.0.2785.116 (64-bit)) running on Mac OSX El Capitan? Both devices are on the same network, under the same Google account.

Improve this question

1 Answer 1

Reset to default
0

I have been looking in this problem for the last days and here is what I have found out:

I have connected with Kayce Basques - one of the authors of the Google remote debugging tutorial and he confirmed that there is currently no official way to arrange wireless debugging. Citing his words:

The remote debugging workflow depends on Android's USB Debugging feature.

The other thing what I have looked into was wireless debugging with Genymotion Android emulator. I have made it work. Here is how:

  1. Genymotion Android emulator has native OS images of many devices as I was looking specifically into Nexus 5X 6.0.0 I have just chosen to download this image.
  2. After the image was downloaded I run the image, went to the device settings and enabled USB debugging

Nexus 5X Android 6.0.0 emulator image

  1. After that I fired up the Android native browser and went to the webpage of my interest

Google official webpage opened on the Android emulator

  1. On my Mac Chrome app I have typed chrome://inspect

    Chrome desktop app devices view

  2. Desktop view I have clicked inspect just below the webpage address and got this magic window

Google Chrome devtools

Now I am able to see what is actually happens within the page without connecting an actual Android device. Just for the sake of re-assuring I tested everything on the actual Nexus 5X 6.0.0 and seems to work seamlessly.

Question is still open though, even though you can say that there is a confirmation from Google, I believe there are still hacks or work arounds and I would like to see those.

Improve this answer

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .