Testing your websites on mobile devices can be a big pain for many reasons. One of those reasons is the fact that there just aren’t enough good developer tools for mobile browsers such as Firebug or the Webkit Inspector. Well, it’s a good job that Adobe is still trying to get into our mobile good-books since killing Flash, because they have released Adobe Shadow to help us out with our mobile development.
Adobe Shadow essentially allows you to use your Chrome Webkit Inspector on your iOS Safari or Android browser, giving you a lot more insight into those mobile specific bugs. It works by syncing your desktop Chrome browser with your iPhone or Android device and makes a remote connection with the Inspector.
It works pretty well but the setup takes a while because it requires you to install Adobe Shadow on 3 different things:
- The Adobe Shadow Chrome plugin
- The Adobe Shadow “Helper” app for your Mac or PC
- The Adobe Shadow app for your iOS or Android device.
After you’ve installed everything you have to pair your Chrome browser with your mobile device by turning everything on and exchanging a few passcodes between the devices.
Once you have it all connected you can open the remote Inspector in Chrome to inspect the site on your mobile device. It’s kinda cool to see the site sections highlight on the mobile device as you inspect the code on your desktop.
I don’t think it’s an essential tool, but I recommend at least giving it a try. It might just come in handy when you’re experiencing one of those mobile issues and you need that little bit of extra insight into the code.