Book Image

Firebug 1.5: Editing, Debugging, and Monitoring Web Pages

By : Chandan Luthra, Deepak Mittal
Book Image

Firebug 1.5: Editing, Debugging, and Monitoring Web Pages

By: Chandan Luthra, Deepak Mittal

Overview of this book

<p>With the advent of RIA (Rich Internet Applications), most web pages are driven by a combination of JavaScript, AJAX, CSS, and so on. Web developers and designers find it hard to debug and fix the issues that crop up on the client side. Firebug is a wonderful toolkit to have in your arsenal for handling all such issues. This book covers all of Firebug's features and will help you utilize its capabilities with maximum efficiency. AJAX development and debugging is not one of the easiest tasks; this book explains step-by-step, how to develop and debug AJAX components in your web page in a very easy way, thereby increasing your productivity. Topics like performance tuning of the web page are covered in detail.<br /><br />This book discusses how to become more efficient in various aspects of web development by using Firebug. It is a very easy-to-understand, step-by-step guide that explains all the features of Firebug with concise and simple examples. With this book in hand, you will be able to deal with the painful areas of web development like JavaScript and AJAX debugging using Firebug.<br /><br />The book takes you from the basics of Web Development like editing HTML and CSS on the fly to advanced features like AJAX, JSON, Monitoring, and Performance Tuning of web pages. It assumes that you have some very basic knowledge of HTML and JavaScript. For those of you with a sound knowledge of these technologies, this book can help you increase your productivity by using Firebug effectively, taking full advantage of its rich and powerful features and the console API. Towards the end, the book explains how to create your own powerful extensions for the Firebug community.&nbsp;</p>
Table of Contents (18 chapters)
Firebug 1.5: Editing, Debugging, and Monitoring Web Pages
Credits
About the Authors
About the Reviewers
Preface
Index

Script tab


The Script tab is the next gem that Firebug provides us with. This tab allows us to debug JavaScript code on the browser. We'll not go into the details of debugging JavaScript under this tab because in Chapter 5 we will cover all the details and ways of debugging JavaScript. For now we take an overview of this tab and briefly discuss the features of this tab.

The following can be performed under the Script tab:

  • Viewing the list of JavaScript files that are loaded with our document

  • Debugging the JavaScripts

  • Inserting and removing breakpoints

  • Inserting and removing conditional breakpoints

  • Viewing the stack trace

  • Viewing a list of breakpoints

  • Adding new watch expressions

  • Keeping an eye on the watches for viewing the values of variables

  • Debugging an AJAX call

The next screenshot shows the layout of the Script tab. On the left panel, there is a JavaScript editor for debugging the JavaScript. With the JavaScript editor, we can debug the JavaScript code. In Firebug 1.4.x, an option called "Break...