Podrás controlar cualquier sitio web con IA: Hice que Claude controlara a Gemini y es alucinante

Playwright es un potente framework de código abierto para pruebas y automatización web. Desarrollado por Microsoft, permite a los desarrolladores automatizar de forma fiable interacciones en Chromium, Firefox y WebKit con una única API. Su velocidad, fiabilidad y soporte para características web modernas lo convierten en un motor ideal tanto para pruebas automatizadas como para tareas complejas de IA basadas en navegador.

El Protocolo de Contexto de Modelo (MCP) se está convirtiendo rápidamente en el estándar para conectar modelos de IA con herramientas y datos externos. Para desarrolladores y usuarios avanzados, el "santo grial" de la IA local es dar al modelo ojos y manos: la capacidad de ver una página web e interactuar con ella.

La Aplicación de Escritorio Claude es una aplicación nativa que lleva el poder de los modelos de IA Claude de Anthropic directamente a tu escritorio. A diferencia de la versión web, la aplicación de escritorio está diseñada para integrarse profundamente con tu entorno local, convirtiéndola en el anfitrión perfecto para servidores MCP que requieren acceso a recursos locales, archivos y herramientas como Playwright.

Playwright MCP actúa como este puente. A diferencia de las herramientas de scraping estándar que solo obtienen HTML, el servidor Playwright MCP crea un canal de comunicación bidireccional entre Claude Desktop y un motor de navegador Playwright. Esto permite a Claude navegar, hacer clic, escribir e incluso inspeccionar el árbol de accesibilidad de las páginas web en tiempo real.

En este tutorial, nos centraremos en la configuración del Puente Playwright MCP en Windows, destacando específicamente cómo conectar Claude a una sesión de navegador existente (a través de la extensión Bridge) para evitar flujos de autenticación complejos.

Prerrequisitos

Antes de modificar cualquier archivo de configuración, asegúrate de que tu entorno Windows permite la ejecución de servidores locales.

1. Node.js (Versión LTS) en Windows: El servidor Playwright MCP es una aplicación Node.js. Debes tener Node.js versión 18 o superior instalado directamente en tu sistema Windows.

   node --version
   

2. Aplicación de Escritorio Claude: Debes usar la aplicación instalada en Windows, no la versión del navegador web (claude.ai), ya que la versión web no puede conectarse a servidores MCP locales.
3. Navegadores Playwright: Aunque el paquete a menudo los descarga automáticamente, es una buena práctica instalar las dependencias manualmente para evitar errores de tiempo de espera durante la primera ejecución.

   npx playwright install --with-deps
   

4. Suscripción Claude Pro (Recomendado): Aunque las características de MCP están disponibles para todos los usuarios, se recomienda encarecidamente un plan de pago Claude Pro. Las tareas de automatización del navegador a menudo implican múltiples mensajes de ida y vuelta mientras Claude "piensa" a través de la navegación y la extracción, lo que puede consumir rápidamente los límites de uso del nivel gratuito.

1

Configurando el Servidor MCP

El núcleo de esta configuración es el archivo claude_desktop_config.json. Este archivo le dice a la Aplicación de Escritorio Claude qué herramientas locales tiene permitido iniciar y con cuáles hablar.

1. Localizar el Archivo de Configuración: En Windows, este archivo se encuentra en tu carpeta AppData. Abre el Explorador de Archivos y navega a: %AppData%\Claude\claude_desktop_config.json (Si la carpeta o el archivo no existen, créalos manualmente).

2. Definir el Servidor: Abre el archivo en un editor de texto (como VS Code o el Bloc de notas) y añade la configuración del servidor Playwright MCP. Usaremos el paquete @playwright/mcp vía npx para que siempre ejecutes la última versión.

   claude_desktop_config.json

   {
     "mcpServers": {
       "playwright": {
         "command": "npx",
         "args": [
           "-y",
           "@playwright/mcp@latest"
         ]
       }
     }
   }
   

   • command: Usamos npx para ejecutar el paquete node.
   • args: La bandera -y suprime el aviso "¿Estás seguro de que quieres instalar...", lo cual es crítico porque Claude crea un shell no interactivo.

3. Reiniciar Claude: Cierra completamente la aplicación de escritorio Claude (comprueba la bandeja del sistema para asegurarte de que está cerrada) y vuelve a abrirla.

2

El Puente – Conectando a una Sesión Existente

Las instancias estándar de Playwright son "incógnito" por defecto: no comparten tus cookies ni estados de inicio de sesión. Para permitir que Claude interactúe con sitios donde ya has iniciado sesión (como GitHub, Jira o herramientas corporativas internas), utilizamos el Puente Playwright MCP.

1. Instalar la Extensión de Chrome: La extensión oficial de Playwright MCP no está disponible en la Chrome Web Store. Debes descargarla manualmente desde el repositorio oficial.

   • Descargar: Ve a la Página de Lanzamientos de Playwright MCP y descarga el último código fuente o el zip de la extensión.
   • Instalar: Descomprime el contenido. Abre Chrome y ve a chrome://extensions. Habilita el "Modo de desarrollador" en la parte superior derecha, luego haz clic en "Cargar descomprimida" y selecciona la carpeta que acabas de descomprimir.
   Configuración del Modo Extensión

   Para habilitar el modo de extensión específicamente, debes actualizar tus argumentos de configuración para incluir la bandera --extension:

   claude_desktop_config.json

   "args": [
     "-y",
     "@playwright/mcp@latest",
     "--extension"
   ]
   

2. Lanzar vía Puente: Cuando le pidas a Claude que realice una tarea ahora, buscará una instancia del navegador conectada a través del puente en lugar de iniciar una nueva ventana sin cabeza. Esto te permite iniciar sesión manualmente y luego ceder el control a Claude.

   La primera vez que inicies una conexión, es probable que tu navegador solicite permiso explícito para permitir que el servidor Playwright MCP tome el control de la pestaña.

Sabrás que la conexión es exitosa cuando veas el navegador lanzado y controlado exitosamente por el servidor, a menudo indicado por un estado distintivo del navegador o un mensaje en la consola verificando la sesión activa.

Informes Automatizados de Panel Personal

Uno de los usos más prácticos para este puente es recuperar datos personales de "jardines vallados"—sitios que requieren inicio de sesión y no ofrecen una API fácil de usar para tus necesidades específicas.

Escenario: Quieres verificar tu uso de API o estado de facturación sin navegar manualmente a través de paneles complejos.

Ejemplo de Prompt

Ve a la plataforma Deepseek y dime cuánto consumí este mes.

El Proceso

1. Navegación: Claude navega al panel de Deepseek.
2. Autenticación: Debido a que estás usando el Puente conectado a tu sesión de Chrome existente, probablemente ya has iniciado sesión. Si no, puedes iniciar sesión manualmente mientras Claude observa.
3. Extracción: Claude encuentra el elemento específico que muestra las estadísticas de uso/facturación y te informa.

Ventaja Clave

El mayor beneficio aquí es la seguridad y la conveniencia. No necesitas proporcionar tu nombre de usuario, contraseña o claves API en el propio prompt. Dado que Claude está conduciendo tu instancia de navegador existente, "se aprovecha" de tus cookies de sesión activas. Esto mantiene tus credenciales seguras y fuera del historial del chat.

Propósito General

Este enfoque se generaliza a cualquier plataforma donde necesites obtener datos de "solo lectura" detrás de un muro de autenticación—verificar saldos bancarios, verificar el uso de suscripciones SaaS o monitorear paneles de estado—todo sin escribir una sola línea de código de scraper.

Colaboración LLM-a-LLM (Validación Argéntica)

¿Qué pasaría si pudieras hacer que dos potentes IAs trabajaran juntas? Con Playwright MCP, Claude puede "conducir" otros LLMs basados en web como Gemini o ChatGPT.

Escenario: Quieres cruzar referencias de instrucciones técnicas o combinar el conocimiento de dos modelos.

Ejemplo de Prompt

Ve a gemini.google.com y pregunta cómo instalar playwright en la Aplicación de Windows de Claude. Revisa las instrucciones que obtengas y dime si son correctas.

El Proceso

1. Navegación: Claude va a la URL de Gemini.
2. Interacción: Escribe la consulta en el cuadro de chat de Gemini y la envía.
3. Síntesis: Claude lee la respuesta de Gemini desde la pantalla, la compara con su propia base de conocimiento interna y valida la precisión—creando efectivamente un sistema de "revisión por pares" para salidas de IA.

Por Qué Funciona

Esto convierte el navegador web en una interfaz universal para cualquier modelo de IA, permitiéndote construir flujos de trabajo complejos donde un agente actúa como el "ejecutor" y el otro como el "consultor" o "verificador".

Conclusión

Integrar Playwright con Claude Desktop vía MCP transforma la IA de un generador de texto pasivo a un agente activo capaz de realizar trabajo en el mundo real.

Esta configuración es un cambio de paradigma para los flujos de trabajo basados en navegador, desbloqueando capacidades que anteriormente requerían scripts personalizados frágiles:

• Investigación Profunda — Extraer y sintetizar datos a través de fuentes dispares
• Colaboración de IA — Crear una interfaz universal para la interacción agente-a-agente
• Automatización Administrativa — Manejar tareas repetitivas dentro de portales autenticados
• Operaciones de Pasos Múltiples — Ejecutar flujos de trabajo complejos con toma de decisiones inteligente

Quizás lo más importante, esta configuración permite una nueva era de colaboración IA-a-IA, donde un modelo puede revisar por pares, validar o consultar con otro a través de la interfaz universal de la web.

La combinación del razonamiento de Claude con la ejecución de Playwright crea un motor robusto para la automatización inteligente.

Al usar la configuración Bridge, evitas el mayor obstáculo—autenticación—permitiéndote aprovechar este poder inmediatamente.

Referencias

• Documentación del Protocolo de Contexto de Modelo (MCP)
• Repositorio GitHub de Playwright MCP
• Extensión Oficial Playwright MCP (Lanzamientos en GitHub)

¡Únete a la conversación! ¿Tienes preguntas o un caso de uso genial para el Puente Playwright MCP? Comparte tus pensamientos en la sección de comentarios a continuación (se requiere cuenta de GitHub).