Chapter 6. Debugging and Testing

More than with any other programming language, the dynamic nature of JavaScript makes it fundamental to have the proper tools, in order to increase the quality of our applications. This chapter will provide an introduction to three very important tools used for debugging of mobile JavaScript applications: the WebKit Web Inspector, iWebInspector, and Adobe Shadow.

We are also going to see different techniques for testing your mobile applications. Of course, “testing” is a rather large concept, and it would be foolish to pretend that this short guide will give you a complete panorama of testing mobile web apps, but that is why this chapter is not called “Quality Assurance.” However, simple testing techniques will allow you and your team to increase your productivity, providing working code in time and schedule.

Your Browser Web Inspector

The first tool that will be used to debug mobile web applications is the Web Inspector that ships natively with most modern browsers these days. It is a very powerful tool, originally inspired by the famous Firebug plug-in for Firefox by Joe Hewitt. These days, the WebKit Web Inspector, Opera DragonFly, or the Internet Explorer Developer Tools all allow you to perform the following functions:

  • Inspect the HTML structure of the current web page, including all elements that are generated dynamically (this is specially handy in the case of Sencha Touch, which generates HTML elements on the fly).

  • Set breakpoints in your JavaScript ...

Get Mobile JavaScript Application Development now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.