40

I have a strange behavior on the iPhone browser. Is there a tool to debug the JavaScript of the iPhone browser?

I'm hoping there's something more advanced than simple alert() messages. Is there something with advanced tools like setting breakpoints and viewing object states?

5 Answers 5

51

With the release of iOS 6, Apple released Remote Web Inspector for their Mobile Safari, and this is huge. Basically you have all the features and power of Web Inspector in regular Safari, for your mobile apps, including Phonegap apps.

I've used weinre but this tool makes it obsolete for newer versions of iOS (unfortunately not for old versions of iOS, non-iOS devices, or if you're on Windows) since its a full-featured debugger with breakpoints and everything.

Requirements:

  1. A Mac with Safari 6+
  2. Either a USB-attached iOS 6+ device or xCode 4.5+ running an iOS 6+ simulator

How to activate the inspector:

  1. In your simulator or device, open Settings > Safari > Advanced > Web Inspector > On
    (this is on by default in the simulator)
  2. In Safari 6+ for Mac, access your page from the Develop menu. You can enable Develop menu in Safari's Advanced Preferences if its not showing up.

    Safari Web Inspector

    enter image description here

More discussion at the bottom of:
http://www.mobilexweb.com/blog/iphone-5-ios-6-html5-developers

(Also, if you read about a "secret private interface" or iWebInspector somewhere, these are also made obsolete.)

7
  • 1
    this blows any other solution out of the water - SUPER easy! Thx!! Jul 18, 2013 at 20:40
  • I want to debug chrome on iOS, not Safari :/
    – vsync
    May 20, 2014 at 17:52
  • @vsync in that case, its probably time to bust out the weinre. people.apache.org/~pmuellr/weinre/docs/latest/Home.html
    – B Robster
    May 21, 2014 at 18:15
  • yes but it's not always simple to use it in some situations
    – vsync
    May 21, 2014 at 18:33
  • @vsync I totally agree with you.
    – B Robster
    May 22, 2014 at 21:46
3

check out weinre or use the remote version debug phonegap.

cu

4
  • very nice - but is there a way to make breakpoints? I couldn't find it if there is...
    – gmadar
    Aug 30, 2011 at 13:01
  • i am sorry this is not possible. i had the same problem. so i used the console to debug my code... like console.log("blablabla"); Aug 30, 2011 at 13:08
  • @Robert, This doesn't make weinre obsolete for iphone debugging. Not everyone has new or upgraded iPhone.
    – Marecky
    Mar 20, 2013 at 8:05
  • Fixed links. @AdrianBer Nov 3, 2019 at 19:56
2

you can also inject firebug using a simple bookmark. I've used it on the ipad and my debugging abilities were immensely enhanced.

2
  • Thanks for your cool method. Is it possible to get through javascript step by step (on ipad/iphone)just like chrome browser hitting f12 and step through by hitting f10? Do you know any ios app or bookmarklet allowing that? Dec 28, 2017 at 4:01
  • These days you should use the iphone simulator on macOS. Using Safari (has to be Safari I'm afraid, due to Apple reasons), you use the context menu to inspect any webpage (or webview inside your app). You get full dev tools including a debugger (step by step etc).
    – sgb
    Feb 2, 2018 at 11:43
1

I faced a simple use case in which I only needed to test my code on a Safari's JS engine (Merely debugging, simply running it and consuming traces).

To that end I used Epiphany web browser, which is both free and uses JavaScriptCore JS engine which is also used by Safari. Epiphany isn't provided with developer tools, so I used http://jsconsole.com/ to view my traces.

Though it is a thin solution, it helped me find a line which worked on Chrome but didn't on Safari.

-4

Step by Step Guide How To Enable JavaScript in iPhone

  1. Open your iPhone settings.
  2. Tap on safari in the app list.
  3. Tap on Advanced option.
  4. Enable Javascript iPhone with the help of switch push.
0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.