How do I debug the running webview in an Ionic 2 / iOS app?

Ionic Framework ionic-v3
1

Hi there,

I’m trying to debug a problem on an iPhone 5 / iOS9 from a mac mini. The app runs OK, but hangs when I try to press a link (using ion-item (click) handler). I’d like to see what’s happening but Xcode isn’t showing anything from the webview events. So how do I step into the code like I can with the Android/chrome debugger USB attachment? Ideally I’d like the webkit debugger tools view, if that’s possible (which it seems reasonable would be available on some level).

The app is working in a browser, by the way.

Cheers, I appreciate any insight.

2

Just plug in your device via USB, open up Safari and ensure you have enabled the ‘Develop’ toolbar, and then go to Develop > Your device. This will open up a remote debugging window.

3

Thanks, Josh. That’s a useful start but I’m not getting my phone appear in the develop menu’s options… :confused: I only have the host machine as a menu item and the sub-options are empty (i.e. there are no devices to attach to in the list). Is there some settings elsewhere that I need to enable, do you know?

4

You will need to enable USB debugging on your device as well

5

Ah, thanks, I just got there myself, too! Cheers pal, appreciate your help :slight_smile:

For other users:

Go into iPhone’s Settings -> Safari > Advanced and enable Web Inspector option. (iOS ~9.1)

1 Like