Vincenius/wwebdev

Verificar un cambio en wweb.dev

Sitio Astro completamente estático con islas React — la verificación implica cargar la página construida en un navegador e interactuar con las islas hidratadas.

Construir + servir

yarn install          # si faltan dependencias del servidor (server.mjs necesita compression/express)
yarn build            # construcción estática → dist/ (TZ=UTC integrado)
yarn serve            # servidor de producción en http://localhost:4321 (NO astro preview)

node server.mjs falla directamente en configuraciones con Yarn PnP — siempre usa yarn serve. Ejecútalo en segundo plano; verifica con curl -s -o /dev/null -w "%{http_code}" http://localhost:4321/<ruta>.

Manejar la página

No hay Playwright en el repositorio. Instala playwright-core en un directorio temporal y usa el Chrome del sistema (chromium.launch({ channel: 'chrome', headless: true })) — no es necesario descargar un navegador. Las islas son client:visible, así que espera un selector renderizado por la isla antes de hacer afirmaciones, y dale a las animaciones ~1s.

Verificaciones útiles para las herramientas generadoras:

• estilos computados de la salida <style> inyectada (nombre de animación, posición, tamaño)
• textarea .inputValue() para el código HTML/CSS copiable
• capturas de pantalla a 1440 px y ~480 px (varias barras laterales de herramientas cambian a column-reverse en móviles)

Advertencias

• La consola debe estar libre de errores. La incrustación de activos de Vite está deshabilitada (assetsInlineLimit: 0 en astro.config.mjs) porque las fuentes data-URI violan la CSP font-src 'self' — si los errores de CSP por data-URI reaparecen, esa configuración se perdió.
• yarn test:parity necesita test/baseline/ (instantáneas HTML de producción) que no está incluido en el repositorio; sin él, el harness falla con ENOENT. De todos modos, no es un sustituto de la verificación en navegador.