How to Debug iPhone Safari Wirelessly Over Wi-Fi
Yes, it is entirely possible to debug the Safari web browser on an iPhone over a local Wi-Fi network without keeping a physical USB or Lightning cable attached. This article provides a step-by-step guide on how to configure both your iPhone and Mac to enable wireless Web Inspector debugging. By completing a one-time physical pairing process, you can freely inspect elements, monitor network requests, and view console logs across your local network completely untethered.
Prerequisites
- A Mac and an iPhone connected to the exact same local Wi-Fi network.
- A USB or Lightning cable (required only for the initial setup).
Step 1: Enable Web Inspector on Your iPhone
Before your Mac can communicate with Safari on your iPhone, you must enable the developer tools on the mobile device.
- Open the Settings app on your iPhone.
- Scroll down and tap Safari.
- Scroll to the very bottom and tap Advanced.
- Toggle the Web Inspector switch to the ON (green) position.
Step 2: Enable Developer Tools in Mac Safari
Next, you need to expose the developer options within the desktop version of the Safari browser on your Mac.
- Open Safari on your Mac.
- Click Safari in the top-left menu bar and select Settings (or Preferences on older macOS versions).
- Click on the Advanced tab.
- At the bottom of the window, check the box next to Show features for web developers (or Show Develop menu in menu bar on older Safari versions).
- Close the Settings window. You will now see a Develop menu in the top menu bar.
Step 3: Pair Your Devices for Wireless Debugging
To establish a secure wireless connection, you must configure the network settings while the iPhone is physically connected to the Mac one last time.
- Connect your iPhone to your Mac using your USB or Lightning cable.
- Unlock your iPhone. If a prompt appears asking to Trust This Computer, tap Trust and enter your iPhone passcode.
- On your Mac, open Safari and click the Develop menu in the top menu bar.
- Hover your cursor over your iPhone's name in the dropdown list.
- In the sub-menu that appears, click Connect via Network so that a checkmark appears next to it.
Note: If the "Connect via Network" option does not appear in Safari, open a Finder window on your Mac, select your iPhone in the left sidebar under "Locations," go to the General tab, check the box for Show this iPhone when on Wi-Fi, and click Apply.
Step 4: Debug Safari Wirelessly
Now that the configuration is complete, you no longer need the physical cable.
- Unplug the USB or Lightning cable from your iPhone and Mac.
- Open the Safari app on your iPhone and navigate to the website you wish to debug.
- On your Mac, open Safari and click the Develop menu.
- Hover over your iPhone's name (it will remain visible in the list as long as both devices are on the same Wi-Fi network and the iPhone is unlocked).
- Click the URL of the active webpage listed under your iPhone's name.
A Web Inspector window will immediately open on your Mac, linked directly to the mobile Safari tab over Wi-Fi. You can now modify the DOM, adjust CSS styles, and debug JavaScript in real-time without any wires.
Troubleshooting Connection Drops
If your iPhone disappears from the Mac's Develop menu during a wireless session, verify the following:
- Screen Lock: The iPhone screen must be unlocked and awake for the Mac to initiate the connection.
- Network Isolation: Ensure your Wi-Fi router does not have "Client Isolation" or "AP Isolation" enabled, which prevents devices on the same network from communicating with each other. VPNs active on either device can also block local network discovery.