Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I see Javascript errors in WebView in an Android app?

I'm trying to run javascript in WebView in an app. I'm developing on Nexus 7.

The html / javascript works fine on Chromium, but certain actions aren't happening on the tablet. Is there a way of seeing if any of the javascript itself is failing on the tablet? A kind of console view?

like image 291
interstar Avatar asked Feb 13 '13 18:02

interstar


People also ask

Does WebView support JavaScript?

JavaScript is disabled in a WebView by default. You can enable it through the WebSettings attached to your WebView . You can retrieve WebSettings with getSettings() , then enable JavaScript with setJavaScriptEnabled() . WebView myWebView = (WebView) findViewById(R.

How do you verify that WebView debugging is enabled for your app?

To turn on Android WebView debugging, run the setWebContentsDebuggingEnabled static method on the WebView class. The setting applies to all of the Android WebViews of the app. Android WebView debugging isn't affected by the state of the debuggable flag in the manifest of the app.

How do you debug web Apps?

If you want to debug it, you should press F12 on Chrome to open the developer mode. You can see that the JS code of the current page is under the Source menu, you can set a breakpoint directly at the beginning of the script. Then you can click on the UI button or menu to start debugging(both js and backend activity ).

How do I test my chrome WebView?

# Open a WebView in DevTools The chrome://inspect page displays a list of debug-enabled WebViews on your device. To start debugging, click inspect below the WebView you want to debug. Use DevTools as you would for a remote browser tab.


2 Answers

You can actually receive the console messages from a WebView, which would allow you to catch the errors that it throws.

To do so:

  1. Enable JavaScript on your WebView
  2. Set a WebChromeClient
  3. Override onConsoleMessage

Example:

    final WebView webView = (WebView) findViewById(R.id.webview_terms_conditions);      WebSettings webSettings = webView.getSettings();     webSettings.setJavaScriptEnabled(true);      webView.setWebChromeClient(new WebChromeClient() {         @Override         public boolean onConsoleMessage(ConsoleMessage consoleMessage) {             Log.d("MyApplication", consoleMessage.message() + " -- From line "                     + consoleMessage.lineNumber() + " of "                     + consoleMessage.sourceId());             return super.onConsoleMessage(consoleMessage);         }     });      webView.loadUrl(getString(R.string.url_terms_conditions)); 

Similar to what it says here, though that doc isn't complete and it uses a deprecated method.


When running on Android KitKat, you can also enable remote debugging!

like image 140
RominaV Avatar answered Oct 05 '22 11:10

RominaV


You can use Remote Debugging WebViews

Chrome Devtools Remote Debugging

More info

Debug WebViews in your native Android apps using Chrome Developer Tools.

On Android 4.4 (KitKat) or later, use DevTools to debug WebView content in native Android applications.

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {     WebView.setWebContentsDebuggingEnabled(true); } 

Type chrome://inspect in pc browser enter image description here

like image 44
Ahmad Aghazadeh Avatar answered Oct 05 '22 10:10

Ahmad Aghazadeh