Skip to main content
Mobile Testing and Debugging

Mobile Testing and Debugging

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
  • View JavaScript console messages from your desktop
  • Execute JavaScript statements from the development environment and they will appear on the test devices.

Check out Webmonkey‘s article detailing how Adobe Shadow simplifies mobile web testing.

  1. Download the Shadow Desktop client (Windows | Mac)
  2. Download Google Chrome Extension(Google Chrome only)
  3. 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:

  • Does not allow viewing JavaScript files, stepping through scripts and setting debugging breakpoints.
  • 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.

Want to learn more about Saggezza? Consult with an expert here.

Saggezza is a proven technology and consulting partner that delivers personalized, high-value solutions to accelerate business growth.

Share This
Related Articles
The Entrepreneur Series: Nick Daly, Lead Developer

Nick Daly grew up in a small town in the North East of England called East Boldon. He was always […]

Lift Off for 0Gravity Coding Club

NEXT GENERATION tech talent is set to soar in Sunderland, thanks to a newly launched coding club inspired by a […]