Fecha de publicación: 19 de mayo de 2026
Las herramientas de codificación de IA son increíblemente potentes para escribir código, pero a menudo están desconectadas de su ejecución. Pueden generar una app web compleja, pero no pueden observar su comportamiento ni inspeccionar su resultado en un navegador en vivo.
Las Herramientas para desarrolladores de Chrome para agentes proporcionan a tu agente de codificación la visibilidad que necesita para verificar, depurar y optimizar el código en tiempo real. Hace un par de meses, lo mostramos por primera vez y ahora nos complace anunciar que las Herramientas para desarrolladores de Chrome para agentes ya están disponibles como una versión estable 1.0.
Conecta tu agente al navegador
Las Herramientas para desarrolladores de Chrome para agentes permiten que tu agente experimente tu sitio como lo haría un usuario real. Esta versión estable incluye varias formas de interactuar con Chrome para ti y tu agente:
- Servidor del Protocolo de contexto del modelo (MCP): Es un servidor que conecta modelos de lenguaje grandes (LLM) a las capacidades de depuración de las Herramientas para desarrolladores.
- Interfaz de línea de comandos (CLI): Es una alternativa eficiente en cuanto a tokens que permite a los agentes agrupar acciones en secuencias de comandos.
- Habilidades del agente: Son instrucciones expertas que le enseñan a tu agente cómo y cuándo usar herramientas específicas para tareas como la accesibilidad o la depuración del rendimiento.
Depura, emula y audita automáticamente
Con la versión 1.0, tu agente de codificación ahora puede realizar tareas de depuración avanzadas que antes eran manuales.
Automatiza las auditorías de calidad
Tu agente ahora puede ejecutar auditorías de Lighthouse para evaluar la calidad del sitio web . Puede identificar problemas de accesibilidad, SEO, prácticas recomendadas y navegación de agentes. Es como tener un linter que entiende el tiempo de ejecución. Cuando se usa como puerta de calidad, convierte a tu agente de codificación en un experto que detecta bloqueadores críticos antes de que lleguen a la producción.
Emula experiencias del usuario del mundo real
Tu agente puede usar las Herramientas para desarrolladores para agentes para probar cómo se ve y funciona un sitio en varios dispositivos o en diferentes ubicaciones con herramientas de emulación. Puede cambiar el tamaño de las ventanas, simular ubicaciones geográficas y limitar las velocidades de la red y la CPU para imitar las condiciones del mundo real. De esta manera, tu agente puede probar comportamientos específicos para dispositivos móviles, como los menús de hamburguesas, sin que tengas que cambiar el tamaño del navegador de forma manual.
Desarrolla y depura extensiones de Chrome
También puedes permitir que tu agente no solo te ayude a desarrollar extensiones de Chrome, sino también a depurarlas. Tu agente puede instalar, volver a cargar y activar acciones de extensión directamente. Esto ayuda a automatizar el ciclo frecuente de "guardar y actualizar" durante el desarrollo. También puede profundizar en las secuencias de comandos en segundo plano y las páginas de extensión para ayudarte a corregir errores en configuraciones de navegador más complejas.
Depura y prueba las herramientas de WebMCP
También estamos brindando visibilidad detallada a la prueba de origen de WebMCP (Protocolo de contexto del modelo web) para ayudarte a implementar esta nueva API.
En lugar de que tu agente dependa de señales para inferir un plan para navegar por el DOM, puede interactuar directamente con herramientas estructuradas que expones con WebMCP. Esto facilita el desarrollo, la prueba y la depuración de estas herramientas: tu agente puede enumerar, invocar de forma programática y validar su exactitud en tiempo real. Esto optimiza el proceso de agregar compatibilidad con WebMCP a tu sitio y probarlo.
Detecta y depura las fugas de memoria
También agregamos herramientas dedicadas para el análisis de memoria. Tu agente ahora puede tomar instantáneas del montón para identificar fugas de memoria, como nodos DOM separados. Con el uso de habilidades especializadas de depuración de fugas de memoria, el agente actúa como un experto en rendimiento para ayudarte a mantener tu aplicación optimizada y rápida.
Transfiere sesiones con conexión automática
Puedes compartir el contexto actual del navegador con un agente, en lugar de que el agente abra su propia instancia de navegador en un entorno de pruebas (que es la forma en que las Herramientas para desarrolladores para agentes suelen dar acceso a los agentes al navegador). Esto es perfecto para depurar elementos que requieren un acceso, como un panel autenticado, en el que deseas que el agente de IA se encargue de la investigación técnica sin que tengas que volver a autenticar todo.
Expón el estado interno con herramientas para desarrolladores de terceros
Las herramientas para desarrolladores de terceros permiten que tu aplicación web comparta el estado interno y los detalles de los componentes directamente con los agentes de IA. Al proporcionar acceso a datos que suelen estar ocultos del análisis estándar, estas herramientas les brindan a los agentes el contexto que necesitan para comprender la lógica compleja. Esto da como resultado sugerencias de depuración más precisas en función de cómo se comporta realmente la aplicación en el navegador.
Comenzar
Puedes instalar la versión estable con npm o configurarla directamente en el agente que elijas:
Antigravity
Las Herramientas para desarrolladores de Chrome para agentes vienen precompiladas con Antigravity 2.0. Puedes comenzar a usarlo de inmediato con el agente secundario del navegador. Intenta usar un comando de barra como el siguiente:
/browser Navigate to the Google homepage
Para acceder a habilidades especializadas del agente, te recomendamos que instales el complemento de Herramientas para desarrolladores durante el paso Compila con Google de la configuración inicial o en la configuración de la aplicación. Para obtener más información, consulta la documentación del subagente del navegador de Antigravity Browser.
Gemini CLI
Para instalar el paquete y las habilidades de MCP como una extensión, usa el siguiente comando:
$ gemini extensions install --auto-update https://github.com/ChromeDevTools/chrome-devtools-mcp
Claude Code
Para instalar las Herramientas para desarrolladores de Chrome para agentes como un complemento de Claude Code, usa los siguientes comandos de barra en Claude Code. Agrega el registro de Marketplace:
/plugin marketplace add ChromeDevTools/chrome-devtools-mcp
E instala el complemento desde el registro de Marketplace:
/plugin install chrome-devtools-mcp@chrome-devtools-plugins
Para obtener guías más detalladas y ejemplos de mensajes, consulta nuestra documentación de las Herramientas para desarrolladores de Chrome para agentes. También puedes explorar el código fuente en GitHub.