Share via


Depurar remotamente dispositivos Android

Depuração remota de conteúdo ao vivo em um dispositivo Android do computador Windows ou macOS. A página do tutorial a seguir ensina como:

  • Configure seu dispositivo Android para depuração remota e descubra-o no computador de desenvolvimento.

  • Inspecione e depure o conteúdo ao vivo em seu dispositivo Android do seu computador de desenvolvimento.

  • Conteúdo do screencast do seu dispositivo Android em uma instância do DevTools em seu computador de desenvolvimento.

Observação

Atualmente, não há suporte para depuração remota do aplicativo Microsoft Edge em dispositivos iOS. O guia a seguir é especificamente focado na depuração remota do Microsoft Edge em dispositivos Android. Se você tiver um dispositivo macOS, siga o guia Depuração do Brightcove para depurar remotamente o Microsoft Edge em um dispositivo iOS usando o Safari. Para obter mais informações sobre a ferramenta Do Inspetor Web no Safari, consulte Ferramentas de Desenvolvimento Web do Safari.

Etapa 1: descobrir seu dispositivo Android

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

  1. Abra a tela Opções do Desenvolvedor em seu Android. Consulte Configurar opções de desenvolvedor no dispositivo.

  2. Selecione Habilitar depuração USB.

  3. Em seu computador de desenvolvimento, abra o Microsoft Edge.

  4. Na barra Endereço, vá para edge://inspect.

    A página edge://inspect no Microsoft Edge

  5. Conecte seu dispositivo Android diretamente ao computador de desenvolvimento usando um cabo USB. Na primeira vez que você tentar se conectar, um prompt deve ser exibido sobre o DevTools detectar um dispositivo desconhecido. Aceite o prompt de permissão Permitir de depuração USB em seu dispositivo Android.

    O prompt de permissão Permitir de depuração USB em um dispositivo Android

  6. Se o nome do modelo do seu dispositivo Android for exibido, o Microsoft Edge estabeleceu com êxito a conexão com seu dispositivo. Continue até a seção Etapa 2 .

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

Use as dicas a seguir para ajudá-lo a solucionar os problemas das configurações corretas para seu hardware.

  • Se você estiver usando um hub USB, tente conectar seu dispositivo Android diretamente ao seu computador de desenvolvimento.
  • Tente desconectar o cabo USB entre o dispositivo Android e o computador de desenvolvimento e, em seguida, conectar novamente o cabo USB. Conclua a tarefa enquanto as telas do computador Android e desenvolvimento são desbloqueadas.
  • Verifique se o cabo USB funciona. Você deve ser capaz de inspecionar arquivos em seu dispositivo Android do seu computador de desenvolvimento.

Use as dicas a seguir para ajudá-lo a verificar se o software está configurado corretamente.

Se o prompt Permitir Depuração USB não for exibido em seu dispositivo Android, tente:

  • Desconectando e conectando novamente o cabo USB enquanto o DevTools está em foco no computador de desenvolvimento e a tela inicial do Android está sendo exibida. Às vezes, o prompt não é exibido quando as telas do computador Android ou de desenvolvimento são bloqueadas.
  • Atualizando as configurações de exibição do dispositivo Android e do computador de desenvolvimento para que elas nunca durmam.
  • Definindo o modo USB para Android como 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 em seu dispositivo Android para redefini-lo para um novo estado.

Se você encontrar uma solução que não seja mencionada nesta página ou em Dispositivos DevTools não detectar dispositivo quando conectado ao Stack Overflow, adicione sua solução à pergunta Stack Overflow.

Etapa 2: Depurar conteúdo em seu dispositivo Android do computador de desenvolvimento

  1. Abra o Microsoft Edge em seu dispositivo Android.

  2. Acesse edge://inspect. O nome do modelo do dispositivo Android é exibido, seguido pelo número de série do dispositivo. Abaixo disso, a versão do Microsoft Edge em execução no dispositivo deve ser exibida, com o número da versão em parênteses. Cada guia aberta do Microsoft Edge obtém uma seção exclusiva. Você pode interagir com essa guia de uma seção.

Um dispositivo remoto conectado

  1. Na guia Abrir com a caixa de texto url , insira uma URL e clique em Abrir. A página é aberta em uma nova guia em seu dispositivo Android.

  2. Clique em inspecionar ao lado da URL que você acabou de abrir. Uma nova instância de DevTools é aberta.

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

Selecione guia de foco, recarregar ou fechar ao lado da guia que você deseja concentrar, atualizar ou fechar.

Os botões para concentrar, atualizar ou fechar uma guia

Inspecionar elementos

Acesse a ferramenta Elementos da instância de DevTools e passe o mouse sobre um elemento para realçá-lo no modo de exibição do seu dispositivo Android.

Você também pode tocar em um elemento na tela do dispositivo Android para selecioná-lo na ferramenta Elementos . Clique no ícone Selecionar Elemento (Selecione Elemento) na instância de DevTools e selecione o elemento na tela do dispositivo Android.

Observação

Selecione Elemento está desabilitado após a primeira seleção, portanto, você precisa habilitá-lo novamente sempre que quiser usar esse recurso.

Screencast sua tela Android para seu computador de desenvolvimento

Clique no ícone Alternar Screencast (Alternar o Screencast) para exibir o conteúdo do seu dispositivo Android na instância de DevTools.

Você pode interagir com o screencast de várias maneiras:

  • Os cliques são traduzidos em toques, disparando eventos de toque adequados no dispositivo.
  • Os golpes de tecla no computador são enviados para o dispositivo.
  • Para simular um gesto de beliscão, segure Shift enquanto arrasta.
  • Para rolar, use o trackpad ou a roda do mouse ou o arremesso com o ponteiro do mouse.

Use as seguintes dicas para ajudá-lo a exibir o screencast:

  • Os screencasts exibem apenas o conteúdo da página. Partes transparentes do screencast representam interfaces do dispositivo, como a barra endereço do Microsoft Edge, a barra de status Android ou o teclado Android.
  • Os screencasts afetam negativamente as taxas de quadros. Desabilite o screencasting ao medir rolamentos ou animações para obter uma imagem mais precisa do desempenho de sua página.
  • Se a tela do dispositivo Android for bloqueada, o conteúdo do screencast desaparecerá. Desbloqueie a tela do dispositivo Android para retomar automaticamente o screencast.

Observação

Partes desta página são modificações baseadas no trabalho criado e compartilhado pelo Google e usadas de acordo com os termos descritos na Licença Pública Creative Commons Atribuição 4.0 Internacional. A página original é encontrada aqui e é de autoria de Kayce Basques (Technical Writer, Chrome DevTools & Lighthouse).

Licença Creative Commons Este trabalho é licenciado sob uma Licença Internacional de Atribuição do Creative Commons 4.0.