Debug ipad safari with a PC

See monkeythedev's answer for the easiest way to debug on a Windows 8+ machine with iOS 9+. I updated my blog post using information from that answer and other sources and also recorded a screenshare. The method below should still work for iOS 8 and down, if needed.

There is actually a pretty easy way to debug a website in Safari on iOS using Firefox on a Windows machine.

NOTE: Ryan wrote in the comments below that this may only work on iOS 8 and down. I am unable to confirm, but be aware.

I wrote a detailed blog post about this, but here are the highlights:

  1. Install iTunes to get the "Apple Mobile Device Support" and "Apple Application Support" applications that come with it. (uninstall iTunes afterward, if you want)
  2. Connect your iOS device via USB.
  3. Enable web inspector on iOS (available on iOS 6 and later).
  4. Open Safari on your iOS device and browse to a website.
  5. Open Firefox on your Windows machine and press Shift + F8 to open WebIDE, which should include the necessary Valance add-on, if you use Firefox Developer Edition (any version) or Firefox 37 and later (any channel).
  6. For some reason, I couldn't get it to connect to my iOS device until I downloaded the ios-webkit-debug-proxy-win32 program and ran it. It opens a blank Command Prompt, but after I went back to WebIDE after opening it, I disconnected, then reconnected, and I saw debug info for the website I had opened in Safari. You may not need to do this though, as another user just had to add an exception to their firewall then disconnect/reconnect, and it worked.

The debug info available isn't as exhaustive as Chrome Developer Tools (specifically no "Networking" tab), but it was enough for me to be able to view what was going on in the Console.

enter image description here


2018 Update:

Since the original post, the blog post is dead & Telerik App Builder is discontinued and no longer offered. Adding this update to inform readers in case they don't read the user comments that follow this answer post. As for the blog post, for those still interested, here's a web cached copy. Regarding the blog, I think the company that blog's from has since shut down.

When I get a chance, I'll see if I have a copy of the app builder saved so that I can post it online for those still interested in using it, along with another cached copy of the blog post maybe.

Original Answer

You can try option of using Telerik AppBuilder (Windows client) as a replacement on Windows for Safari debugger on Mac when remote debugging. There's a nice blog post about the steps to do it in link below. I'd rather not repost the info as there are also screenshots and it's a lot of text. But essentially, you install app, open it, connect device via USB, then you can find it in the app and open up the developer tools/debugger for it. For non-public websites, you'll have to open up port 80 with some firewall configs documented in the post.

http://blog.falafel.com/Blogs/josh-eastburn/2014/03/04/ios-web-inspector-on-windows-with-telerik-appbuilder

The tool requires a license or you can use the trial, which becomes a basic edition afterwards. I think the basic edition will still allow you to do the debugging. I'm going to try it out myself.

You can also try these iOS apps too, you can find them in the iTunes App store. They give you a built in developer tools feature (right on iOS no remote debug) that mobile Safari doesn't offer.

MIH Tool - basic edition https://itunes.apple.com/us/app/mihtool/id584739126?ls=1&mt=8

HTTPWatch Basic https://itunes.apple.com/us/app/httpwatch-basic-http-sniffer/id658886056?mt=8

I gave them a try and they're at least better than the mobile Safari you get on iOS, unless one needs to target full mobile Safari compatibility. I'm guessing the pro/paid editions of those apps give you more/better features.


Update October 2019

This solution doesn't work for IOS 12+ (resource 1, resource 2).

Updated and tested on 24/6/2017

Using Chrome on Windows 8 and more recent:

  • Download and install Node
  • Download and install ITunes and connect it to your Device. (A pop-up should shows to your iPad to get authorization) . Be sure to allow web inspector in your iPad

  • Download and install the remote webkit adapter

Using Powershell (As administrator):

npm install remotedebug-ios-webkit-adapter -g

  • Execute the adapter:

Using Powershell (as administrator):

remotedebug_ios_webkit_adapter --port=9000

You should get a similar output:

C:\Windows\system32> remotedebug_ios_webkit_adapter --port=9000 remotedebug-ios-webkit-adapter is listening on port 9000 iosAdapter.getTargets ...

  • Open Chrome and go to the following link:

chrome://inspect/#devices

  • Click on configure next to "Discover network targets" and add the following: localhost:9000

Make sure to have the web page you want debug open on safari, you should see it on chrome inspector page under Remote Target

Extra step for iOS 11 Thanks to @skaurus