Depuração remota de WebViews

Depure WebViews nos seus apps Android nativos usando as Ferramentas para desenvolvedores do Chrome.

No Android 4.4 (KitKat) ou mais recente, use o DevTools para depurar o conteúdo do WebView no Android nativo. aplicativos conteinerizados.

Resumo

  • Ative a depuração de WebView no seu app Android nativo. depurar WebViews no Chrome DevTools.
  • Acesse a lista de WebViews com depuração ativada em chrome://inspect.
  • Depurar WebViews é o mesmo que depurar uma página da Web por depuração remota (link em inglês).

Configurar WebViews para depuração

A depuração do WebView precisa ser ativada no aplicativo. Para ativar a depuração do WebView, chame o método estático setWebContentsDebuggingEnabled na classe WebView.

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

Essa configuração se aplica a todas as WebViews do aplicativo.

Dica: a depuração do WebView não é afetada pelo estado da flag debuggable no manifesto do seu aplicativo. Se você quiser ativar a depuração do WebView apenas quando debuggable for true, faça o seguinte: testar a flag no ambiente de execução.

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
    if (0 != (getApplicationInfo().flags & ApplicationInfo.FLAG_DEBUGGABLE))
    { WebView.setWebContentsDebuggingEnabled(true); }
}

Abrir uma WebView no DevTools

A página chrome://inspect mostra uma lista de WebViews com depuração ativada no dispositivo.

Para iniciar a depuração, clique em inspecionar abaixo da WebView que você quer depurar. Use o DevTools como faria para uma guia do navegador remoto.

Como inspecionar elementos em uma WebView

Os gráficos cinza listados com o WebView representam seu tamanho e sua posição em relação ao tela. Se as WebViews tiverem títulos definidos, eles também serão listados.

Solução de problemas

Não consegue ver seus WebViews na página chrome://inspect?

  • Verifique se a depuração do WebView está ativada para seu app.
  • No dispositivo, abra o app com a WebView que você quer depurar. Em seguida, atualize a página chrome://inspect.