Tip: Viewing Network Requests with the Safari Debugger

This post is more than 2 years old.

I'm not a heavy Safari user, but I use the heck out of the web tools when testing PhoneGap/Cordova apps. Sometime recently (I believe), the UI changed a bit in terms of the Network request panel and I couldn't see my requests anymore. I finally figured out the issue and I thought I'd share. To be clear, when I say I figured it out, I mean I found the right post on StackOverflow and all credit goes to user enyo. I'm just writing this up and sharing pretty pictures.

Ok, so what exactly is the issue? I noticed recently that when I go to my debug tools, select Timelines, click Network Requests and record, nothing seemed to show up in the detail panel, specifically:


I would click things in my app that I knew were firing XHR calls and nothing would show up in the detail. Turns out, the issue is due to timeline UI:


See that section I highlighted above? Look on the far right and see a darker gray "thingy" you can grab on top. Being that this is Apple they probably don't call it a thingy. What isn't obvious (well to me anyway) is that you can click and drag to select a portion of the time line. If you find the timeline moving too quick, just hit stop recording.


What you will discover is that the Network panel will only show items within a selected timeframe! So that makes sense I suppose, but I wish that by default you could select nothing and have everything show up.

Ok - but once you know that you may run into another problem. For me, my timeline was zoomed in such that every inch or so of screen space was about one tenth of a second. Note the timestamps in the screen shot above. I wasn't sure how to zoom, but on the StackOverflow link I shared above, they mentioned that if you scroll up and down it will zoom. I confirmed that scrolling down let me "zoom out" rather high:


I then selected from time zero to day 92000 or so, and frankly, if that isn't enough, then I don't know what is. ;)

I asked Apple's Safari evangelist (Jonathan Davis) if there was some way to always show all items and he said not yet. The zoom level, however, will stick, so in theory you don't have to keep zooming out. It also appears as if the selected range also persists. That means the only thing you need to do is hit the Recording button.

p.s. As a quick note, the UI for recording versus non-recording may be a bit weird. When you are not recording, the UI shows a red flight, which typically means that something is recording:



Raymond Camden's Picture

About Raymond Camden

Raymond is a senior developer evangelist for Adobe. He focuses on document services, JavaScript, and enterprise cat demos. If you like this article, please consider visiting my Amazon Wishlist or donating via PayPal to show your support. You can even buy me a coffee!

Lafayette, LA https://www.raymondcamden.com

Archived Comments

Comment 1 by nicholaspufal posted on 6/27/2015 at 3:05 PM

Thanks for this, Ray. I'm trying hard to move to Safari - there are some neat integrations and features that I like - but the dev side of things is always holding me back. I find their inspector UX very poor - and just like you I was struggling to figure out why the hell my XHR weren't appearing there! Same for the record button, I always tend to think it's recording - it's Chrome's default behavior btw.

Well, the cool thing is that they evolved it a lot. It used to be worlds of distance when comparing to Chrome. Still not there yet I suppose.

Once again, thanks!

Comment 2 (In reply to #1) by Raymond Camden posted on 6/27/2015 at 3:11 PM

I'm glad this helped. From what I know they are making improvements in Safari 9. I plan to test/blog about it soon.

Comment 3 by Rs posted on 6/2/2017 at 10:04 AM

M0thef$cking c&nts!
Spent my whole afternoon on this hell called safari!

Comment 4 by Saran Raj posted on 12/22/2017 at 6:41 AM

Hey Thanks, Raymond. I have one query here that, Is this article helpful for an iPad as well.?

Comment 5 (In reply to #4) by Raymond Camden posted on 12/22/2017 at 2:05 PM

If you remote debug, then sure.