You can debug your JavaScript using the `console` JavaScript APIs and view the
output messages in 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`](https://developer.android.com/reference/android/webkit/WebView). This section describes how to use the console APIs for
debugging.
| **Note:** You can also remotely debug your web pages in WebView with the Chrome Developer Tools. For more information, see [Remote debugging
| WebViews](https://developer.chrome.com/docs/devtools/remote-debugging/webviews/).

## Use console APIs in WebView

The console APIs are also supported when debugging in `WebView`. You must
provide a [`WebChromeClient`](https://developer.android.com/reference/android/webkit/WebChromeClient) that implements the
[`onConsoleMessage()`](https://developer.android.com/reference/android/webkit/WebChromeClient#onConsoleMessage(android.webkit.ConsoleMessage)) method for console messages to appear in Logcat.
Then, apply the `WebChromeClient` to your `WebView` with
[`setWebChromeClient()`](https://developer.android.com/reference/android/webkit/WebView#setWebChromeClient(android.webkit.WebChromeClient)). For more information, see the [`WebView`](https://developer.android.com/reference/android/webkit/WebView)
documentation.

The following example 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;
        }
    });

| **Warning:** Don't include personally-identifiable information (PII) in console messages.

The [`ConsoleMessage`](https://developer.android.com/reference/android/webkit/ConsoleMessage) also includes a [`MessageLevel`](https://developer.android.com/reference/android/webkit/ConsoleMessage.MessageLevel) object
to indicate the type of console message being delivered. You can query the
message level with [`messageLevel()`](https://developer.android.com/reference/android/webkit/ConsoleMessage#messageLevel()) to determine the severity of the
message, then use the appropriate [`Log`](https://developer.android.com/reference/android/util/Log) method or take other appropriate
actions.

Whether you're using
[`onConsoleMessage(String, int, String)`](https://developer.android.com/reference/android/webkit/WebChromeClient#onConsoleMessage(java.lang.String,%20int,%20java.lang.String)) or
[`onConsoleMessage(ConsoleMessage)`](https://developer.android.com/reference/android/webkit/WebChromeClient#onConsoleMessage(android.webkit.ConsoleMessage)), when you execute a console method in
your web page, Android calls the appropriate `onConsoleMessage()` method so
you can report the error. For example, with the example code, a Logcat message
is printed that looks like this:  

    Hello World -- From line 82 of http://www.example.com/hello.html

| **Note:** 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 the JavaScript `console` APIs. For more information, see [View logs with Logcat](https://developer.android.com/studio/debug/am-logcat).

The following are additional resources related to debugging:

- [Remote debug Android devices](https://developer.chrome.com/docs/devtools/remote-debugging/)
- [Debug your app](https://developer.android.com/studio/debug)

## Test experimental web features

Similar to Google Chrome's `chrome://flags` page, you can also test experimental
web features in `WebView`.

To do this, take the following steps:

1. [Install one of the `WebView` pre-release channels](https://chromium.googlesource.com/chromium/src/+/HEAD/android_webview/docs/prerelease.md)
   (beta, dev, or canary){:.external}.

2. [Switch the `WebView` channel](https://chromium.googlesource.com/chromium/src/+/HEAD/android_webview/docs/prerelease.md#trichrome-beta) on your test device to the
   installed pre-release channel.

3. Click the **WebView DevTools** launcher.

   ![WebView DevTools launcher icon.](https://developer.android.com/static/images/guide/webapps/webview-icon.png) **Figure 1.** WebView DevTools icon for app installed on a device.
4. From DevTools, click the **Flags** item and search for any experimental
   features you'd like to enable or disable. The change applies to all
   `WebView` instances on the device.

5. Stop and restart your app to start testing with the new features.

For more information about toggling flags, see the
[`WebView` DevTools documentation](https://chromium.googlesource.com/chromium/src/+/HEAD/android_webview/docs/developer-ui.md#Flag-UI).