How can I watch (i.e. debug) xmlHttpRequest() acti

Question

I normally do my web dev using Firefox - I periodically test for cross browser compatability of my pages by using FF and IE.

I have just found that one of my AJAX pages stopped working in IE - although it works fine in FF. With FF, I always use FireBug to debug my Ajax interactions. I am looking for a similar tool to use with IE - to see what it is causing it to fail, even though it is a straightforward AJAX process on the page.

I downloaded Firebug Lite and that was very helpful, as it brought a familiar dev environment into IE. Unfortunately, I have not been able to debug my AJAX interactions following the ForebugLite's documentation:

firebug.watchXHR: Use this function to watch the status of XmlHttpRequest objects.

    var req = new XmlHttpRequest;
    firebug.watchXHR(req);

I inserted that in my page - so the top of my page looks like this:

<script type='text/javascript' 
    src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'>
    var req = new XmlHttpRequest;
    firebug.watchXHR(req);      
</script>

However, I still could not debug the AJAX interactions (i.e. nothing shows in the console window when I click on a link that triggers an AJAX call).

Has anyone managed to do this before (IE7 and Firebug Lite)?

Answer 1

Try DebugBar - I think it will capture this.

Answer 2

To use Firebug lite, you have to attach Firebug to each XHR request. So you'll wanna call firebug.watchXHR(req); for each ajax request you make, before you fire the request.

If you are using a library such as Jquery or Prototypejs to make your Ajax requests, you can wire Firebug lite into the process for easy debugging.

Answer 3

Or, you could install Fiddler and watch all of your web traffic.

Answer 4

charles is another option for studying your network traffic but debugBar would probably be my choice.