Conecta tu agente de IA directamente a tu instancia de navegador activa con la función de conexión automática. Esto permite que tu agente omita las limitaciones de la zona de pruebas heredando tus pestañas actuales, las extensiones del navegador y el estado de la aplicación en vivo.
Heredar el contexto de tu flujo de trabajo permite que tu agente pase de escribir código a depurar el estado de tu navegador en vivo sin perder datos de la sesión. Esto es útil cuando ya alcanzaste un estado de aplicación específico (como un proceso de confirmación de compra complejo o un error reproducido de forma manual) y quieres que tu agente se encargue de la investigación técnica sin volver a ejecutar esos pasos de forma manual.
Ten en cuenta lo siguiente antes de habilitar la conexión automática:
- Seguridad y privacidad: Cuando la conexión automática está activa, tu agente tiene acceso a todos los datos de tu perfil del navegador, incluidas las pestañas abiertas, el almacenamiento de sesión, el almacenamiento local, las cookies y otros datos que se muestran a través de las APIs de JavaScript.
- Garantía de privacidad de los datos: El servidor de Herramientas para desarrolladores de Chrome para agentes es un proceso local y no envía tus datos de navegación, tokens de sesión ni telemetría a Google.
- Confianza y mensajes: Usa este modo solo con los agentes en los que confías y ten cuidado con la información que incluyes en los mensajes.
Requisitos previos
Antes de usar la función de conexión automática, asegúrate de tener lo siguiente:
- Chrome 144 o versiones posteriores: La conexión automática requiere protocolos de depuración modernos que se encuentran en las versiones actuales de Chrome.
- Canal de Chrome correcto: Tu agente se conecta a Chrome Stable de forma predeterminada. Para usar Canary o Beta, especifica el canal en tu configuración.
- Depuración remota habilitada: Habilita manualmente el puente entre tu navegador y el agente.
- Configuración correcta: Debes actualizar la configuración de MCP para incluir
la marca
--autoConnect.
Configura la conexión automática
Para configurar la función de conexión automática en tu servidor de MCP, haz lo siguiente:
- En el navegador Chrome en ejecución, navega a
chrome://inspect/#remote-debuggingy habilita la depuración remota. Actualiza tu configuración de MCP para incluir la marca
--autoConnect:{ "mcpServers": { "chrome-devtools": { "command": "npx", "args": ["chrome-devtools-mcp@latest", "--autoConnect"] } } }Pídele a tu agente que interactúe con tu app de Chrome abierta. Cuando Chrome solicite permiso para permitir la sesión, haz clic en Permitir.
Tu agente ahora usa el servidor de MCP para interactuar con tu aplicación de Chrome en ejecución.
Casos de uso de la conexión automática
La conexión automática te permite usar herramientas o estados que no se pueden usar en sesiones de Chrome en zona de pruebas. Por ejemplo, en lugar de pedirle a tu agente que acceda, lo que suele fallar, puedes navegar a la página y acceder. Luego, pídele a tu agente que se encargue.
En las siguientes secciones, se incluyen algunos ejemplos de casos de uso de la función de conexión automática.
Depura paneles autenticados
Las herramientas internas y los paneles privados suelen estar detrás de capas complejas de inicio de sesión único (SSO) o de red privada virtual (VPN). Un navegador en zona de pruebas suele requerir un acceso que tu agente no puede omitir. Con la conexión automática, tu agente hereda tu sesión activa.
Ejemplo de mensaje:
I have my company's staging dashboard open in the next tab. Can you look at the
User Analytics chart, find the SVG element for the Friday data point, and tell
me why the tooltip isn't appearing on hover?
Ejemplo de ejecución del agente: Tu agente identifica tu proceso de Chrome existente, encuentra la pestaña activa y examina el árbol de accesibilidad para ubicar los elementos. También puede usar las APIs de JavaScript para evaluar conflictos específicos.
Corrige en vivo tu pestaña actual
Evita reproducir errores de forma manual. En lugar de traducir los pasos de reproducción en un mensaje nuevo para un agente en zona de pruebas, puedes pedirle a tu agente que corrija el error en la página activa en la que ya lo encontraste.
Ejemplo de mensaje:
Look at the current page. The Submit button overlaps with the footer on this
screen size. Generate a fix for the layout and verify it by injecting the CSS
directly into this tab.
Ejemplo de ejecución del agente: Como está conectado a tu ventana activa, tu agente analiza tu diseño y aplica la corrección al instante. Verás que el botón se mueve en la pantalla, lo que confirma que la corrección funciona antes de actualizar el código fuente.