Eseguire il debug utilizzando Chrome DevTools

Puoi utilizzare DevTools integrato nel browser Chrome in esecuzione sul tuo computer di sviluppo per ispezionare ed eseguire il debug in remoto delle WebView in esecuzione nella tua app. Per una guida dettagliata al debug remoto per le WebView, consulta WebView di debug remoto.

Per saperne di più su DevTools, consulta la panoramica di Chrome DevTools.

Attivare la connessione da Chrome DevTools

Per impostazione predefinita, la WebView della tua app non consente le connessioni da Chrome DevTools. Devi attivare il debug di WebView nel codice dell'applicazione.

1. Assicurati di aver configurato l'esecuzione dell'app su un dispositivo hardware o virtuale.
2. Attiva il debug di WebView nel codice dell'applicazione chiamando setWebContentsDebuggingEnabled. Di solito questa operazione viene eseguita nella classe Activity o Application in cui viene inizializzata la WebView.

Ti consigliamo di racchiudere setWebContentsDebuggingEnabled in un controllo condizionale in modo che il debug sia abilitato solo nelle build di sviluppo, non in produzione. Questa impostazione si applica a tutti gli oggetti WebView della tua app.

Il debug di WebView non è influenzato dallo stato del flag debuggable nel manifest dell'applicazione. Se vuoi attivare il debug di WebView solo quando il flag debuggable è impostato su true, esegui il test di questo flag in fase di runtime come mostrato nell'esempio seguente:

if (applicationInfo.flags and ApplicationInfo.FLAG_DEBUGGABLE != 0) {
     WebView.setWebContentsDebuggingEnabled(true)
}

if (0 != (getApplicationInfo().flags & ApplicationInfo.FLAG_DEBUGGABLE)) {
     WebView.setWebContentsDebuggingEnabled(true);
}

Avvia il debug di WebView

Dopo aver attivato il debug di WebView nel codice dell'applicazione e l'app è in esecuzione su un dispositivo fisico o nell'emulatore Android, connetti Chrome DevTools a WebView:

1. Apri Chrome sulla macchina di sviluppo.
2. Vai a chrome://inspect.

3. Nella pagina chrome://inspect, assicurati che la casella di controllo Rileva dispositivi USB sia selezionata. Individua il tuo dispositivo nella sezione Destinazione remota.

   

4. Sotto il nome del dispositivo, Chrome elenca tutte le WebView con debug abilitato in esecuzione su quel dispositivo, in genere identificate da WebView in seguito dal nome del pacchetto dell'app. Trova la WebView di cui vuoi eseguire il debug e fai clic sul link inspect (ispeziona).

Verrà aperta una nuova istanza di DevTools che potrai utilizzare per esaminare la tua WebView.

Se pubblichi contenuti da un server web locale sulla tua macchina di sviluppo, consulta la sezione Accedere a un server di sviluppo locale da WebView per scoprire come connetterti da un dispositivo o un emulatore. Per la risoluzione dei problemi, vedi Debug remoto dei dispositivi Android e Debug remoto delle WebView.