Cómo depurar de forma remota dispositivos Android

Kayce Basques

Sofia Emelianova

Depura contenido activo en un dispositivo Android de manera remota desde una computadora con Windows, Mac o Linux. Esta instructivo te enseña a hacer lo siguiente:

• Configura tu dispositivo Android para que se pueda depurar de manera remota y descúbrelo desde tu máquina de desarrollo.
• Inspecciona y depura contenido en vivo en tu dispositivo Android desde tu máquina de desarrollo.
• Presentar en pantalla el contenido de tu dispositivo Android en una instancia de Herramientas para desarrolladores en tu máquina de desarrollo.

Paso 1: Detecta tu dispositivo Android

El siguiente flujo de trabajo funciona para la mayoría de los usuarios. Consulta Solución de problemas: Herramientas para desarrolladores no detecta la interfaz de Android dispositivo para obtener ayuda adicional.

1. Abre la pantalla Opciones para desarrolladores en tu dispositivo Android. Consulta Cómo configurar el desarrollador en el dispositivo Opciones.
2. Selecciona Habilitar depuración por USB.
3. En tu máquina de desarrollo, abre Chrome.
4. Ve a chrome://inspect#devices.

5. Asegúrate de que esté habilitada la opción Descubrir dispositivos USB.

   

6. Conecta tu dispositivo Android directamente a tu máquina de desarrollo con un cable USB.

7. Si conectas tu dispositivo por primera vez, aparecerá como "Sin conexión". y la autenticación pendiente.

   

   En ese caso, acepta la solicitud de la sesión de depuración que aparece en la pantalla de tu dispositivo.

8. Si ves el nombre del modelo de tu dispositivo Android, significa que las Herramientas para desarrolladores establecieron correctamente la conexión con tu dispositivo.

   

9. Continúa con el Paso 2.

Solución de problemas: Herramientas para desarrolladores no detecta el dispositivo Android

Asegúrate de que el hardware esté configurado correctamente:

• Si usas un concentrador USB, conecta el dispositivo Android directamente a la máquina de desarrollo. en su lugar.
• Desconecta el cable USB que conecta el dispositivo Android al equipo de desarrollo. a volver a enchufarlo. Hazlo cuando las pantallas de tu dispositivo Android y del equipo de desarrollo estén desbloqueadas.
• Asegúrate de que el cable USB funcione. Deberías poder inspeccionar los archivos en tu dispositivo Android de tu máquina de desarrollo.

Asegúrate de que el software esté configurado correctamente:

• Si tu máquina de desarrollo ejecuta Windows, intenta instalar manualmente los controladores USB de tu dispositivo Android. Consulta Cómo instalar controladores USB de OEM.
• Algunas combinaciones de Windows y dispositivos Android (especialmente Samsung) requieren configuración adicional. Consulta Los dispositivos con Herramientas para desarrolladores de Chrome no detectan un dispositivo cuando se conectan.

Si no aparece el mensaje Permitir depuración por USB en el dispositivo Android, prueba lo siguiente:

• Desconectar y volver a conectar el cable USB mientras Herramientas para desarrolladores está enfocado en tu desarrollo y se muestra la pantalla de inicio de Android. En otras palabras, a veces la instrucción no muestra cuando las pantallas de tu dispositivo Android o del equipo de desarrollo están bloqueadas.
• Actualizar la configuración de pantalla de tu dispositivo Android y la máquina de desarrollo para que nunca ve a dormir.
• Se establecerá el modo USB del dispositivo Android en PTP. Consulta Galaxy S4 no muestra el diálogo para autorizar la depuración por USB. .
• Selecciona Revocar autorizaciones de depuración por USB en la pantalla Opciones para desarrolladores en la el dispositivo Android para restablecerlo a un estado nuevo.

Si encuentras una solución que no se menciona en esta sección o en Los dispositivos con Herramientas para desarrolladores de Chrome no para detectar cuando está conectado, agrega una respuesta a esa pregunta de Stack Overflow o abre una en el repositorio developer.chrome.com.

Paso 2: Depura contenido en tu dispositivo Android desde la máquina de desarrollo

1. Abre Chrome en tu dispositivo Android.

2. En el archivo chrome://inspect/#devices de tu máquina de desarrollo, verás el nombre del modelo de tu dispositivo Android, seguido del su número de serie. Debajo, verás la versión de Chrome que se ejecuta en el dispositivo. con el número de versión entre paréntesis.

   

3. En el cuadro de texto Abrir pestaña con URL, ingresa una URL y, luego, haz clic en Abrir. La página se abre en un pestaña nueva en tu dispositivo Android.

   

   Cada pestaña remota de Chrome tiene su propia sección en chrome://inspect/#devices. Desde esta sección, puedes interactuar con esa pestaña. Si alguna app está usando WebView, también verás una sección para cada una de esas apps. En este ejemplo, solo hay una pestaña abierta.

4. Haz clic en Inspeccionar junto a la URL que acabas de abrir. Se abrirá una instancia nueva de Herramientas para desarrolladores.

La versión de Chrome que se ejecuta en tu dispositivo Android determina la versión de Herramientas para desarrolladores que se abre en tu máquina de desarrollo. Por lo tanto, si tu dispositivo Android ejecuta una versión antigua de Chrome, la instancia de Herramientas para desarrolladores puede verse muy diferente de la que estás acostumbrado.

Más acciones: Pausar, enfocar, volver a cargar o cerrar una pestaña

Debajo de la URL, encontrarás un menú para pausar, enfocar, volver a cargar o cerrar una pestaña.

Cómo inspeccionar elementos

Ve al panel Elements de la instancia de Herramientas para desarrolladores y coloca el cursor sobre un elemento para destacarlo. el viewport de tu dispositivo Android.

También puedes presionar un elemento en la pantalla de tu dispositivo Android para seleccionarlo en el panel Elements. Haz clic en Select Element en tu instancia de Herramientas para desarrolladores y, luego, presiona el elemento en la pantalla de tu dispositivo Android. Ten en cuenta que la opción Seleccionar elemento se inhabilita después del primer toque, por lo que tendrás que volver a habilitarla cada vez que quieras usar esta función.

Presentar en pantalla la pantalla de tu dispositivo Android en la máquina de desarrollo

Haz clic en Activar o desactivar la presentación en pantalla. para ver el contenido de tu dispositivo Android en tu instancia de Herramientas para desarrolladores.

Puedes interactuar con la presentación en pantalla de varias maneras:

• Los clics se convierten en toques. Esto activa eventos táctiles adecuados en el dispositivo.
• Las pulsaciones de teclas de tu computadora se envían al dispositivo.
• Para simular un gesto de pellizcar, mantén presionada la tecla Mayúsculas mientras arrastras.
• Para desplazarte, usa el panel táctil, la rueda del mouse o el puntero del mouse.

Algunas notas sobre la presentación en pantalla:

• Las presentaciones en pantalla solo muestran el contenido de la página. Las partes transparentes de la presentación en pantalla representan el dispositivo. interfaces, como la barra de direcciones de Chrome, la barra de estado de Android o el teclado de Android.
• Las presentaciones en pantalla tienen un efecto negativo en la velocidad de fotogramas. Inhabilitar la presentación en pantalla mientras se miden los desplazamientos o animaciones para obtener un panorama más preciso del rendimiento de tu página.
• Si la pantalla del dispositivo Android se bloquea, el contenido de la presentación en pantalla desaparecerá. Desbloquea tu Pantalla del dispositivo Android para reanudar automáticamente la presentación en pantalla.

Cómo depurar manualmente con Android Debug Bridge (adb)

En algunos casos excepcionales, un método alternativo de depuración remota puede ser útil. Por ejemplo, es posible que quieras conectarte directamente al protocolo de Herramientas para desarrolladores de Chrome (CDP) de tu Chrome en Android.

Para ello, puedes usar Android Debug Bridge (adb):

1. Asegúrate de habilitar las Opciones para desarrolladores y la depuración por USB en tu dispositivo Android.
2. Abre Chrome en tu dispositivo Android.

3. Conecta el dispositivo Android a tu máquina de desarrollo a través de lo siguiente:

   • Un cable USB (recto).
   • Como alternativa, adb Wi-Fi connection.

4. En la línea de comandos de tu máquina de desarrollo, ejecuta adb devices -l y verifica si tu dispositivo aparece en la lista.

5. Reenvía el socket de CDP del dispositivo al puerto local de la máquina, por ejemplo, 9222. Para ello, ejecuta el siguiente comando:

   adb forward tcp:9222 localabstract:chrome_devtools_remote
   

6. Una vez que se haya establecido la conexión correctamente, verás lo siguiente:

   • http://localhost:9222/json enumera tus page objetivos.
   • http://localhost:9222/json/version expone el extremo de destino browser, como se indica en la documentación del CDP.
   • Se propaga chrome://inspect/#devices, incluso sin marcar el parámetro de configuración Discover USB devices.

Para solucionar problemas, consulta lo siguiente:

• Documentación de adb

• De manera opcional, puedes leer guías más antiguas:

  • remote-debugging-legacy
  • depuración remota
  • girish.in/…how