Depurar dispositivos Android remotamente

Kayce Basques

Sofia Emelianova

Depure remotamente conteúdo ativo de um dispositivo Android usando um computador Windows, Mac ou Linux. Isso ensina você a:

• Configure seu dispositivo Android para a depuração remota e descubra usando sua máquina de desenvolvimento.
• Inspecione e depure conteúdo ativo no dispositivo Android usando a máquina de desenvolvimento.
• Fazer screencast do conteúdo de um dispositivo Android para uma instância do DevTools na máquina de desenvolvimento.

Etapa 1: descobrir seu dispositivo Android

O fluxo de trabalho abaixo funciona para a maioria dos usuários. Consulte Solução de problemas: o DevTools não está detectando o Android dispositivo para receber mais ajuda.

1. Abra a tela Opções do desenvolvedor no Android. Consulte Configurar o desenvolvedor no dispositivo Opções.
2. Selecione Ativar depuração USB.
3. Na máquina de desenvolvimento, abra o Chrome.
4. Acesse chrome://inspect#devices.

5. Verifique se a opção Descobrir dispositivos USB está ativada.

   

6. Conecte o dispositivo Android diretamente à máquina de desenvolvimento usando um cabo USB.

7. Se você estiver conectando o dispositivo pela primeira vez, ele aparecerá como "Off-line" e autenticação pendente.

   

   Nesse caso, aceite a solicitação da sessão de depuração na tela do dispositivo.

8. Se o nome do modelo do seu dispositivo Android for exibido, isso significa que o DevTools estabeleceu a conexão com o dispositivo.

   

9. Prossiga para a Etapa 2.

Solução de problemas: o DevTools não está detectando o dispositivo Android

Verifique se o hardware está configurado corretamente:

• Se você estiver usando um hub USB, tente conectar o dispositivo Android diretamente à máquina de desenvolvimento como alternativa.
• Tente desconectar o cabo USB do dispositivo Android da máquina de desenvolvimento e, em seguida, e conectá-lo novamente. Faça isso enquanto as telas do Android e da máquina de desenvolvimento estiverem desbloqueadas.
• Verifique se o cabo USB funciona. Você poderá inspecionar arquivos no seu dispositivo Android da sua máquina de desenvolvimento.

Verifique se o software está configurado corretamente:

• Se sua máquina de desenvolvimento estiver executando o Windows, tente instalar manualmente os drivers USB do dispositivo Android. Consulte Instalar drivers USB OEM.
• Algumas combinações de dispositivos Windows e Android (principalmente Samsung) exigem configuração extra. Consulte Os dispositivos Chrome DevTools não detectam o dispositivo quando ele está conectado.

Se a solicitação Permitir a depuração USB não aparecer no dispositivo Android, tente o seguinte:

• Desconectar e reconectar o cabo USB enquanto o DevTools está em foco no desenvolvimento máquina e a tela inicial do Android aparecer. Em outras palavras, às vezes o comando não mostra quando as telas do Android ou da máquina de desenvolvimento estão bloqueadas.
• Atualize as configurações de tela do dispositivo Android e da máquina de desenvolvimento para que elas nunca adormecer.
• Configurando o modo USB do Android para PTP. Consulte O Galaxy S4 não mostra a caixa de diálogo "Autorizar depuração USB" .
• Selecione Revogar autorizações de depuração USB na tela Opções do desenvolvedor no dispositivo Android para redefini-lo para um novo estado.

Se você encontrar uma solução que não foi mencionada nesta seção ou em Dispositivos Chrome DevTools não detectar dispositivo quando conectado, adicione uma resposta à pergunta do Stack Overflow ou abra uma problema no repositório developer.chrome.com.

Etapa 2: depurar conteúdo no dispositivo Android usando a máquina de desenvolvimento

1. Abra o Chrome no seu dispositivo Android.

2. No chrome://inspect/#devices da máquina de desenvolvimento, você verá o nome do modelo do dispositivo Android seguido por o número de série. Abaixo disso, você verá a versão do Chrome que está sendo executada no dispositivo, com o número da versão entre parênteses.

   

3. Na caixa de texto Abrir guia com URL, digite um URL e clique em Abrir. A página é aberta nova guia em seu dispositivo Android.

   

   Cada guia remota do Chrome tem uma seção própria no chrome://inspect/#devices. É possível interagir com essa guia nessa seção. Se algum app usar o WebView, você também verá uma seção para cada um deles. Neste exemplo, há apenas uma guia aberta.

4. Clique em Inspecionar ao lado do URL que você acabou de abrir. Uma nova instância do DevTools será aberta.

A versão do Chrome em execução no dispositivo Android determina a versão do DevTools aberta na máquina de desenvolvimento. Portanto, se o dispositivo Android estiver executando uma versão muito antiga do Chrome, a instância do DevTools poderá ser muito diferente da que você costuma usar.

Mais ações: pausar, focar, atualizar ou fechar uma guia

Abaixo do URL, você encontra um menu para pausar, focar, atualizar ou fechar uma guia.

Inspecionar elementos

Acesse o painel Elements da sua instância do DevTools e passe o cursor sobre um elemento para destacá-lo. a janela de visualização do seu dispositivo Android.

Também é possível tocar em um elemento na tela do dispositivo Android para selecioná-lo no painel Elements. Clique em Select Element na instância do DevTools e toque no elemento na tela do dispositivo Android. Observe que Selecionar elemento fica desativado após o primeiro toque, portanto, será necessário reativá-lo sempre que você quiser usar esse recurso.

Fazer screencast da tela do Android para sua máquina de desenvolvimento

Clique em Alternar screencast. para visualizar o conteúdo do dispositivo Android na instância do DevTools.

É possível interagir com o screencast de várias maneiras:

• Os cliques são convertidos em toques, acionando eventos de toque corretos no dispositivo.
• As teclas pressionadas no computador são enviadas ao dispositivo.
• Para simular um gesto de pinça, mantenha a tecla Shift pressionada enquanto arrasta.
• Para rolar, use o trackpad, a roda do mouse ou navegue com o ponteiro do mouse.

Algumas observações sobre screencasts:

• Os screencasts mostram apenas o conteúdo da página. As partes transparentes do screencast representam o dispositivo interfaces do usuário, como a barra de endereço do Chrome, a barra de status do Android ou o teclado do Android.
• Os screencasts afetam negativamente os frame rates. Desativar screencasting ao medir rolagens ou animações para gerar uma imagem mais precisa do desempenho da página.
• Se a tela do dispositivo Android bloquear, o conteúdo do screencast desaparecerá. Desbloqueie seu Tela do dispositivo Android para retomar automaticamente o screencast.

Depurar manualmente pelo Android Debug Bridge (adb)

Em alguns casos raros, um método alternativo de depuração remota pode ser útil. Por exemplo, talvez você queira se conectar diretamente ao protocolo Chrome DevTools (CDP, na sigla em inglês) do seu Chrome no Android.

Para fazer isso, use o Android Debug Bridge (adb):

1. Ative as Opções do desenvolvedor e a Depuração USB no dispositivo Android.
2. Abra o Chrome no seu dispositivo Android.

3. Conecte o dispositivo Android à máquina de desenvolvimento usando:

   • Um cabo USB (direto).
   • Você também tem a opção adb Wi-Fi connection.

4. Na linha de comando da máquina de desenvolvimento, execute adb devices -l e confira se o dispositivo está na lista.

5. Encaminhe o soquete do CDP no dispositivo para a porta local da sua máquina, por exemplo, 9222. Para fazer isso, execute:

   adb forward tcp:9222 localabstract:chrome_devtools_remote
   

6. Quando a conexão for concluída, confira o seguinte:

   • http://localhost:9222/json lista suas metas de page.
   • http://localhost:9222/json/version expõe o endpoint de destino browser, conforme indicado na documentação do CDP.
   • chrome://inspect/#devices será preenchido, mesmo que a configuração Descobrir dispositivos USB esteja marcada.

Para resolver problemas, consulte:

• Documentação do adb (link em inglês)

• Opcionalmente, você pode ler guias mais antigos:

  • remote-debugging-legacy (link em inglês)
  • remote-debugging (em inglês)
  • girish.in/…how