Debug Android WebViews in React Native

Question

I need to inspect the content and network requests of a webview I have running inside my app. With iOS I can open the simulator, open Safari, and am then able to inspect the webview as I would any other website.

I am having trouble with Android. I have gone to chrome://inspect, and am able to inspect Chrome on the connected device, however I am unable to inspect a webview.

I have tried moving webView.setWebContentsDebuggingEnabled(true); inside ReactWebViewManager.java into the onPageStarted method so that it's always enabled, but this has had no effect.

Thanks

Answer 1

OK so we have this working now.

What we did in our app was that we call WebView.setWebContentsDebuggingEnabled(true); inside the onCreate method of our MainActivity.java (found at android/app/src/main/java/com/[appname]).

I'm not sure it has an onCreate method out of the box so you may have to add one or try it elsewhere - we must have read the same article as I had previously done as you had and moved the call into the onPageStarted method of ReactWebViewManager.java but that didn't work for me either.

setWebContentsDebuggingEnabled is a static method of android.webkit.WebView so just make sure you have that import.

Hope this helps you.