1. Introducción
La revolución de la IA de agentes está transformando la forma en que creamos software, lo que hace que todo el proceso se sienta increíblemente genial, emocionante y accesible. Las tareas y los proyectos que antes les llevaban meses a los desarrolladores ahora se pueden completar en una sola sesión con herramientas basadas en agentes.
Un área propicia para esta transformación con agentes son las pruebas de aplicaciones web. Tradicionalmente, probar apps web ha sido una tarea tediosa y una lucha constante contra la fragilidad. Pero ¿qué pasaría si pudieras evitar esa complejidad por completo? ¿Qué pasaría si pudieras simplemente decirle a un agente qué probar en lenguaje natural y dejar que el agente razone cómo ejecutarlo?

En este codelab, exploraremos cómo usar la CLI de Antigravity junto con las habilidades del agente y las herramientas MCP multimodales, como BrowserMCP. Verás cómo crear y ejecutar pruebas de IU automatizadas con lenguaje natural, y descubrirás cómo las herramientas basadas en agentes pueden controlar tareas complejas y brindarte superpoderes como desarrollador.
Es fundamental destacar que, si bien este codelab se enfoca en los casos de uso específicos de la automatización de la IU y el control remoto del navegador, lo que realmente importa son los principios subyacentes y el enorme mundo de posibilidades que desbloquean. Al enseñarles a los agentes a usar las CLIs locales y los servidores MCP, podemos delegar flujos de trabajo complejos que, de otro modo, no tendríamos el tiempo ni la experiencia especializada para manejar por nuestra cuenta.
Qué aprenderá
- Qué es la CLI de Antigravity y cómo se integra en el ecosistema de Antigravity
- Qué es el Protocolo de contexto del modelo (MCP) y por qué representa un gran cambio.
- Cómo BrowserMCP permite que los agentes de IA controlen los navegadores web
- Cómo ejecutar pruebas automatizadas de la IU desde la CLI de Antigravity
- Comprender las habilidades del agente y sus ventajas
- Enseñar a un agente a usar Playwright con una habilidad
- Comprende el agente de navegador integrado de Antigravity.
- Otros casos de uso para el control del navegador.
Actividades
En este codelab, se usan la CLI de Antigravity, las herramientas de MCP, las habilidades de agente y una aplicación de demostración de React.
Harás lo siguiente:
- Configura tu entorno de desarrollo.
- Explorar una aplicación de demostración que necesita pruebas
- Usa la CLI de Antigravity para interactuar con la aplicación a través de BrowserMCP.
- Enséñale a tu agente a usar Playwright con una habilidad de agente.
2. El ecosistema de Antigravity
En mayo de 2026, Google lanzó la nueva suite Antigravity. Esta fue una revisión importante de Antigravity, que se dividió en los siguientes cuatro productos:
- Antigravity 2.0, que ahora es el entorno de "compilación" dedicado y centrado en el agente en tu computadora. En particular, no incluye un IDE. En su lugar, ahora solo interactuamos con el administrador de agentes. Esta plataforma tiene como objetivo marcar el comienzo de la era de "la idea al producto" con el uso de agentes, sin preocuparnos por el código. A muchos creadores que no tienen experiencia en programación les encantará esta función.
- IDE de Antigravity, que nos brinda el entorno de programación más familiar similar a VS Code, compatible con el arnés del agente de Antigravity Aquí podemos realizar un desarrollo asistido por el agente y siempre vemos el código. Los programadores se sentirán como en casa aquí.
- SDK de Antigravity, que te brinda el arnés y las herramientas que potencian Antigravity, pero expuesto como un SDK de agente de Python. Si importamos desde google.antigravity, podemos aprovechar las capacidades de Antigravity de forma programática.
- Antigravity CLI, que es la próxima evolución de la increíble Gemini CLI. Sigue siendo un entorno que prioriza la terminal para interactuar con los modelos de Gemini. Sin embargo, la nueva CLI de Antigravity está compilada en Go, y se nota. Se siente mucho más rápida que Gemini CLI, tanto durante el inicio como en el uso general. Utiliza el mismo "arnés" de agente que Antigravity 2.0 y el IDE, lo que permite una configuración y parámetros comunes en toda la suite de Antigravity.
Si bien este lab se enfoca en el uso de la CLI de Antigravity, todo lo que se explica en él también se puede hacer con el IDE de Agy o Agy 2.0.
3. Requisitos previos
Antes de comenzar con lo más interesante, asegúrate de tener todo lo que necesitas.
Herramientas
En este lab, se da por sentado que ya tienes lo siguiente:
- Navegador Chrome
- Node.js
- CLI de Antigravity
- Git
Para usar la CLI de Antigravity, deberás autenticarte con Google. La primera vez que inicies agy, se te pedirá automáticamente que accedas con Acceso con Google a través de tu navegador web predeterminado. Esta opción incluye una cuota gratuita generosa de uso de Gemini y no requiere un proyecto de Google Cloud. Si tienes una clave de la API de Gemini o un proyecto de Google Cloud, también puedes configurar esto.
En las instrucciones, se supone que trabajas en un entorno de Linux (o WSL) o macOS. Si usas Windows (como yo), puedes seguir los pasos con WSL.
(Ten en cuenta que BrowserMCP no funcionará desde Google Cloud Shell, ya que solo se conectará a un navegador local que se ejecute en la misma máquina)
Configura el entorno de desarrollo
Creé un repo de demostración en GitHub. Incluye una aplicación de ejemplo que podemos usar para nuestras pruebas de IU. Para clonarlo, ejecuta este comando desde tu terminal local:
git clone https://github.com/derailed-dash/agentic-ui-testing cd agentic-ui-testing
Hay un archivo Makefile para que te resulte más fácil configurar el entorno para iniciar la app de demostración. Ejecutémoslo para inicializar nuestro entorno:
make install # Or if you don't have make npm install --prefix demo-app
4. Nuestra aplicación de demostración
La app que probaremos hoy es The Dazbo Omni-Dash, un panel futurista con tema oscuro para administrar la telemetría de seguridad. (Sí, se hizo con vibe coding).

¿Por qué esta app?
Se creó para proporcionar una superficie de prueba realista con lo siguiente:
- Autenticación simulada: Es un flujo de acceso que requiere credenciales específicas.
- Contenido dinámico: Tarjetas de telemetría y registros de seguridad que simulan datos en tiempo real.
- Estados interactivos: Menús de navegación y entradas de formularios que cambian según la acción del usuario.
- Tecnología moderna: Se creó con React y Vite para brindar una experiencia rápida y responsiva.
Cómo iniciar la app
Para iniciar la aplicación, simplemente ejecuta el siguiente comando:
make dev # Or if you don't have make npm run dev --prefix demo-app
El servidor de desarrollo debería iniciarse muy rápido, y la app estará disponible en http://localhost:5173.

Solo tenemos que hacer clic en el vínculo para abrir la aplicación en nuestro navegador. Deja este proceso en ejecución en la terminal. Ejecutaremos los comandos de terminal posteriores en una sesión de terminal independiente.
5. El desafío de las pruebas de IU
Se sabe que las pruebas de IU tradicionales son difíciles de realizar correctamente y aún más difíciles de mantener. Los problemas comunes incluyen los siguientes:
- Curva de aprendizaje alta: Se requiere que los desarrolladores inviertan grandes cantidades de tiempo para dominar lenguajes específicos del dominio complejos y peculiaridades específicas del framework (como Selenium o Playwright) solo para automatizar una interacción básica.
- Selectores y automatización frágiles: Las secuencias de comandos tradicionales se basan en estructuras DOM rígidas (como
div > div > button) o etiquetas de texto específicas. ¿Qué sucede si cambias el nombre de un botón "Cerrar sesión" a "Salir"? ¿O mover un botón a un menú completamente diferente? ¿O cambiar la estructura de tu código HTML? Las herramientas de prueba tradicionales fallarán cuando realices esas acciones, lo que generará un mantenimiento constante de las secuencias de comandos. - Pruebas "inestables": Son pruebas que se aprueban en un minuto y fallan en el siguiente debido a problemas de sincronización, condiciones de carrera o recursos de carga lenta.
- Paridad del entorno: Lucha con estados de aplicación difíciles de replicar y la sobrecarga de limpiar los datos de prueba.

Intención vs. implementación
Para resolver estos problemas, necesitamos una forma de realizar pruebas que se centre en la intención en lugar de la implementación.
Con las herramientas de IA de agentes, podemos crear automatizaciones repetibles que están completamente aisladas de los pequeños ajustes de la IU y los cambios estructurales. En lugar de codificar de forma rígida nombres, etiquetas o la jerarquía exacta de los objetos, el agente ejecuta acciones basadas en la intención del usuario en lenguaje natural. Si un botón se mueve o su etiqueta cambia ligeramente, las capacidades multimodales del agente le permiten ubicar el elemento y completar la tarea correctamente.
6. MCP al rescate
El Protocolo de contexto del modelo (MCP) es un estándar abierto que permite que los modelos y agentes de IA interactúen con herramientas, APIs y datos externos. Piensa en él como el adaptador universal que permite que los modelos y los agentes encuentren y ejecuten las herramientas a las que tienen acceso.
Tradicionalmente, la integración de modelos de lenguaje grandes (LLM) con datos y herramientas externos requería que los desarrolladores escribieran conexiones de API personalizadas y codificadas para cada nueva fuente de datos, lo que generaba un problema de integración "M x N" insostenible en el que cada nuevo modelo y herramienta multiplicaba la carga de mantenimiento. El Protocolo de contexto del modelo (MCP) resuelve este problema, ya que elimina la necesidad de escribir código específico para coordinar estas capacidades. En lugar de codificar de forma explícita flujos de trabajo de ejecución complejos, los desarrolladores pueden confiar en el LLM para interpretar las solicitudes de lenguaje natural de un usuario y razonar de forma dinámica sobre qué herramientas usar sobre la marcha.
Cuando un usuario emite un comando en lenguaje natural (como "Navega a localhost:5173, accede como "admin" y haz clic en el botón Enviar"), el LLM descubre las capacidades disponibles y genera una solicitud estructurada para invocar una herramienta específica. El cliente de MCP actúa como traductor y enruta esta solicitud al servidor de MCP designado, que ejecuta la acción o recupera los datos y devuelve el contexto al modelo. Esto permite que la IA actúe de forma autónoma sin que el desarrollador tenga que codificar de forma rígida la ruta de ejecución específica.

Debido a que MCP crea un estándar universal, a menudo descrito como el "USB-C para aplicaciones de IA", desbloquea una reutilización masiva lista para usar. Los desarrolladores pueden compilar un servidor MCP una vez, y cualquier host de IA compatible con MCP puede conectarse a él de inmediato, lo que elimina el problema de integración de M x N. Ya no tienes que compilar puentes de API personalizados para cada plataforma; en cambio, puedes aprovechar el ecosistema de servidores MCP de código abierto prediseñados para servicios comunes como GitHub, Slack, bases de datos, lo que sea, y conectarlos directamente a tus flujos de trabajo basados en agentes. Esta arquitectura modular y plug-and-play garantiza que, si cambias de proveedores de LLM o actualizas tus herramientas más adelante, tu infraestructura de integración principal permanecerá completamente sin cambios.
7. Automatización con BrowserMCP
¿Qué es BrowserMCP?
Esta es la primera herramienta con la que vamos a jugar hoy. BrowserMCP es un servidor de MCP que les da a los agentes de IA los "ojos" y las "manos" que necesitan para interactuar con un navegador web. En pocas palabras, imita la interacción humana con un navegador. Es de código abierto y puedes consultar el repo de GitHub aquí. Consulta la documentación principal de BrowserMCP aquí.

Estas son algunas de sus capacidades:
- Puede navegar a URLs.
- Puede inspeccionar el DOM.
- Puede hacer clic en botones y escribir texto en formularios.
- Puede arrastrar y soltar.
- Puede leer los registros de la consola del navegador.
- Es rápido: La automatización se realiza de forma local en tu máquina.
Instalación de Browser MCP
Para usar BrowserMCP, debes hacer dos cosas:
- Instala la extensión BrowserMCP en Chrome (o en cualquier navegador basado en Chromium).
- Configura el servidor de MCP de forma manual en la configuración de Antigravity.
Para instalar la extensión, solo sigue las instrucciones aquí. Esto solo te tomará unos segundos. Una vez que se instale, haz clic en "Conectar" en la extensión para permitir que tu agente controle la pestaña actual (obviamente, quieres que la pestaña actual sea en la que se ejecuta la aplicación de demostración).

A continuación, configuraremos el servidor de MCP real en Antigravity. Para ello, agregamos la definición del servidor browsermcp a nuestro archivo mcp_config.json global.
Crea o edita el archivo ~/.gemini/config/mcp_config.json y agrega la siguiente configuración:
{
"mcpServers": {
"browsermcp": {
"command": "npx",
"args": [
"-y",
"@browsermcp/mcp@latest"
]
}
}
}
Para obtener una guía detallada sobre cómo configurar servidores y habilidades de MCP en el ecosistema de Antigravity, consulta estos recursos:
- Configura servidores de MCP y habilidades para la CLI y el IDE de Antigravity
- Dialling Our Agents to 11: My Favourite MCP Servers (Llevando nuestros agentes al máximo: Mis servidores de MCP favoritos)
Pruebas con BrowserMCP
Ahora, la magia. Primero, inicia la CLI de Antigravity (ejecutando agy) en una sesión de terminal nueva. (Recuerda que la aplicación de demostración se está ejecutando en nuestra sesión de terminal inicial). Dentro de la TUI interactiva, escribe /mcp para verificar la lista de herramientas activas y asegurarte de que browsermcp esté disponible.
Si no iniciaste la aplicación de demostración antes, hazlo ahora:
make dev
Si aún no lo hiciste, debes abrir la app en tu navegador Chrome y conectar la extensión BrowserMCP en esa pestaña. Sigue el vínculo del comando run. Luego, haz clic en el ícono de la extensión BrowserMCP y, luego, en "Conectar".

Ahora podemos usar la CLI de Agy para ejecutar una prueba. Copia y pega esta instrucción en la CLI:
Using BrowserMCP, connect to the application at http://localhost:5173. If the application is not showing a login screen, first logout. Then login as 'admin' with password 'password', and verify that the dashboard title says 'System Overview'. In the main dashboard, read the telemetry values shown, and present them back to me in a markdown table.
Es posible que la CLI primero verifique que la aplicación de demostración se esté ejecutando en el puerto especificado. Luego, se te pedirá que confirmes las acciones que planea realizar la herramienta.

Permite que la CLI ejecute todas las herramientas de BrowserMCP para esta sesión. Luego, vuelve al navegador y observa cómo se producen las interacciones automatizadas.
Algunos aspectos que debes tener en cuenta sobre la instrucción anterior:
- Comenzamos indicándole al agente que cierre la sesión si la aplicación ya está conectada. Ten en cuenta que no es necesario que le indiquemos al agente que haga clic en un texto específico, como "Salir de la puerta de enlace". Es lo suficientemente inteligente como para saber en qué hacer clic.
- Después de acceder y renderizar la página principal, el agente captura la información de telemetría. Nuevamente, no necesitamos indicarle al agente que busque en mosaicos específicos o que coincida con palabras específicas. Por lo tanto, si más adelante extendemos o cambiamos la información que se muestra en esta página, esta instrucción seguirá funcionando y el resultado se seguirá capturando en nuestra tabla de Markdown.
Genial, ¿verdad?
Por ahora, terminamos con BrowserMCP, así que desconéctalo en tu navegador.
8. Automatización con Skills y Playwright
Limitaciones de BrowserMCP
BrowserMCP es excelente, pero tiene algunas limitaciones. Por ejemplo:
- Requiere una sesión de navegador existente con la extensión BrowserMCP conectada. (No genera sesiones nuevas).
- No admite navegadores que no sean de Chromium.
- Requiere que se ejecute un proceso de navegador independiente en la misma máquina en la que se ejecuta el servidor de MCP.
- No puede trabajar con el sistema de archivos local. Por ejemplo, no puede crear archivos locales para evidenciar capturas de pantalla ni descargar y almacenar archivos de la aplicación web, como archivos PDF descargables.
- No es determinístico. Intentará realizar las acciones que le indiques, pero el estado local, como una ventana emergente inesperada, podría interrumpir la interacción.
- No admite la operación "sin interfaz gráfica", lo que significa que no se puede ejecutar en una canalización de CI/CD sin una ventana de navegador real.
Playwright
Playwright es una herramienta mucho más sofisticada. Es un framework de pruebas y automatización de navegadores de código abierto y bien establecido. Puede hacer muchas cosas que BrowserMCP no puede, incluidos todos los puntos que mencioné anteriormente.
Es mucho más adecuado para ejecutar situaciones de prueba complejas, confiables y repetibles. Además, es especialmente adecuado para trabajar con sesiones de larga duración o, incluso, para ejecutar varias sesiones independientes en paralelo.
Sin embargo, esta capacidad adicional conlleva una curva de aprendizaje mucho más pronunciada.
Habilidades
Por suerte, no tenemos que aprender a usar Playwright directamente. En su lugar, podemos usar una habilidad del agente.

Entonces, ¿qué es exactamente una habilidad del agente? Piensa en ella como un paquete compacto de experiencia en un dominio que puedes entregarle a tu agente de IA cuando necesite hacer algo específico. Contiene instrucciones, prácticas recomendadas y, a veces, incluso secuencias de comandos auxiliares adaptadas a una tarea en particular.
Esta es la parte realmente inteligente: la divulgación progresiva. En lugar de incluir cada regla concebible de documentación de la API y del framework de pruebas en la instrucción inicial del sistema del LLM (lo que consume tu ventana de contexto y agota los tokens a una velocidad increíble), el agente solo lee la habilidad cuando realmente la necesita. Mantiene el contexto de referencia simple y directo, y recupera el "instructivo" detallado justo a tiempo. Y sí, una habilidad puede incluir instrucciones sobre cómo aprovechar servidores de MCP específicos para completar el trabajo.
Piensa en esa escena de Matrix: El agente mira un problema, se da cuenta de que necesita saber Playwright, descarga la habilidad y, de repente, dice: "Sé kung-fu". Bum Experto al instante.
Si quieres obtener más información sobre las habilidades, consulta los siguientes recursos:
- Instructivo : Primeros pasos con las habilidades de Google Antigravity
- Codelab: Creación de habilidades de Google Antigravity
Por qué las habilidades son perfectas para Playwright
Usar una habilidad aquí es una excelente opción. Playwright es increíblemente potente, pero su sintaxis puede ser complicada. Al darle al agente una habilidad de Playwright, no tenemos que preocuparnos de que nuestro LLM alucine sintaxis desactualizada o escriba selectores frágiles. Le proporcionamos un manual autorizado y seleccionado sobre cómo usar Playwright correctamente.
Usaré la CLI de Playwright y su habilidad asociada.
Con este enfoque, instalamos la CLI de Playwright de forma local y, luego, le proporcionamos a nuestro agente el conocimiento que necesita para usarla. Para evitar confusiones, no instalaré ningún servidor de MCP de Playwright.
Instalando
Primero, instalemos la CLI de Microsoft Playwright de código abierto. Si aún no lo hiciste, escribe /quit`` para salir de la CLI interactiva. Luego, en tu terminal, haz lo siguiente:
# Pre-req: nodejs installed npm install -g @playwright/cli@latest # Install Playwright CLI globally npm install @playwright/test # Install Playwright test framework npx playwright install-deps # Install dependencies npx playwright install chromium chrome # Install browser binaries in Linux / WSL
Ahora, agreguemos la habilidad. Con este comando, se descargará la subcarpeta de la habilidad directamente desde GitHub a nuestra carpeta de habilidades de Gemini:
mkdir -p ~/.gemini/skills npx degit microsoft/playwright-cli/skills/playwright-cli ~/.gemini/skills/playwright-cli
Ahora podemos probarlo.
# Launch Playwright CLI with visible browser playwright-cli open https://playwright.dev --headed
Esto debería generar una sesión del navegador que se abra en la URL especificada.
También quiero que Gemini pueda usar Playwright en modo "con encabezado", es decir, con una IU visible. Sin embargo, la habilidad no le indica a Gemini cómo hacerlo. Por lo tanto, agregué estas líneas a ~/.gemini/skills/playwright-cli/SKILL.md en la sección Core:
# Add the following under the "playwright-cli open" command # Run in headed mode so we can see the browser playwright-cli open https://playwright.dev --headed
Pruebas con Playwright
Como antes, debemos iniciar la aplicación (si aún no se está ejecutando). Haz lo siguiente desde la sesión de la terminal inicial:
make dev
Luego, en la otra sesión de la terminal, inhabilitemos temporalmente BrowserMCP para que el agente no se confunda sobre qué herramientas usar. Vuelve a iniciar la CLI de Antigravity (agy). Podemos inhabilitar temporalmente el servidor de browsermcp directamente a través de la TUI:
- Escribe
/mcpen el cuadro de instrucción para abrir el panel de administración de MCP. - Usa las teclas de flecha (arriba/abajo) para seleccionar
browsermcpy presiona Intro/Retorno. - Muévete hacia la derecha para seleccionar Inhabilitar y presiona Intro para desactivarla.

Ahora le pediremos al agente que navegue a nuestra aplicación con Playwright. Pero, a diferencia de BrowserMCP, no necesitamos iniciar el navegador primero. Playwright lo hará por nosotros con un proceso local.
Ingresa esta instrucción en la CLI de Agy:
Using Playwright, connect to the application at http://localhost:5173. Then login as 'admin' with password 'password', and verify that the dashboard title says 'System Overview'. Take a screenshot of the dashboard and save it to output/dashboard.png. In the main dashboard, read the telemetry values shown, and present them back to me in a markdown table.
(Como siempre, la CLI pedirá permiso antes de ejecutar cualquier herramienta).
¿Qué cambió?
- No era necesario iniciar el navegador primero.
- No necesitamos iniciar ni conectar una extensión del navegador.
- No es necesario que le indiquemos al agente que cierre la sesión primero. La prueba se instancia a partir de una sesión "limpia".
- Podemos tomar capturas de pantalla y guardarlas como archivos locales.
Poco después, deberías ver un archivo dashboard.png en la carpeta de salida.
Ten en cuenta que verás las llamadas a herramientas que se ejecutan en la CLI de Agy, pero no verás la IU del navegador. Esto se debe a que Playwright se ejecuta en "modo sin interfaz gráfica" de forma predeterminada.
Sin embargo, si vuelves a ejecutar la instrucción modificada, también podrás ver la IU:
Using Playwright, connect to the application at http://localhost:5173 in **headed** mode, and keep the browser open when you're done. Login as 'admin' with password 'password', and verify that the dashboard title says 'System Overview'. Take a screenshot of the dashboard and save it to output/dashboard.png. In the main dashboard, read the telemetry values shown and record them. Then wait 3 seconds, read them again. Now present the data back to me in a markdown table.
El resultado de la CLI de Agy debería ser similar al siguiente:

¿Qué tal estuvo?
9. Agente de navegador integrado de Antigravity
Google Antigravity viene equipado con su propio agente de navegador integrado ( subagente del navegador) que proporciona automatización del navegador lista para usar, sin necesidad de instalar una herramienta independiente como la CLI de Playwright.
Cómo funciona
Para controlar tu navegador, el agente integrado funciona directamente a través del Protocolo de Herramientas para desarrolladores de Chrome (CDP), lo que elimina la necesidad de extensiones del navegador o complementos intermedios en Antigravity 2.0 y el IDE.
Cuando se inicia, Antigravity se conecta a tu instancia de Chrome a través de un puerto de depuración local a través de una conexión WebSocket. Las instrucciones de alto nivel del agente se traducen directamente en comandos de CDP de bajo nivel que hacen lo siguiente:
- Manipular el DOM de la página (por ejemplo, hacer clic en elementos o ingresar texto)
- Controlar el estado del navegador y activar la navegación
- Captura fotogramas y datos visuales en tiempo real.
Al combinar el control directo del CDP con el análisis visual y multimodal, el subagente toma tu objetivo de alto nivel (p.ej., "verifica que el panel muestre los valores de telemetría correctos"), analiza la página visualmente para determinar qué acciones se requieren y las ejecuta por sí mismo. También graba videos y toma capturas de pantalla de sus acciones automáticamente, y los guarda directamente en tu espacio de trabajo como artefactos para que sirvan como prueba visual de la ejecución de la prueba.
Disponibilidad de la herramienta
El agente de navegador integrado aún no es compatible con la CLI de Antigravity (CLI de Agy) que prioriza la terminal. Sin embargo, puedes usarlo de inmediato en el IDE de Antigravity y Antigravity 2.0 hoy mismo. Esperamos que la compatibilidad con el agente del navegador esté disponible en la CLI de Agy en una versión futura.
Nota para los usuarios de WSL: Ahora es mucho más fácil que el agente del navegador funcione en Antigravity con WSL. En lugar de lidiar con el complejo enrutamiento de red y la redirección de puertos, solo debes habilitar el modo de red "duplicado" en la configuración de WSL. Para obtener una guía completa paso a paso, consulta la guía Resolving WSL Friction with Google Antigravity: The Agy 2.0 and Agy IDE Edition.
10. Otros casos de uso de la automatización del navegador
La automatización del navegador no solo se trata de asegurarse de que el botón de acceso funcione antes de una implementación de viernes por la tarde. Una vez que te das cuenta de que puedes conectar un LLM directamente a un navegador, se abre un mundo completamente nuevo de proyectos autónomos y creados en casa.
Si creas tus propios agentes de IA, estas son algunas formas en las que puedes usar herramientas como BrowserMCP o Playwright CLI para hacer el trabajo pesado:
- El asistente de investigación personal: Imagina que le indicas a tu agente una URL específica y le pides que investigue un tema, pero el sitio requiere que accedas y navegues por menús complejos. En lugar de escribir un extractor web personalizado que deje de funcionar la próxima semana, solo le dices a tu agente que acceda, navegue a los datos y los resuma por ti.
- El integrador "Swivel-Chair": Todos tenemos esos sistemas heredados de intranet que no tienen APIs. Ya sabes cuáles son: aquellos en los que tienes que copiar datos manualmente del sistema A y pegarlos en un formulario del sistema B. Un agente con automatización del navegador puede actuar como pegamento universal, leer la pantalla del sistema heredado y completar el formulario en el nuevo.
- Triaje y corrección automatizados: ¿Recibiste una alerta de prioridad 1 de tu sistema de supervisión a las 3 a.m.? Tu agente podría abrir automáticamente la URL del panel específico, leer los gráficos o los registros (con sus capacidades de visión multimodal) y publicar un resumen directamente en tu canal de Slack, lo que te ahorraría minutos valiosos durante un incidente.
La ventaja de este enfoque es que ya no estás limitado por las APIs disponibles. Si un humano puede hacerlo en un navegador, tu agente también puede hacerlo.
11. Conclusión
¡Felicitaciones! Acabas de compilar y ejecutar pruebas de IU automatizadas y sólidas con solo indicarle a un agente de IA lo que querías que hiciera en inglés sencillo. No hay selectores CSS frágiles ni secuencias de comandos de configuración complejas.
Aprendiste lo siguiente:
- Las pruebas de IU no tienen por qué ser dolorosas: Si nos enfocamos en la intención de la prueba en lugar de la frágil implementación del DOM, podemos reducir en gran medida la sobrecarga de mantenimiento.
- El Protocolo de contexto del modelo (MCP) les brinda a tus agentes acceso universal y plug-and-play a herramientas, datos y entornos.
- BrowserMCP es una herramienta increíble para incorporar capacidades de agente en tus sesiones de Chrome locales existentes.
- Las habilidades y la CLI de Playwright desbloquean un nuevo nivel de pruebas de automatización determinísticas y repetibles, todo con la ayuda de la divulgación progresiva.
- El subagente de navegador de Antigravity va un paso más allá, ya que introduce la navegación autónoma y multimodal, y la grabación de artefactos listas para usar.
Ahora, ve y automatiza las tareas aburridas.
12. Vínculos útiles
Si quieres profundizar en las herramientas y los conceptos que vimos hoy, consulta estos recursos:
Código del repo
- El repo de GitHub de agentic-ui-testing: Agrega una estrella al repo si este codelab te resultó útil.
Herramientas y marcos de trabajo principales
- Repositorio de GitHub de BrowserMCP
- Documentación de BrowserMCP
- Playwright
- Google AI Studio
- Instalación de la CLI de Antigravity
- Nodejs
Conceptos y habilidades de agente
- Configura servidores de MCP y habilidades para la CLI y el IDE de Antigravity
- Dialling Our Agents to 11: My Favourite MCP Servers (Llevando nuestros agentes al máximo: Mis servidores de MCP favoritos)
- Instructivo: Primeros pasos con las habilidades de Google Antigravity, de Romin Irani
- Codelab: Introducción a las habilidades de antigravedad
- Mi blog original: Cómo crear una prueba de IU automatizada en segundos
Otro