01 Qué es y por qué gasta tan poco contexto
agent-browser es una CLI escrita en Rust, publicada por Vercel Labs con licencia Apache 2.0, pensada para que la usen agentes de IA. Claude la maneja con comandos de terminal: abrir una URL, pedir un snapshot, pulsar, escribir, hacer capturas o guardar un PDF.
La clave está en el snapshot: en vez de enviar una imagen de la página, devuelve el árbol de accesibilidad con referencias cortas (@e1, @e2…) para cada botón, enlace o campo. Claude lee esa lista, decide «pulsa @e5» y vuelve a pedir el snapshot cuando la página cambia. El texto estructurado ocupa mucho menos que una captura y además es más preciso.
| Agent Browser | Extensión de navegador (p. ej. Claude in Chrome) | |
|---|---|---|
| Qué navegador usa | Uno propio y aislado (Chrome for Testing) | Tu Chrome, con tus sesiones abiertas |
| Cómo ve la página | Árbol de accesibilidad con referencias; capturas solo si las pides | Capturas y lectura de la página |
| Ideal para | Pruebas automáticas, extracción, tareas repetidas | Tareas puntuales mientras miras la pantalla |
| Riesgo para tus cuentas | Bajo: no comparte cookies salvo que las importes | Mayor: actúa con tus sesiones reales |
02 Instalación en dos partes: la CLI y la skill
-
1
Instala la CLI
Con npm de forma global. En Mac también sirve Homebrew (brew install agent-browser).
-
2
Descarga el navegador
agent-browser install baja Chrome for Testing, el canal oficial de Google para automatización. Si ya tienes Chrome, Brave o Playwright, los detecta. En Linux añade --with-deps.
-
3
Añade la skill a Claude Code
El comando de skills crea un archivo pequeño en .claude/skills/agent-browser/ que indica a Claude cómo cargar las instrucciones actualizadas de la CLI.
-
4
Comprueba la instalación
agent-browser doctor revisa Chrome, configuración y red, y lanza una prueba real. Luego abre una sesión nueva de Claude Code.
npm install -g agent-browser
agent-browser install
npx skills add vercel-labs/agent-browser
agent-browser doctor03 Los comandos que usará Claude
No necesitas memorizarlos, pero conocerlos te ayuda a entender lo que hace Claude y a depurar si algo falla.
agent-browser open example.com
agent-browser snapshot -i
agent-browser click @e2
agent-browser fill @e3 "[email protected]"
agent-browser screenshot captura.png
agent-browser closeread
Descarga una URL como texto legible sin abrir Chrome. Lo más barato para leer artículos o documentación.
--headed
Abre la ventana del navegador para que veas lo que hace. Útil las primeras veces o para depurar.
screenshot --annotate
Captura con números sobre cada elemento, por si Claude necesita contexto visual.
Guarda la página en PDF: informes, facturas o fichas para archivar.
04 Casos de uso para un negocio
Probar tu web tras cada cambio
Claude recorre el registro, el formulario de contacto o el carrito, detecta dónde falla y vuelve al código a corregirlo.
Revisar una landing con ojos nuevos
Lee la página como un visitante y te dice qué se entiende, qué falta y dónde se pierde la atención.
Vigilar a la competencia
Revisa precios o novedades de páginas públicas y te deja un resumen en un archivo.
Paneles sin API
Extrae cifras de herramientas internas que solo tienen interfaz web, con una sesión guardada.
Usa agent-browser para probar el formulario de contacto de mi web en http://localhost:[puerto]/contacto/.
1. Abre la página con --headed para que yo lo vea.
2. Haz un snapshot -i y dime qué campos hay.
3. Prueba tres casos: todo correcto, correo mal escrito y campos obligatorios vacíos.
4. Para cada caso, dime qué mensaje aparece y si es claro para el usuario.
5. Si encuentras un error, localízalo en el código y propón la corrección, sin aplicarla todavía.Con agent-browser, lee [URL de mi landing] como lo haría alguien que llega por primera vez desde un anuncio. Dime en tres frases qué crees que vendo, qué dudas te quedan antes del primer botón de contacto, qué afirmaciones no tienen prueba y las tres mejoras que harías primero. Sé directo: no quiero elogios.Usa agent-browser read para leer estas páginas públicas: [lista de URLs]. De cada una saca nombre del servicio, precio desde, qué incluye y fecha de la última actualización si aparece. Guarda el resultado en comparativa.csv y avísame si alguna página no se ha podido leer, en lugar de rellenar el hueco.05 Seguridad y sesiones con login
Un agente con navegador puede leer instrucciones maliciosas escondidas en una web y hacer clic donde no debe. Agent Browser incluye protecciones opcionales que conviene activar cuando trabajes con datos reales:
--allowed-domainslimita la navegación a los dominios que indiques.--content-boundariesmarca el contenido de la página para que el modelo lo distinga de tus instrucciones.--confirm-actionsexige tu aprobación para categorías sensibles, como ejecutar JavaScript o descargar.--max-outputrecorta salidas enormes.
06 Problemas frecuentes
Un clic falla
Suele haber un banner de cookies o un modal encima. Ciérralo, pide un snapshot nuevo y repite con la referencia actualizada.
Claude no usa la herramienta
Abre una sesión nueva tras instalar la skill o díselo explícitamente: usa agent-browser y consulta agent-browser --help.
Error al lanzar Chrome
Ejecuta agent-browser doctor; con --fix repara instalaciones dañadas. En Linux, install --with-deps.
Captchas y doble factor
No intentes saltarlos. Abre con --headed, complétalos tú y guarda la sesión para reutilizarla.
Preguntas frecuentes
Sí, es software libre con licencia Apache 2.0. Solo consumes los tokens de tu plan de Claude al usarlo.
Sí. La skill se instala igual en Codex, Cursor, Gemini CLI, GitHub Copilot, OpenCode y otros, y cualquier cliente MCP puede usar agent-browser mcp.
Puede importar el estado de una sesión en la que ya hayas iniciado sesión o reutilizar un perfil, pero por defecto trabaja aislado. Hazlo solo en equipos de confianza y borra los archivos de estado cuando no los necesites.
No del todo. Es ideal para que un agente explore y pruebe de forma flexible. Para pruebas automáticas repetibles en integración continua, pide a Claude que convierta lo aprendido en tests de Playwright o de tu framework.
Sobre el autor
Equipo editorial de appyweb
Marketing, SEO y desarrollo con IA
Especialistas de appyweb en SEO, publicidad, desarrollo web y automatización con IA.