Debugging IOS Webviews on Safari browser

Please refer to my blog below for Two-way communication between the iOS Webview App with WKWebView and the React App

Two-way communication between iOS Webview App with WKWebView and React App

While working on the WebView IOS app it is very important to know how to debug the WebPage or WebApp(ReactJs App) which we rendered WebView of the IOS app.

Step 1: Device Side Settings (iPhone/ iPad / Simulator) :

First, we need to enable Web Inspector on Safari.

Navigating to Settings > Safari > Advanced, and toggling the Web Inspector option on

1. Settings > Safari

2. Safari > Advanced > Web Inspector

Step 2: Now on Swift side code

webview.isInspectable = true

Step 3: Debug from Safari Browser on Macbook

First, we need to enable developer mode on Safari

Click on Safari > Settings

Click on Advanced > enable the show feature for web developer

After this, a list of devices which is connected to MacBook via the internet or USB will be displayed in the developer section below :

Result :

Complete Code: https://github.com/geek-atif/IOSReactWebview/

If you have any questions or suggestions, please leave them in the comments.

Available on Linkedin, Github, and Instagram