Software is hard

• Published:July 20th, 2012
• Comments:3 Comments
• Category:Firebug, Firebug Tip, Planet Mozilla

Firebug is a tool for web developers and its features like JavaScript debugging and HTML/CSS inspection are well known, but there are also many little features users often don't know and so, they deserve more publicity.

One set of such features is related to XML and I'd like to describe them in this post. So, let's see what Firebug offers to developers who deal with XML!

See all Firebug tips

XML Posted Over HTTP

XML is popular data format using on the web and there are many web pages that are using AJAX (see the 'X' in the abbreviation) to transfer XML data over HTTP.

HTTP monitoring in done in the Net panel, which also allows to inspect data based on XML syntax.

• Hover mouse over individual XML elements to see the current XPath in the tooltip.
• You can right click on any XML element and pick Copy XML to the clipboard.

Post XML Data

If you have Firebug installed you can try it now (or install Firebug). Use the button above to generate XHR with XML in post body.

XML in HTTP Response Bodies

Similarly you can also inspect XML in HTTP response bodies.

Get XML Data

Use the button to generate XHR with XML in response body.

XML in Cookies

Some applications can also use cookies in order to store XML snippets on the client side. Firebug is ready for such scenarios too. Just select the Cookies panel and expand a cookie.

• The Cookies panel has been introduced in Firebug 1.10 (you need to install Firecookie for previous versions).
• Both XML Clipboard and XPath tooltips are also supported.

XML Logging

Firebug Console panel has special support for XML logging. If your application has variables referencing XML documents you can easily log the value using console.dirxml() method. Check out the following screenshot to see how the log looks like.

console.dirxml

Use the button to generate XML log.

See more about console.dirxml() on Firebug wiki.

Query XML Documents

Firebug also allows to query XML documents using XPath. Just load your document into the browser, open Firebug and select the Console panel. In order to execute an XPath expression you need to use $x() method.

The command line is disabled for XML documents by default so, you need to switch-to-html rendering mode. Do it by clicking on the link in the following warning message.

Now you should be all set and able to execute XPath expressions. Following examples are using this XML document.

• Click an item in the result array to switch into the HTML panel and see it's location within the entire document.
• Right click on an item in the result array and pick Inspect in DOM Panel to inspect DOM properties of the corresponding XML element.

You can also further process the XPath result (it's just an array).

See more about $x() on Firebug wiki.

Note that there is one issue related to HTML and XML page rendering.