Open Source
v1.5.0

@matware/e2e-runner

Testing E2E con JSON, módulos reutilizables, inteligencia de tests, ejecución paralela y 17 herramientas MCP para flujos de trabajo nativos con IA.

npm version licencia versión de node 17 Herramientas MCP
Demo en vivo

Velo en acción

Claude Code creando y corriendo tests JSON a través del servidor MCP — con el dashboard en tiempo real.

Caso de Estudio Real

84% Menos Código

Convertimos los tests E2E de una aplicación médica real de Playwright (TypeScript + Page Object Model) a e2e-runner (JSON + módulos).

Antes — Playwright

2,170

líneas de TypeScript

84%

reducción

Después — e2e-runner

338

líneas de JSON

Playwright LoginPage.ts — 184 lines
LoginPage.ts
import { Page, Locator } from '@playwright/test';

export class LoginPage {
  readonly page: Page;
  readonly usernameInput: Locator;
  readonly passwordInput: Locator;
  readonly loginButton: Locator;

  constructor(page: Page) {
    this.page = page;
    this.usernameInput = page.locator('input[name="username"]');
    this.passwordInput = page.locator('input[name="password"]');
    this.loginButton = page.getByRole('button');
  }

  async login(username: string, password: string) {
    await this.usernameInput.fill(username);
    await this.passwordInput.fill(password);
    await this.loginButton.click();
  }
  // ... 100+ more lines
}
e2e-runner auth-login.json — 23 lines
auth-login.json
{
  "$module": "auth-login",
  "params": {
    "username": { "required": true },
    "password": { "required": true }
  },
  "actions": [
    { "type": "goto", "value": "/" },
    { "type": "type", "selector": "input[name='username']", "value": "{{username}}" },
    { "type": "type", "selector": "input[name='password']", "value": "{{password}}" },
    { "type": "click", "text": "Sign In" },
    { "type": "assert_url", "value": "dashboard" }
  ]
}
Sin TypeScript
Sin clases ni imports
Sin constructors
Sin async/await

Misma funcionalidad. QA, producto y devs pueden escribir y entender los tests. Claude Code puede generar, modificar y ejecutar tests directamente vía MCP.

Módulos Reutilizables

Reemplaza Page Objects con módulos JSON componibles. Parametrizados, con condicionales y detección de ciclos.

Usa cualquier módulo en tus tests con una sola línea:

{ "$use": "auth-login", "params": { "username": "admin@test.com", "password": "secret" } }
Parámetros

Requeridos, opcionales, valores por defecto

Componibles

Los módulos pueden usar otros módulos

Condicionales

{{#param}}...{{/param}} blocks

¿Por qué e2e-runner?

Todo lo que necesitas para testing moderno de navegador, nada que no necesites.

Módulos Reutilizables

Reemplaza Page Objects con módulos JSON. Parametrizados, componibles, con condicionales y detección de ciclos. Un módulo de 23 líneas reemplaza una clase TypeScript de 184 líneas.

Inteligencia de Tests

Extracción automática de conocimiento: detección de tests inestables, selectores problemáticos, patrones de error, salud de páginas y monitoreo de APIs. SQLite + grafo de conocimiento Neo4j opcional.

Tests Sin Código

Escribe tests de navegador como simples archivos JSON. Sin API de Playwright, sin boilerplate de framework — solo declara lo que quieres probar.

Ejecución Paralela

Ejecuta tests en múltiples instancias de navegador simultáneamente con concurrencia configurable a través de un pool de Chrome. Modo serial disponible por test.

IA Nativa (MCP)

17 herramientas MCP. Deja que Claude cree módulos, ejecute tests, analice aprendizajes, capture pantallas y genere tests desde issues de GitHub — todo conversacionalmente.

Verificación Visual

Agrega "expect" a cualquier test y el runner captura una captura de pantalla completa. Claude juzga visualmente si pasa o falla.

Nuevo en v1.5.0

Tests más livianos que eliminan los bloques evaluate, más un dashboard en tiempo real rediseñado.

select_combobox

Abre un MUI Autocomplete/Select, filtra y elige la opción en una sola acción — se acabaron los bloques evaluate.

click acotado

click con scope:"dialog", visible:true, last:true para apuntar a texto dentro de modales sin selectores ambiguos.

wait gone

Espera a que un elemento desaparezca (spinner, backdrop) en lugar de un sleep fijo. Elimina una fuente importante de flakiness.

type_react

Escribe en inputs controlados por React con blur y waitAfter para disparar la validación al perder el foco de forma confiable.

Módulos anidados

Un módulo puede componer otros módulos y reenviar sus parámetros. Dejá de copiar y pegar secuencias compartidas.

Vista LIVE rediseñada

Feed horizontal de capturas, filmstrip de slots fijos, auto-seguimiento del test en ejecución y click para ampliar.

Escaneo Find blank

La pestaña Screenshots detecta y elimina capturas en blanco para que nunca contaminen tus reportes.

Dark mode WCAG AA

Contraste accesible en toda la UI, acento cian desacoplado del verde de PASS y selección de proyecto persistida entre recargas.

El Dashboard

Una UI web en tiempo real para cada run — la vista LIVE se rediseñó en v1.5.0.

Vista LIVE

Vista LIVE

Feed de capturas en tiempo real con auto-seguimiento y filmstrip.

Runs

Runs

Cada run con estado de pass/fail, duración e historial.

Detalle de run

Detalle de run

Narración por acción, tiempos y detalle de red.

Screenshots

Screenshots

Galería con el escaneo Find blank para purgar capturas vacías.

Suites

Suites

Explorá suites de tests y módulos reutilizables de un vistazo.

Estado del pool

Estado del pool

Capacidad del pool de Chrome, sesiones activas y enrutamiento.

Antes en v1.2.0

Reintento por acción, narración, inyección de auth, logging de red y más.

Reintento por Acción

Reintenta acciones individuales sin reiniciar el navegador. Configuración global o por acción.

Narración de Tests

Descripciones legibles para cada acción: "Clicked 'Submit' button (78ms)". Enmascara datos sensibles automáticamente.

Inyección de Token Auth

Inyecta JWT en localStorage antes de los tests. Prueba apps autenticadas sin flujos de login.

Captura On-Demand

Captura de pantalla de cualquier URL al instante vía MCP o CLI sin escribir un test.

Logging de Red Completo

Captura completa de request/response (URL, método, headers, body). Persistido en SQLite.

Tests Seriales

{ "serial": true } ejecuta tests secuencialmente después del lote paralelo.

Patrones de Exclusión

Omite suites por glob: exclude: ["legacy-*", "wip-*"]

Validación Estricta

Validación de estructura antes de la ejecución: tipos de acción válidos, campos requeridos, nombres correctos.

Soporte .env

Carga automática de .env. Sin dependencias, KEY=VALUE, no sobreescribe variables existentes.

Contexto CLAUDE.md

La generación de tests con IA lee tu CLAUDE.md para rutas reales, selectores y patrones.

17 Herramientas MCP

Integración completa con IA. Cada herramienta disponible para Claude Code y cualquier cliente MCP.

Herramienta Descripción
e2e_run Ejecutar tests: todos, por suite, por archivo. Soporta concurrencia, baseUrl, reintentos, failOnNetworkError
e2e_list Listar suites de tests y módulos disponibles
e2e_create_test Crear test JSON con campo expect y referencias $use
e2e_create_module Crear módulo reutilizable con params, defaults y acciones
e2e_pool_status Disponibilidad y capacidad del pool de Chrome
e2e_screenshot Obtener captura de pantalla por hash (ss:a3f2b1c9)
e2e_capture Captura de pantalla on-demand de cualquier URL
e2e_issue Obtener issue de GitHub/GitLab, generar tests (modo prompt o verify)
e2e_learnings Consultar inteligencia de tests: tests inestables, selectores, errores, tendencias
e2e_analyze Analiza un run terminado: fallos, señales de flakiness e insights de estabilidad
e2e_network_logs Inspecciona requests/responses de red capturados en un run
e2e_vars Gestiona variables y secretos compartidos disponibles para los tests
e2e_app_pool_status Estado del pool de la app bajo prueba (dev servers)
e2e_neo4j Gestionar contenedor del grafo de conocimiento Neo4j
e2e_dashboard_start Iniciar el dashboard web en tiempo real
e2e_dashboard_restart Reinicia el dashboard web en tiempo real
e2e_dashboard_stop Detener el dashboard web
npm Vía npx
claude mcp add e2e-runner \
  npx @matware/e2e-runner mcp
Docker Vía Docker
claude mcp add e2e-runner \
  docker run -i --rm \
  matwaredev/e2e-runner mcp

Inicio Rápido

Listo y funcionando en cuatro comandos.

1

Instalar

npm install -g @matware/e2e-runner
2

Inicializar

e2e-runner init
3

Iniciar Pool de Chrome

e2e-runner pool start
4

Ejecutar Tests

e2e-runner run --all

27 Acciones

Todas las acciones disponibles en un archivo JSON de test. select_combobox y type_react son nuevas en v1.5.0.

Acción Campos Descripción
goto value Navegar a una URL
click selector | text, scope?, visible?, last? Hacer clic en un elemento — acotar a un diálogo, exigir visible o elegir la última coincidencia
type selector, value Escribir texto en un campo
type_react selector, value, blur?, waitAfter? Escribir en inputs controlados por React; blur dispara la validación al perder el foco
select selector, value Seleccionar una opción de un dropdown
select_combobox selector, filter, option Abre un MUI Autocomplete/Select, filtra y elige — reemplaza evaluate
press selector?, key Presionar una tecla del teclado
wait value (ms) | selector | gone Esperar una duración, a que un elemento aparezca, o a que desaparezca (gone)
hover selector Pasar el cursor sobre un elemento
scroll selector?, value? Hacer scroll en la página o un elemento
clear selector Limpiar un campo de entrada
screenshot value (filename) Tomar una captura de pantalla
evaluate value (JS code) Ejecutar JavaScript en el navegador
navigate value (back|forward|reload) Navegación del navegador
clear_cookies — Limpiar todas las cookies
assert_text selector, text Verificar el contenido de texto de un elemento
assert_element_text selector, text, exact? Verificar el textContent exacto de un elemento
assert_visible selector Verificar que un elemento sea visible
assert_not_visible selector Verificar que un elemento NO sea visible
assert_url value Verificar que la URL actual coincida
assert_count selector, value Verificar la cantidad de elementos coincidentes
assert_attribute selector, name, value? Verificar el valor de un atributo HTML
assert_class selector, value Verificar que una clase CSS esté presente
assert_input_value selector, value Verificar el valor de input/select/textarea
assert_matches selector, value (regex) Verificar que el textContent coincida con regex
assert_no_network_errors — Verificar que no haya fallos en peticiones de red
get_text selector Extraer texto de un elemento (sin assertion)

Participa

Dale una estrella al repo, abre un issue o pruébalo en tu próximo proyecto.