Smashing Mobile Web Development

Debugging Tips

When it comes to debugging, mobile apps can be much more difficult than their desktop counterparts:

• Desktop browsers offer comprehensive debugging tools such as Firebug and Chrome’s Developer Tools. Although some mobile browsers provide a certain amount of debugging information, it pales in comparison to what is available in non-mobile browsers.

• Mobile applications typically require a larger number of test cases, due to the wide variety of mobile devices on the market.

In this section, you learn how to set up different mobile testing environments, using both real devices and emulators. You also learn how to set up development tools to get useful debugging information on the fly. Finally, you learn miscellaneous debugging tips that will make your mobile development smoother.

Testing Environments

Most bugs can be recreated in your standard development browser. However, there will inevitably be some bugs that are specific to a certain browser or operating system. In these cases, you need to set up a test environment that closely matches that of the user who filedthe bug.

To comprehensively test a desktop app, you typically need two operating systems (Windows and Mac), a handful of browsers in each (IE, Firefox, Chrome, Safari), and a couple versions of each of those (perhaps the two most recent). While testing 10 or so desktop browsers may seem like a pain, it is a walk in the park compared to responsible mobile testing.

With mobile, you not only need to test a ...