You can debug your JavaScript using the console
JavaScript APIs and view
the output messages to logcat. If you're familiar with debugging web pages with
Firebug or Web Inspector, then you're probably familiar with using console
(such as console.log()
). Android's WebKit framework supports most of the same
APIs, so you can receive logs from your web page when debugging in your
WebView
. This topic describes how to use
the console APIs for debugging.
Using console APIs in WebView
All the console APIs shown in the previous section are also supported when
debugging in WebView. You must provide a
WebChromeClient
that implements
the
onConsoleMessage()
method in order for console messages to appear in logcat. Then, apply the
WebChromeClient
to your
WebView
with
setWebChromeClient()
.
The following shows how to use console APIs in WebView:
Kotlin
val myWebView: WebView = findViewById(R.id.webview) myWebView.webChromeClient = object : WebChromeClient() { override fun onConsoleMessage(message: ConsoleMessage): Boolean { Log.d("MyApplication", "${message.message()} -- From line " + "${message.lineNumber()} of ${message.sourceId()}") return true } }
Java
WebView myWebView = findViewById(R.id.webview); myWebView.setWebChromeClient(new WebChromeClient() { @Override public boolean onConsoleMessage(ConsoleMessage consoleMessage) { Log.d("MyApplication", consoleMessage.message() + " -- From line " + consoleMessage.lineNumber() + " of " + consoleMessage.sourceId()); return true; } });
The ConsoleMessage
also includes a
MessageLevel
object
to indicate the type of console message being delivered. You can query the
message level with
messageLevel()
to
determine the severity of the message, then use the appropriate
Log
method or take other appropriate actions.
Whether you're using
onConsoleMessage(String, int, String)
or
onConsoleMessage(ConsoleMessage)
,
when you execute a console method in your web page, Android calls the
appropriate
onConsoleMessage()
method so you can report the error. For instance, with the example code above, a
logcat message is printed that looks like this:
Hello World -- From line 82 of http://www.example.com/hello.html
Logcat
Logcat is a tool that dumps a log of system messages. The messages include a
stack trace when the device throws an error, as well as log messages written
from your application and those written using JavaScript console
APIs.
To run logcat and view messages from Android Studio, select View > Tool Windows > Logcat.
For more information, see Write and view logs with logcat.
The following are some additional resources related to debugging:
Testing experimental web features
Similar to Google Chrome's chrome://flags
page, you can also test experimental
web features in WebView.
To do this, do the following:
Install one of WebView's pre-release channels (beta, dev, or canary).
Switch your WebView channel on your test device to the installed pre-release channel.
Click on the WebView DevTools Launcher.
Figure 1. WebView DevTools icon for app installed on a device.From DevTools, click on Flags and search for any experimental features you'd like to enable or disable. The change applies to all WebViews on the device.
Stop and restart your app to start testing with the new features.
For more information about toggling flags, see the WebView DevTools documentation.