DEV Community

Jyotishman Saikia
Jyotishman Saikia

Posted on

How to debug iPhone safari on mac in 2 steps?

Debug HTML, CSS and Javascript issues for the website open on iPhone safari directly from your mac in just 2 steps.

Step1: Activate the Web inspector in your iPhone.

On your iPhone go to Settings > Safari > Advanced and toggle on Web Inspector .

iphone web inspector tutorial

Step2: Download Safari Technology Preview Browser

Goto this Link and download this super useful browser which will help in debugging the iOS safari on mac

Once downloaded-

  1. Open the Safari Technology Preview
  2. Goto Develop -> Select your iphone -> click on the iphone safari tab

Image 1
safari technology preview

Image 2

safari technology preview

Discussion (2)

Collapse
thsmdt profile image
Thomas (he/his)

This is great! Inspecting the console output and networking of a web app running on an iPhone helped me dozens of times in the past already.

Actually, you can do the same without installing the technology preview. Just open Safari's Settings on the Mac, go to Advanced, and toggle "Show develop menu in menu bar".

Collapse
jyotishman profile image
Jyotishman Saikia Author

I tried with safari . But somehow the newer version doesn't work . So this tool helps here.