# 0022a — E2E Tests: Infraestructura base > Parte de [0022 — Tests E2E con Playwright](0022-e2e-tests-playwright.md) ## Objetivo Crear el proyecto Node.js base para tests E2E con Playwright: estructura de directorios, configuracion, scripts de instalacion y setup de Element Web local. ## Contexto - Primer sub-issue del desglose de 0022. Establece la base sobre la que 0022b y 0022c construyen. - Playwright necesita un proyecto Node.js independiente con sus propias dependencias - Element Web se sirve localmente para control total del entorno - La VPS no tiene entorno grafico — todo headless ## Arquitectura ``` e2e/ NEW — proyecto Node.js independiente ├── package.json NEW — playwright, @playwright/test, dotenv ├── playwright.config.ts NEW — config headless, timeouts, base URL ├── .env.example NEW — template de variables E2E ├── fixtures/ NEW — directorio vacio (se llena en 0022b) ├── tests/ NEW — directorio vacio (se llena en 0022c) └── scripts/ └── setup-element.sh NEW — descargar/levantar Element Web local dev-scripts/e2e/ ├── install.sh NEW — instalar Node, Playwright, deps └── run.sh NEW — placeholder (se completa en 0022c) ``` ### Patron pure core / impure shell 100% infra de testing, sin cambios al codigo Go. ## Tareas ### Fase 1: Proyecto Node.js - [ ] **1.1** Crear `e2e/package.json` con dependencias: `@playwright/test`, `dotenv` - [ ] **1.2** Crear `e2e/playwright.config.ts`: - Headless por defecto - Timeout de 30s para acciones (LLMs son lentos) - Screenshot on failure - Base URL desde env (`ELEMENT_URL`) - Solo proyecto Chromium - `globalSetup` apuntando a `global-setup.ts` (se creara en 0022b) - [ ] **1.3** Crear `e2e/.env.example`: ``` ELEMENT_URL=http://localhost:8080 MATRIX_HOMESERVER=https://matrix-af2f3d.organic-machine.com MATRIX_USER=@test-user:matrix-af2f3d.organic-machine.com MATRIX_PASSWORD= MATRIX_RECOVERY_KEY= ``` ### Fase 2: Scripts - [ ] **2.1** Crear `e2e/scripts/setup-element.sh`: - Descargar Element Web release (version fijada) - Generar `config.json` apuntando al homeserver - Servir con `python3 -m http.server` o `npx serve` en puerto 8080 - Opcion para detener el servidor - [ ] **2.2** Crear `dev-scripts/e2e/install.sh`: - Verificar/instalar Node.js v18+ - `npm ci` en `e2e/` - `npx playwright install chromium` - `npx playwright install-deps` (necesita sudo) - [ ] **2.3** Crear `dev-scripts/e2e/run.sh` como placeholder: - Verificar que `e2e/node_modules/` existe - Verificar que `e2e/.env` existe - Mensaje indicando que los tests se agregan en 0022c ### Fase 3: Gitignore y verificacion - [ ] **3.1** Agregar a `.gitignore`: `e2e/node_modules/`, `e2e/test-results/`, `e2e/.auth/`, `e2e/.env` - [ ] **3.2** Verificar que `npm ci` y `npx playwright install chromium` funcionan en la VPS - [ ] **3.3** Verificar que Element Web se levanta y es accesible en `localhost:8080` --- ## Ejemplo de uso ```bash # Instalar todo ./dev-scripts/e2e/install.sh # Configurar credenciales cp e2e/.env.example e2e/.env vim e2e/.env # Levantar Element Web ./e2e/scripts/setup-element.sh start # → Element Web serving at http://localhost:8080 # Verificar que carga curl -s http://localhost:8080 | head -5 # → ... # Detener ./e2e/scripts/setup-element.sh stop ``` ## Decisiones de diseno - **Version fijada de Element**: evita que cambios de UI rompan selectores. Se actualiza manualmente. - **python3 http.server como fallback**: disponible en cualquier VPS sin instalar nada extra. `npx serve` como alternativa si esta disponible. - **Directorios vacios con .gitkeep**: `fixtures/` y `tests/` se crean vacios para que la estructura exista desde el primer sub-issue. ## Prerequisitos - Acceso a la VPS con sudo (para `playwright install-deps`) - Conectividad al homeserver Matrix ## Riesgos - **Node.js no instalado**: `install.sh` debe manejarlo con instrucciones claras o instalacion automatica via nvm/nodesource. - **Playwright deps del sistema**: varian por distro. `playwright install-deps` lo maneja pero necesita sudo.