Any traditional web developer that transitions into the mobile arena will quickly learn that many of the common development tools they take for granted in the web world – are inaccessible on mobile phones. Even someone extremely familiar in the mobile space will need to debug their code on an actual device. No single tool or debugging technique will solve all your debugging needs. Just like traditional web development, a mobile developer needs to rely an entire arsenal of testing tools. Some mobile friendly debugging techniques we commonly use:
- Running Firebug Lite on a tablet. Excellent for some quick debugging, however the interface isn’t ideal for touch devices and isn’t as robust as the full Firebug experience.
- Utilizing “about:debug” in Android native browsers to activate additional debug options.
- Apply some helpful debug overlays using jQuery. Particularly helpful when debugging screen size variations between Android devices.
While these options are great, they lack the convenience of debugging directly in your development environment. Recently, Adobe released a great tool for mobile web app development: Adobe Shadow. Shadow bridges the gap between a traditional web development environment and the mobile space. (Shadow has since matured into Adobe Edge Inspect.)
- Access to WebKit Developer Tools to see the inner workings of a site’s CSS and HTML
- Test on multiple devices all at the same time
- Download the Shadow Desktop client (Windows | Mac)
- Download Google Chrome Extension(Google Chrome only)
- Download Mobile Client, Search for “Adobe Shadow” (App Store |Google Play) (iOS and Android only)
For detailed directions check-out the Adobe Labs site here. While Shadow will ease the pain of mobile testing and development by providing a familiar environment to web developers, there are still a few notable setbacks:
- WebKit Developer Tools loses connection fairly easily.
- WebKit Developer Tools has noticeably slow performance due to remote access.
- Uses a WebKit browser through Adobe Shadow, so testing on non-WebKit mobile browsers such as Dolphin, Opera, native Android is not possible.
For further reading on Adobe Shadow check out these articles and links:
About the Author
Richard Alvarez began his career at Microsoft, during which he wrote his first book on Adobe Flash, which was published by New Riders. He has worked with multiple start-up companies, which has taught him that the digital space is constantly evolving.
Prior to joining Saggezza, Richard helped form Method Engine’s philosophy of strategic design. He worked as lead IT at a small creative agency. During that time, he was key in creating technical solutions, based on consumer driven best practices.
Saggezza is a proven technology and consulting partner that delivers personalized, high-value solutions to accelerate business growth.