Staging v2.4.0 Automatizado

QA Report — PortalFlow

staging.portalflow.app  ·  2026-06-18 09:42 UTC  ·  Agente: CULTIVA IA  ·  Duración: 4m 17s
Veredicto final
⚠ SHIP WITH FIXES
2 blockers · 4 issues menores
24
Checks pasados
2
Blockers críticos
4
Issues menores
8
Páginas auditadas
🌫️
Fase 1 — Smoke Test
7 checks

Core Web Vitals — Home (desktop)
LCP
1.8s
Umbral: < 2.5s ✓
CLS
0.04
Umbral: < 0.1 ✓
INP
112ms
Umbral: < 200ms ✓
🖱️
Fase 2 — Tests de Interacción
9 checks
🖼️
Fase 3 — Regresión Visual
3 breakpoints × 4 páginas
Capturas simuladas — Home
375px — Mobile
✗ Overflow 18px
768px — Tablet
✓ Sin regresiones
1440px — Desktop
✓ Dentro de umbral
Fase 4 — Accesibilidad (WCAG 2.2 AA)
axe-core + manual
3
Violaciones AA
5
Best practices
31
Elementos OK
⚠ Nota metodológica
axe-core cubre ~30–40% de WCAG. Un run limpio es necesario pero no suficiente. Navegación por teclado y lector de pantalla requieren verificación manual adicional.
Violaciones detectadas
image-alt · WCAG 1.1.1 (A)
Imagen hero en Home sin atributo alt — los lectores de pantalla leen la URL como texto
Elemento: <img src="/hero-dashboard.webp"> · Páginas afectadas: 1
color-contrast · WCAG 1.4.3 (AA)
Links del footer en modo oscuro: ratio 2.8:1 (mínimo requerido: 4.5:1)
Elemento: .footer-links a · Color actual: #64748b sobre #1a1d27
label · WCAG 1.3.1 (A)
3 inputs del formulario de invitación sin label asociado — usan placeholder como único descriptor
Elemento: #invite-email, #invite-role, #invite-company · Añadir <label for="..."> o aria-label

🚨
Plan de acción — Antes de publicar
🔴 Blockers (resolver ahora)
1. Fix API /api/plans → SSR error 500 en /pricing
Investigar timeout o race condition en llamada a la DB en el render server-side
2. Onboarding Paso 2: mostrar error de validación en campo "sector"
Añadir mensaje bajo el select + asterisco en label; no deshabilitar botón sin feedback
3. Hero mobile 375px: aplicar font-size: clamp(32px, 5vw, 52px)
Evita overflow en viewports estrechos; verificar en 320px también
🟡 Issues menores (próximo sprint)
4. Añadir alt text a imagen hero en Home
5. Footer links: corregir contraste a mínimo 4.5:1
6. Labels en formulario de invitación
7. Focus trap en modal de confirmación
8. robots.txt: Disallow en staging
9. Añadir width/height a imágenes de blog
10. Empty state en búsqueda de workspace