How to use Web Inspector and debug Safari on iPhone/iPad

Guestbook

Prerequisites:

  • iPhone / iPad / iPod and the Macbook on the same version of Safari
  • a genuine Apple lightning or USB cable

Step by step:

  • On iPad, iPhone or iPod touch, go to menu Settings > Safari > Advanced and toggle on Web Inspector. Enable JavaScript if it isn’t already on
  • On Macbook, launch Safari and go to menu Preferences > Advanced then toggle on “Show Develop menu in menu bar”
  • Connect iOS device to Macbook with the lightning or USB cable
  • Now on iOS device, open Safari and go to the website you want to debug
  • On Macbook, open Safari and go to “Develop” menu. You now see your iOS device that has connected with Macbook (if no page opened on iOS device, you see a message saying “No Inspectable Applications”)

![Safari Develop menu](/img/Safari Develop.png “Safari Develop menu”)

  • Click on the website in Safari Develop > iOS device menu, Web Inspector window opened, then you can debug as you used to debug in Safari

![Web Inspector](/img/Web Inspector.png “Web Inspector”)

Contents