Cómo abrir las Chrome Web Dev Tools en un móvil Android

Si te dedicas al desarrollo web, seguramente te habrás dado cuenta de la importancia de asegurarte de que tus sitios sean completamente funcionales en dispositivos móviles. Hoy en día, la mayoría del tráfico web proviene de estos dispositivos. Y si hablamos de debugging en Android, sabemos que puede ser una experiencia frustrante. Seguro que te has encontrado con errores que solo ocurren en un móvil, y depurarlos no es precisamente divertido.

Hasta ahora, las opciones más comunes para hacerlo eran:

• Usar un emulador, como los que ofrece Android Studio o Xcode en el caso de iOS.
• Conectar un dispositivo físico a tu ordenador y depurar de forma remota usando las Dev Tools.

Ambas alternativas tienen sus inconvenientes. Con los emuladores, aunque son útiles para desarrollar, no dejan de ser simulaciones de dispositivos móviles reales. Además, levantar un emulador consume muchos recursos de tu máquina. Por otro lado, depurar remotamente requiere conectar un dispositivo físico a tu ordenador, lo que puede ser un problema si trabajas en una empresa con estrictas políticas de seguridad. Ni hablar de lo tedioso que puede resultar habilitar la depuración USB y el modo desarrollador.

Y aquí es donde entra la opción que me voló la cabeza cuando la descubrí: el navegador Kiwi. Este artículo no está patrocinado, pero honestamente, la capacidad de Kiwi de ofrecer unas Web Dev Tools completamente funcionales directamente en tu móvil es impresionante. (¡Tomad nota Chrome y Firefox!)

¿Qué tiene de especial Kiwi Browser?

Kiwi Browser está basado en Chromium, por lo que si estás familiarizado con las Chrome Dev Tools, te sentirás como en casa. Puedes acceder a la consola, la pestaña de Network, Application, modificar el LocalStorage, inspeccionar cookies, y en general, hacer todo lo que harías desde tu ordenador.

Es cierto que no siempre es necesario depurar directamente en un dispositivo móvil. A veces el problema radica en el navegador en sí, especialmente cuando hablamos de Safari o Firefox. Sin embargo, tener la posibilidad de usar estas herramientas directamente en el dispositivo es un alivio para cualquier desarrollador. No más emuladores, no más conexiones por USB, solo abres el navegador y ves lo que está pasando en producción, sin complicaciones adicionales.

Hasta donde yo sé, Kiwi Browser es el único navegador en Android que te permite acceder a las Chrome Dev Tools directamente desde el dispositivo, y por eso se ha ganado un lugar permanente en mi smartphone.

Cómo habilitar las herramientas de desarrollo en Kiwi Browser

El proceso es muy sencillo. Solo debes ir a Ajustes > Herramientas de desarrollo, y automáticamente tendrás las Dev Tools habilitadas para la página actual que estés visualizando.

Podrás usar la consola, ver las peticiones en la pestaña de Network, modificar el LocalStorage, e incluso lanzar Lighthouse para hacer auditorías de rendimiento, accesibilidad y más.

En resumen, si eres un desarrollador que necesita depurar sitios en dispositivos móviles, Kiwi Browser es una herramienta que definitivamente deberías probar.