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!
- XML Posted Over HTTP
- XML in HTTP Response Bodies
- XML in Cookies
- XML Logging
- Query XML Documents
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.
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.
Use the button to generate XHR with XML in response body.
XML in Cookies
- 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.
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.
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
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.