Is there a way to use Webkit Inspector Remote Debugging in iPad?

Question

I have an iPad and I am wondering if I can remote debug it from the desktop using Webkit Inspector? As I understand it, it requires you to launch the browser with a command line switch. I do not think that's possible to do in iPad, but I may be wrong.

What about iPad2? Or Android powered tablets?

As of iOS 6 Remote Debugging is available: http://stackoverflow.com/a/12762449/72428 — Blaine, Oct 06 '12 at 18:18

score 18 · Accepted Answer · edited Oct 10 '12 at 16:21

18

See weinre

Here's an excerpt:

It's a debugger for web pages, like FireBug (for FireFox) and Web Inspector (for WebKit-based browsers), except it's designed to work remotely, and in particular, to allow you debug web pages on a mobile device such as a phone.

If you aren't familiar with FireBug or Web Inspector, weinre isn't going to make too much sense to you. weinre reuses the user interface code from the Web Inspector project at WebKit, so if you've used Safari's Web Inspector or Chrome's Developer Tools, weinre will be very familiar.

edited Oct 10 '12 at 16:21

Tom

1,191
1
13
24

answered Jun 09 '11 at 02:10

Paul Beusterien

27,542
6
83
139

1

According to their documentation, weinre can't do javascript source debugging. – Josh Mouch Jun 26 '12 at 16:22
weinre doesn't do run-control, but it does do examination and manipulation. – Paul Beusterien Jun 26 '12 at 20:29
1

If you're using IOS 6, you can set it up easily though Safari 6. Just follow this tutorial: [Webkit Inspector Remote Debugging](http://moduscreate.com/enable-remote-web-inspector-in-ios-6/) – Grgur Oct 31 '12 at 10:01
Safari 6 works great on a Mac, but if you are using Windows, Safari 5 is the newest and remote debugging is not available from what I can figure out. – timbrown Apr 22 '13 at 20:49
right now weinre has problems with inspecting styles on angularjs apps. If you consider to use weinre, you should search if this issue has been fixed – netzaffin Aug 21 '14 at 09:11

score 9 · Answer 2 · answered Sep 14 '12 at 19:09

9

Now you can debug using Safari 6 and the new Web Inspector straight on the iPad/iPhone simulator http://encoreptl.tumblr.com/post/31512516711/web-inspector-debugging-for-iphone-and-ipad-from-mac-os

answered Sep 14 '12 at 19:09

Encore PTL

8,084
10
43
78

1

real devices too, not just the simulator – CupawnTae Mar 01 '13 at 10:42

score 5 · Answer 3 · answered Nov 22 '11 at 17:24

5

Also a new blog post out using private apis that makes this very easy -- see http://atnan.com/blog/2011/11/17/enabling-remote-debugging-via-private-apis-in-mobile-safari/

answered Nov 22 '11 at 17:24

Hiedi

256
2
4

score 5 · Answer 4 · answered Jan 05 '12 at 12:37

5

For the iPad Emulator (Xcode 4.2) you can use iWebInspector to comfortably enable the remote console:

http://www.iwebinspector.com/

answered Jan 05 '12 at 12:37

0x89

2,940
2
31
30

1

There are a few limitations with iWebInspector that I've found so far. From what I can tell, iWebInspector can only start debugging a webapp after it opens or a safari web page after it opens in the tab. This means you can't catch javascript errors that occur during page load. – Josh Mouch Jun 26 '12 at 16:25
For me it was very useful! Aside from the limitation mentioned by Josh, it seems to work just like the Chrome inspector. +1 from me, amazing resource – BBog Jul 13 '12 at 08:18

undefined · Answer 5 · 2012-05-21T21:16:02.020

Your question mentions Android tablets. With Chrome for Android (4.0), you can debug web pages remotely in Chrome for the desktop over USB. I use this and it works very well. See https://play.google.com/store/apps/details?id=com.android.chrome&hl=en and https://developers.google.com/chrome/mobile/docs/debugging.

Edit: weinre, mentioned in the accepted answer above, also reports that it works in the Android browser.

score 1 · Answer 6 · answered Feb 06 '14 at 12:57

1

You can also use this to activate Firebug on your device. Worked for me on Windows

http://martinkool.com/post/13629963755/firebug-on-ipad-and-iphone

answered Feb 06 '14 at 12:57

Mladen Janjetovic

13,844
8
72
82

score 1 · Answer 7 · answered Oct 23 '14 at 18:57

Safari allows you to debug and inspect the elements in the mobile browser. Also many remote consoles like www.farjs.com or jsconsole.com also allow that.

www.farjs.com used with a debugging proxy like Charles also allows you to debug a web-views in native apps.

score 1 · Answer 8 · edited Jun 20 '20 at 09:12

If you are not tied in to Webkit-based debuggers and can also debug using Firefox's Inspector, using Firefox Developer Edition might be your answer. This version of Firefox includes WebIDE and Valence, which together make it very easy to debug Safari on iPad. Here are the steps to follow:

Enable the 'Web Inspector' on Safari in your iPad: go to Settings > Safari > Advanced > Web Inspector and make sure it's on.
Open the page that you want to debug.
Connect the iPad to your machine with its USB cable.
Open Firefox Developer Edition in your machine.
Click on the WebIDE add-on in Firefox (you might have to look for it under the main menu)
Select 'Safari on iOS' as the Runtime
Click on 'Open App' and you'll see the page that you opened on Safari listed there.

your Safari tab

Select it. A FF dev tools window will appear.
Debug away!

score 1 · Answer 9 · answered Nov 16 '11 at 16:05

Paul is correct, weinre is great. In addition, in http://css-tricks.com/14727-five-questions-with-paul-irish/ Paul Irish hints that this will be (is?) possible with the Chrome Developer Tools/Webkit Inspector:

I'm very excited about the work the team has done on remote debugging as that is now available to all mobile WebKit ports, which means you're able to profile, view network detail, and edit the CSS live on your device. I have yet to see an example on how to do this with iOS Safari, however.

Is there a way to use Webkit Inspector Remote Debugging in iPad?

9 Answers9