Search code examples
firefoxnetwork-programmingfirebuggoogle-chrome-devtools

How to "go deeper" than firebug/chrome dev tools net panel?


How do I take a deeper look at what's going on in the network level of my web browser than the developer tools network panel will provide? For example, I'm trying to debug an issue on a page right now in Firefox (18.0.1) where the loading "spinner" keeps going continuously long after the page has finished loading.

The firebug net panel shows all resources loaded ("200 OK") but the loading icon on the tab is still spinning and the text on the bottom of the window still shows "Transferring data..". How would I take a closer look and see what is supposedly still transferring? Note that this only seems to happen with Firefox and only on a fresh load (not when resources are cached).


Solution

  • After checking your link with Wireshark and with HTTPScoup (a different tool), my conclusion from both was that all the data arrives successfully and no connection remains open with your server's IP. The problem in FF I think is related to something else

    Google reveals that in some cases, it is possible to confuse FF into this state. It doesn't have to be related to open network connections.

    Take a look at this questions for example: FireFox sits on "Transferring data from..." or "Read...."

    The issue there was unclosed tags in the HTML body.. so try to find problems like this one too. You can try fixing some validation errors by running a validator such as this one. Since you have about 200 validation errors, I suggest you start by deleting half your HTML code until the problem goes away and this way zero-in on the problem location. Then go in and fix the tag mess.. looking a little in the HTML source gave me a headache :)