Remote debugging using Safari on iOS devices with macOS

nimajafari

Nima Jafari

Posted on March 4, 2024

Remote debugging using Safari on iOS devices with macOS

Apple's integration between macOS and iOS provides a native and efficient pathway for developers to debug web content directly on an iOS device from a macOS computer. This guide will cover the essential steps and tools required to set up a remote debugging session between Safari on an iOS device and a macOS computer.

Before to start remote debugging:

  1. Enable Develop on your Mac Safari through Safari Settings > Advanced Settings.
  2. On your iOS device, head over to the Settings > Safari.
  3. Find the Advanced section, then enable Web Inspector there.

Image description
You can now start remote debugging:

  1. Connect your iOS device to your Mac using a cable.
  2. On the Safari browser on your iOS device, open the desired URL that you are going to debug.
  3. On your macOS system, from the Develop menu on Safari, find your iOS device name and click on the page that you have already opened on your phone or tablet.

Image description
In the opened Web Inspector, you are able to debug the web page.

Image description

Conclusion

In this article, the remote debugging steps with an iOS device on a macOS system using the Safari browser on both sides was explained.
It is a practical web page investigation method which provides your the possibility to find mobile issues including mobile-friendliness and user experience with an iPhone or iPad view.

โ„น๏ธ You may also want to read:
๐Ÿ”—Remote debugging using Google Chrome on Android devices with Windows
๐Ÿ”—Remote debugging using Firefox on Android devices with Windows
๐Ÿ”—Remote debugging using Google Chrome on iOS devices with macOS

๐Ÿ“Resource: https://www.oxyplug.com/optimization/ultimate-guide-to-remote-debugging-webpages/

๐Ÿ’– ๐Ÿ’ช ๐Ÿ™… ๐Ÿšฉ
nimajafari
Nima Jafari

Posted on March 4, 2024

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related

ยฉ TheLazy.dev

About