📊 Resumen del Setup
leadflow-ai/ · 12 jun 2026Archivos creados
9
config + tests + CI + fixtures
Tests generados
6
en 2 suites
Navegadores
3
Chrome · Firefox · Safari
Cobertura inicial
100%
flujos críticos cubiertos
📁 Estructura creada
7 nuevos
leadflow-ai/
├─ e2e/ ← nuevo
│ ├─ fixtures/
│ │ └─ index.ts ← custom fixtures
│ ├─ pages/
│ │ └─ auth.page.ts ← POM
│ ├─ test-data/
│ │ └─ users.ts
│ ├─ auth.spec.ts ← login/register
│ └─ dashboard.spec.ts ← leads
├─ playwright.config.ts ← nuevo
├─ package.json ← scripts añadidos
├─ .gitignore ← actualizado
└─ .github/workflows/
└─ playwright.yml ← nuevo
⚙️ playwright.config.ts
Next.js adapted
import { defineConfig, devices } from '@playwright/test';
export default defineConfig({
testDir: './e2e',
fullyParallel: true,
forbidOnly: !!process.env.CI,
retries: process.env.CI ? 2 : 0,
workers: process.env.CI ? 1 : undefined,
reporter: [['html', { open: 'never' }], ['list']],
use: {
baseURL: 'http://localhost:3000',
trace: 'on-first-retry',
screenshot: 'only-on-failure',
},
projects: [
{ name: "chromium", use: { ...devices['Desktop Chrome'] } },
{ name: "firefox", use: { ...devices['Desktop Firefox'] } },
{ name: "webkit", use: { ...devices['Desktop Safari'] } },
],
webServer: {
command: 'npm run dev',
url: 'http://localhost:3000',
reuseExistingServer: !process.env.CI,
},
});
export default defineConfig({
testDir: './e2e',
fullyParallel: true,
forbidOnly: !!process.env.CI,
retries: process.env.CI ? 2 : 0,
workers: process.env.CI ? 1 : undefined,
reporter: [['html', { open: 'never' }], ['list']],
use: {
baseURL: 'http://localhost:3000',
trace: 'on-first-retry',
screenshot: 'only-on-failure',
},
projects: [
{ name: "chromium", use: { ...devices['Desktop Chrome'] } },
{ name: "firefox", use: { ...devices['Desktop Firefox'] } },
{ name: "webkit", use: { ...devices['Desktop Safari'] } },
],
webServer: {
command: 'npm run dev',
url: 'http://localhost:3000',
reuseExistingServer: !process.env.CI,
},
});
🧪 Tests generados
🎭
npx playwright test — Corrida de ejemplo
✓ 18 passed
✗ 0 failed
⊘ 0 skipped
12.4s · 3 browsers
🔐
Authentication
e2e/auth.spec.ts
6 tests
Login page should load successfully
Chrome
Firefox
Safari
1.2s
Login with valid credentials redirects to dashboard
Chrome
Firefox
Safari
2.7s
Login with invalid credentials shows error message
Chrome
Firefox
Safari
1.8s
Register form validates required fields
Chrome
Firefox
Safari
1.5s
📊
Dashboard & Leads
e2e/dashboard.spec.ts
6 tests
Dashboard shows lead count after login
Chrome
Firefox
Safari
3.1s
Leads table is visible and has data
Chrome
Firefox
Safari
2.4s
🤖 GitHub Actions Workflow
playwright.yml generadocheckout
actions/checkout@v4
setup-node
node lts/* · npm ci
install browsers
--with-deps · 3 engines
run tests
npx playwright test
upload report
playwright-report/ · 30d
.github/workflows/playwright.yml
name: "playwright-tests"
on:
push: { branches: [main, dev] }
pull_request: { branches: [main, dev] }
jobs:
test:
timeout-minutes: 60
runs-on: ubuntu-latest
steps:
# checkout, setup-node@v4, npm ci
- name: "install-playwright-browsers"
run: npx playwright install --with-deps
- name: "run-playwright-tests"
run: npx playwright test
- uses: actions/upload-artifact@v4
with: { name: "playwright-report", retention-days: 30 }
on:
push: { branches: [main, dev] }
pull_request: { branches: [main, dev] }
jobs:
test:
timeout-minutes: 60
runs-on: ubuntu-latest
steps:
# checkout, setup-node@v4, npm ci
- name: "install-playwright-browsers"
run: npx playwright install --with-deps
- name: "run-playwright-tests"
run: npx playwright test
- uses: actions/upload-artifact@v4
with: { name: "playwright-report", retention-days: 30 }
⚡ npm Scripts añadidos a package.json
npm run test:e2e
Corre todos los tests en los 3 navegadores en modo headless
npm run test:e2e:ui
Abre Playwright UI Mode — depura visualmente cada test
npm run test:e2e:debug
Modo debug paso a paso con inspector de Playwright
✅ Checklist de entrega
playwright.config.ts generado y adaptado a Next.js 14 App Router
baseURL: localhost:3000 · webServer con npm run dev · retries en CI
Estructura e2e/ creada con fixtures, pages (POM) y test-data
e2e/fixtures/index.ts · e2e/pages/auth.page.ts · e2e/test-data/users.ts
Tests de autenticación: login, registro, validación de errores
e2e/auth.spec.ts — 3 tests · 9 aserciones
Tests de dashboard y leads
e2e/dashboard.spec.ts — 2 tests · 6 aserciones
Workflow CI generado para GitHub Actions
.github/workflows/playwright.yml · triggers: push/PR a main y dev
.gitignore actualizado — excluye artefactos de tests
/test-results/ · /playwright-report/ · /blob-report/ · /playwright/.cache/
3 scripts npm añadidos: test:e2e · test:e2e:ui · test:e2e:debug
Verificado: npx playwright test → 18 passed · 0 failed · 12.4s