At Google I/O 2011: Chrome Dev Tools Reloaded, Paul Irish and Pavel Feldman introduced new remote debugging feature — which was in passing included into webkit.
--
Adobe's Shadow utility (which was just released) allows you to debug remotely using weinre without needing to inject any code into your web pages. It works with Chrome on Windows and Mac as the "master" browser and will sync every page navigation over to any number of devices running the iOS or Android client.
Note that weinre itself is somewhat limited. For example you won't have access to the Network tab.
Thomas points out an excellent resource for remote debugging, however he states that you need to add the code to the webpage. This is not strictly true, as weinre also allows interaction through bookmarklets. Part way down the page here (under the section conveniently called "Using a bookmarklet"), it says it should work for Android 2.2+ and iOS.
Some relevant things to note:
It is also possible (I have done it myself) to 'debug' code from the android browser using a webview. You can have the webview catch all method calls (ie. console.log). Using that you can catch and save, or forward the messages to logcat.
Related to the method you have already tried - when you enabled the Debug console on iOS, where were you looking for interaction/logging output? More particularly, did you check in the debugging console in xCode/iPhone simulator?
Safari on iOS 6 In iOS6 you can now remote debug from Safari 6 (only OS X). On the device, open Settings > Safari > Advanced > Enable Web Inspector. Open Safari Preferences, Advanced, check "Show Develop menu in menu bar". Connect your iPhone/iPad with a USB cable. Now under the Develop menu bar you should get a submenu for you device with the tabs you have open in Safari on your device.
Safari on iOS 7 In addition to requirements above you will need Safari 6.1, which at the moment (Oct. 8th 2013) is only available as a seed for developers: https://developer.apple.com/downloads/index.action?name=Safari%206.1
Chrome on Android 4 It's a bit more complicated on Android. Instructions for remote debugging on Chrome for Android here: https://developers.google.com/chrome/mobile/docs/debugging I haven't found a way to enable remote debugging in the Android default browser (v4.04).
It's now supported in Chrome for Android.
Currently no mobile browser is implementing the webkit remote debugging protocol. (Maybe you can get custom builds for android that support it)
However there is weinre, which is giving you a remote version of the web-inspector. But you have to include some code in your page in order to support it. (Because it's not a browser feature).
Weinre website
Weinre github repo
Nathan de Vries figured out how to do this on iOS5 running in the simulator. It revolves around calling the private _enableRemoteInspector
method.
Read it. Summary follows:
To enable this for Mobile Safari, attach to it with gdb and call the method:
MobileSafari_PID=$(ps x | grep "MobileSafari" | grep -v grep | awk '{ print $1 }')
if [ "$MobileSafari_PID" == "" ]; then
echo "Mobile Safari.app must be running in the Simulator to enable the remote inspector."
else
cat <<EOM | gdb -quiet > /dev/null
attach $MobileSafari_PID
p (void *)[WebView _enableRemoteInspector]
detach
EOM
fi
Then access the inspector at http://localhost:9999/
.
With an embedded UIWebView
, enable it like this:
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
// ...Snipped...
[NSClassFromString(@"WebView") _enableRemoteInspector];
// ...Snipped...
}
On a real device it doesn't work, probably because the port is firewalled - if you have a jailbroken device you may get around that (update us if you do).