Software is hard

• Published:November 11th, 2009
• Comments:8 Comments
• Category:Firebug, Planet Mozilla

I have recently written a post about Break on Next feature (), introduced in Firebug 1.5 that allows breaking on various events occurring on a page. One of the examples I mentioned was XMLHttpRequest execution.

In this post I would like to describe another way how Firebug can be used to debug XHR. This time I want to focus on how to create XHR conditional breakpoints.

Create XHR Breakpoint

In order to create a XHR breakpoint, the Net panel offers the same breakpoint bar that is already well known from the Script panel.

So, creating a new breakpoint for XHR request is as easy as clicking on the appropriate row with the request the user wants to debug.

As soon as the breakpoint is there and a request to the same URL is executed by the current page again, Firebug halt's Javascript execution at the source line where the request has been initiated.

You can see two things on this screenshot. First, there is no breakpoint in the source code so, you don't have to know the source code line in advance to start debugging and second, the breakpoint is listed in the Breakpoints side panel in a new section called XHR Breakpoints.

Set Breakpoint Condition

If you want to halt the Javascript execution only in specific cases you can specify a condition. Again, this is done in the same way as specifying condition for regular Javascript breakpoint - just right click on the breakpoint circle .

The condition editor allows to specify a Javascript expression that if evaluated to true activates the breakpoint. The condition is evaluated in a scope with some built-in variables that can be used in your expression.

Couple of examples:

Halt JS execution only if URL parameter count is present and equal to 1.
URL: http://www.example.com?count=1
Expression: count == 1


Halt JS execution only if posted data contains string key.
URL: http://www.example.com?count=1
Expression: $postBody.indexOf("key") >= 0


See online demo here.

Update: Break On Next XHR and XHR Breakpoints features are integrated in Firebug 1.5b4 (coming soon) and so, Break On Next XHR now ignores requests with a breakpoint that has a condition evaluated to false.