Remote debugging with Chrome and Android

As developers, many of you may have encountered the Chrome Developer Tools (CDT)
at one time or another. You may also be aware of the Remote Debugging
functionality which opens up an API and allows you to run the developer tools in another browser. Which, to be
honest I haven't found a use for yet.

What you may not know is that Remote Debugging is also includded in
Android's version of Chrome. This feature allows developers to run CDT in their desktop browser, but for sites
loaded in Chrome on their Android device. This can be a powerful tool for developing responsive and/or mobile web
layouts.

Setup

In order to get things started, first we will need to install the Android SDK. The
installation of which is out of scope for this post but there are some fantastic resources over at the Android
Developer site.

Once you have the android
SDK installed and your device set up, you'll need to
enable remote debugging on the device. This is easilly done by opening Chrome on your android device and fingering
on: Menu > Settings > Developer Tools >
Enable USB Web Debugging.

Connecting to your device

Now that you've set up yout device and environment we need to connect to it. So
plug your device in and issue the command:

$ adb forward tcp:9222 localabstract:chrome_devtools_remote

This tells adb to forward any requests on localhost:9222 to the chrome_devtools_remote port on the android
device.