Depure remotamente conteúdo ativo de um dispositivo Android remotamente em um computador Windows, Mac ou Linux. Este tutorial ensina a:
- configurar seu dispositivo Android para a depuração remota e descobri-lo usando sua máquina de desenvolvimento;
- inspecionar e depurar conteúdo ativo no seu dispositivo Android usando sua máquina de desenvolvimento;
- fazer screencast do conteúdo de um dispositivo Android para uma instância do DevTools em sua máquina de desenvolvimento.
Etapa 1: descobrir o dispositivo Android
O fluxo de trabalho abaixo funciona para a maioria dos usuários. Veja Solução de problemas: o DevTools não está detectando o dispositivo Android para mais ajuda.
- Abra a tela Developer Options no Android. Veja Configurar as Opções do desenvolvedor no dispositivo.
- Selecione Enable USB Debugging.
- Na máquina de desenvolvimento, abra o Chrome.
- Abra o DevTools.
-
No DevTools, clique em Main Menu
e selecione More tools > Remote devices. 
Imagem 2. Abrir a guia Remote Devices por meio do Main Menu -
No DevTools, abra a guia Settings.
-
Verifique se a caixa de seleção Discover USB devices está ativada.
Imagem 3. A caixa de seleção Discover USB Devices está ativada -
Conecte diretamente o dispositivo Android à máquina de desenvolvimento usando um cabo USB. A primeira vez que você faz isso, você geralmente percebe que o DevTools detectou um dispositivo desconhecido. Se você ver um ponto verde e o texto Connected abaixo do nome do modelo do seu dispositivo Android, o DevTools estabeleceu a conexão para o dispositivo. Continuar para a Etapa 2
Imagem 4. A guia Remote Devices detectou um dispositivo desconhecido que aguarda autorização -
Se o seu dispositivo estiver aparecendo como Unknown, aceite a solicitação de permissão Allow USB Debugging em seu dispositivo Android.
Solução de problemas: O DevTools não está detectando o dispositivo Android
Certifique-se de que seu hardware esteja configurado corretamente:
- Se você estiver usando um hub USB, tente conectar seu dispositivo Android diretamente à sua máquina de desenvolvimento.
- Tente desconectar o cabo USB entre o dispositivo Android e a máquina de desenvolvimento e conectá-lo novamente. Faça isso enquanto as telas de seu Android e da máquina de desenvolvimento estiverem desbloqueadas.
- Certifique-se de que o seu cabo USB funciona. Deve ser possível inspecionar arquivos em seu dispositivo Android de sua máquina de desenvolvimento.
Certifique-se de que seu software esteja configurado corretamente:
- Se sua máquina de desenvolvimento estiver executando o Windows, tente instalar manualmente os drivers USB para seu dispositivo Android. Veja Instalar drivers USB OEM.
- Algumas combinações de dispositivos Windows e Android (especialmente Samsung) exigem configurações adicionais. Veja Dispositivos Chrome DevTools não detectam o dispositivo quando conectado.
Se você não vir o prompt Allow USB Debugging no seu dispositivo Android, tente:
- desconectar e reconectar o cabo USB enquanto o DevTools está em foco na sua máquina de desenvolvimento e a tela inicial do Android está aparecendo. Em outras palavras, às vezes o prompt não aparece quando as telas do Android ou da sua máquina de desenvolvimento estão bloqueadas;
- atualizar as configurações de tela do dispositivo Android e da máquina de desenvolvimento para que eles nunca fiquem suspensos;
- configurar o modo USB do Android para PTP. Veja a caixa de diálogo O Galaxy S4 não mostra a autorização para depuração USB;
- selecionar Revoke USB Debugging Authorizations na tela Developer Options no dispositivo Android para redefini-lo para um novo estado.
Se você encontrar uma solução que não se encontre nesta seção ou em Dispositivos Chrome DevTools não detectam dispositivo quando conectado no, adicione uma resposta a essa pergunta do Stack Overflow ou abra um problema no repositório do webfundamentals!
Etapa 2: depurar conteúdo no dispositivo Android em uma máquina de desenvolvimento
- Abra o Chrome em seu dispositivo Android.
-
Em Remote Devices, clique na guia que corresponde ao nome do modelo do seu dispositivo Android. Na parte superior da página, você verá o nome do modelo do dispositivo Android, seguido pelo número de série. Abaixo, você verá a versão do Chrome executado no dispositivo, com o número de versão entre parênteses. Cada guia aberta do Chrome tem a própria seção. Você pode interagir com essa guia nessa seção. Se um aplicativo estiver usando o WebView, você também verá uma seção para cada um desses aplicativos. Na Imagem 5 não há guias nem WebViews abertos.
Imagem 5. Um dispositivo remoto conectado -
Na caixa de texto New tab, insira um URL e clique em Open. A página abre em uma nova guia no seu dispositivo Android.
-
Clique em Inspect ao lado do URL que acabou de abrir. Será aberta uma nova instância do DevTools. A versão do Chrome executada no dispositivo Android determina a versão do DevTools aberta na máquina de desenvolvimento. Portanto, se a versão do Chrome em execução no dispositivo Android for muito antiga, a instância do DevTools poderá ser bem diferente da habitual.
Mais ações: atualizar, atribuir foco ou fechar uma guia
Clique em More Options ao lado da
guia que você quer atualizar, atribuir foco ou fechar.
Inspecionar elementos
Acesse o painel Elements da instância do DevTools e passe o cursor sobre um elemento para destacá-lo na janela de visualização do 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
o elemento na tela do dispositivo Android. Observe que Select Element
é desativado após o primeiro toque. Portanto, é necessário reativá-lo sempre que
você quiser usar esse recurso.
Transmitir a tela do Android para a máquina de desenvolvimento
Clique em Toggle Screencast 
para ver o conteúdo do dispositivo Android na instância do DevTools.
Você pode interagir com o screencast de diversas maneiras:
- Os cliques são convertidos em toques, acionando eventos de toque corretos no dispositivo.
- O comando das teclas pressionadas no computador é enviado ao dispositivo.
- Para simular um gesto de pinça, mantenha Shift pressionado enquanto arrasta.
- Para rolar, use o trackpad, a barra de roda do mouse ou navegue com o cursor do mouse.
Algumas observações sobre screencasts:
- Os screencasts exibem somente o conteúdo da página. As partes transparentes do screencast representam interfaces do dispositivo, como a barra de endereço do Chrome, a barra de status ou o teclado do Android.
- Os screencasts afetam negativamente as taxas de frames. Desative screencasts durante a medição de rolagens ou animações para ter uma noção mais precisa do desempenho da página.
- Se a tela do dispositivo Android bloquear, o conteúdo do screencast desaparecerá. Desbloqueie a tela do dispositivo Android para retomar automaticamente o screencast.
Feedback
Was this page helpful?