How to use Chrome's network debugger with redirects
This has been changed since v32, thanks to @Daniel Alexiuc & @Thanatos for their comments.
Current (≥ v32)
At the top of the "Network" tab of DevTools, there's a checkbox to switch on the "Preserve log" functionality. If it is checked, the network log is preserved on page load.
The little red dot on the left now has the purpose to switch network logging on and off completely.
Older versions
In older versions of Chrome (v21 here), there's a little, clickable red dot in the footer of the "Network" tab.
If you hover over it, it will tell you, that it will "Preserve Log Upon Navigation" when it is activated. It holds the promise.
I don't know of a way to force Chrome to not clear the Network debugger, but this might accomplish what you're looking for:
- Open the js console
window.addEventListener("beforeunload", function() { debugger; }, false)
This will pause chrome before loading the new page by hitting a breakpoint.
Another great solution to debug the Network calls before redirecting to other pages is to select the beforeunload event break point
This way you assure to break the flow right before it redirecting it to another page, this way all network calls, network data and console logs are still there.
This solution is best when you want to check what is the response of the calls
P.S:
You can also use XHR break points if you want to stop right before a specific call or any call (see image example)
