Men-debug aplikasi web

Anda dapat men-debug JavaScript menggunakan console JavaScript API dan melihat pesan output di Logcat. Jika Anda sudah terbiasa men-debug halaman web dengan Firebug atau Web Inspector, Anda mungkin sudah terbiasa menggunakan console (seperti console.log()). Framework WebKit Android mendukung sebagian besar API yang sama, sehingga Anda dapat menerima log dari halaman web saat men-debug di WebView. Bagian ini menjelaskan cara menggunakan console API untuk proses debug.

Menggunakan API konsol di WebView

API konsol juga didukung saat menjalankan proses debug di WebView. Anda harus menyediakan WebChromeClient yang menerapkan metode onConsoleMessage() agar pesan konsol muncul di Logcat. Kemudian, terapkan WebChromeClient ke WebView dengan setWebChromeClient(). Untuk informasi selengkapnya, lihat dokumentasi Webview.

Contoh berikut menunjukkan cara menggunakan API konsol di 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;
    }
});

ConsoleMessage juga menyertakan objek MessageLevel untuk menunjukkan jenis pesan konsol yang sedang dikirim. Anda dapat membuat kueri level pesan dengan messageLevel() untuk menentukan tingkat keparahan pesan, lalu menggunakan metode Log yang sesuai atau mengambil tindakan lain yang sesuai.

Baik Anda menggunakan onConsoleMessage(String, int, String) atau onConsoleMessage(ConsoleMessage), saat Anda menjalankan metode konsol di halaman web, Android akan memanggil metode onConsoleMessage() yang sesuai sehingga Anda dapat melaporkan error. Misalnya, dengan kode contoh di atas, pesan Logcat dicetak yang terlihat seperti ini:

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

Berikut adalah referensi tambahan terkait proses debug:

Menguji fitur web eksperimental

Serupa dengan halaman chrome://flags Google Chrome, Anda juga dapat menguji fitur web eksperimental di WebView.

Untuk melakukannya, ikuti langkah-langkah berikut:

  1. Instal salah satu saluran pra-rilis WebView (beta, dev, atau canary){: .external}.

  2. Alihkan saluran WebView di perangkat pengujian ke saluran pra-rilis yang diinstal.

  3. Klik peluncur WebView DevTools:


    Gambar 1. Ikon DevTools WebView untuk aplikasi yang diinstal di perangkat.

  4. Dari DevTools, klik Flags dan telusuri fitur eksperimental apa pun yang ingin Anda aktifkan atau nonaktifkan. Perubahan ini berlaku untuk semua instance WebView di perangkat.

  5. Hentikan dan mulai ulang aplikasi untuk mulai menguji dengan fitur baru.

Untuk mengetahui informasi selengkapnya tentang cara mengalihkan flag, lihat dokumentasi DevTools WebView.