Firebug, The Future of Javascript debugging with Firefox
Would you agree that the next generation of the Firebug Firefox extension is revolutionary ? The new Firebug 0.4, which is still under tests include many interesting features, will make debugging of Javascript applications more fun and easy. The new version will be mainly marked by the advanced javascript debugger, with breakpoints, then there is the new console log API. For example rather than having tons of alerts this is very practical to use :
What is interesting is that you can even use variable inside the log method similar to printf method
There is more colorful debug message that you can use and give you something like :
If you want to check the performance of a process you can use the Firebug timer, and this will be useful to have an idea about the execution time and help detecting resources consuming issues more easily.
Assertion are also available in the new API for example
There is another variant which is the assertEqual which accept a personalized message :
There is more great new features such :
Command line
- Command line evaluation now happens in the context of the window, so you can use syntax like "var a = 42;" to set global variables
- The command line history remembers what you were typing if you hit up and then down again
- Functions like $() from Prototype are no longer overridden by the FireBug equivalent
Inspector
- In the DOM tab, you can expand array objects to show their items
- In the DOM tab, you can expand function objects to show their source
- In the DOM tab, long strings are truncated
- In the DOM tab, you can expand array long strings to show their full value
- In the Source tab, script, style, and link elements can be expanded to show their source
- Control-clicking URLs will now open them in a new tab on Windows
- Element links have a tooltip that shows their XPath
Tabs
- When you re-load the page, FireBug will try to re-select the object was selected in the inspector
- Each browser tab keeps its own FireBug state independent of other browser tabs (whether FireBug is open and which inspector tab is selected)
- New Firefox windows and tabs always start with FireBug hidden
- Disabling FireBug will automatically close it
- Opening FireBug will automatically re-enable it if it was disabled
The new Firebug is not yet available for public, the new development version is available just for testing purpose and since the first time I download it and today's update I noticed already lot of changes like the new API. I didn't cover here all the new features especially in the debugger and how to play with breakpoints ... but I loved the way to make it available simply as Javascript functions.
Unfortunately for other browsers, Firebug is for Firefox only. And personaly everytime someone point me to a bug and he's using IE for example, I simply install firefox to see what the bug is all about. There is certainly techniques which could help debugging with IE, Safari, and others... but personaly I didn't see something similar to Firebug.
For more information and install of Firebug : http://joehewitt.com/software/firebug/
Joe Hewitt, firebug's author : http://joehewitt.com/


Subscribe to AJAX Magazine's feed