Firebug 2 (first alpha) has been released this week and it's time to checkout some of the new features. Note that you need at least Firefox 30 to run it.

This brand new version introduces a lot of changes where the most important one is probably the fact that it's based on new Firefox debugging engine known as JSD2.

Also Firebug UI has been polished to match Australis theme introduced in Firefox 29.

Dynamically Created Scripts

Let's see how debugging of dynamically created scripts has been improved in this release and how Firebug UI deals with this common task. We'll cover following dynamic scripts in this post:

• Inline Event Handlers
• Script Element Injection
• Function Object

There are other ways how to create scripts dynamically.

 

Inline Event Handlers

Inline event handlers are little pieces of JavaScript placed within HTML attributes designed to handle basic events like onclick.

These scripts are compiled dynamically when needed (before executed for the first time). That's why they are considered dynamic and you don't have to see them in the Script location list (until compiled by the browser).

Script's URL is composed dynamically (there is no real URL for dynamic scripts) and event handlers scripts follow this scheme:

  

If you select the script from the script location menu, you should see the source that is placed within the onclick attribute.

Of course, you can create a breakpoint as usual. Try live example page if you have Firebug 2 installed.

 

Script Element Injection

Another way how to dynamically compile a piece of script is using

http://feedproxy.google.com/~r/SoftwareIsHardPlanetMozilla/~3/clhBVGprAL8/