Cesar Mendivil
adbec08f5e
- Redesign PreJoin component and CSS for improved template compatibility and deterministic rendering - Remove mock studio toggle and related runtime logic; update useStudioLauncher to always use real backend - Add README-MOCK.md to document mock studio deprecation - Add mock-studio.html for manual popup emulation - Update environment variable resolution in route.ts for backend API - Add visual regression test scripts (capture, compare, visual_test_prejoin) using Playwright, Puppeteer, pixelmatch, and pngjs - Update package.json scripts and devDependencies for visual testing - Simplify PreJoin.stories.tsx for robust Storybook usage
54 lines
2.3 KiB
JavaScript
54 lines
2.3 KiB
JavaScript
#!/usr/bin/env node
|
|
const { spawnSync } = require('child_process');
|
|
const fs = require('fs');
|
|
const path = require('path');
|
|
|
|
const args = process.argv.slice(2);
|
|
let url = 'http://127.0.0.1:8000/docs/prejoin_template.html';
|
|
for (let i=0;i<args.length;i++){
|
|
if ((args[i]==='--url' || args[i]==='-u') && args[i+1]) { url = args[i+1]; i++; }
|
|
}
|
|
|
|
console.log('[visual-test] using URL:', url);
|
|
|
|
// 1) run capture
|
|
console.log('[visual-test] capturing regions...');
|
|
let r = spawnSync('node', ['scripts/capture_regions_playwright.mjs', url], { stdio: 'inherit' });
|
|
if (r.error) { console.error('[visual-test] capture failed', r.error); process.exit(2); }
|
|
if (r.status !== 0) { console.error('[visual-test] capture script exited with', r.status); /* continue to comparison if images may exist */ }
|
|
|
|
// 2) run compare
|
|
console.log('[visual-test] comparing regions...');
|
|
let c = spawnSync('node', ['scripts/compare_regions.cjs'], { stdio: 'inherit' });
|
|
if (c.error) { console.error('[visual-test] compare failed', c.error); process.exit(2); }
|
|
if (c.status !== 0) { console.error('[visual-test] compare script exited with', c.status); }
|
|
|
|
// 3) read report
|
|
const reportPath = '/tmp/prejoin_regions_compare_report.json';
|
|
if (!fs.existsSync(reportPath)) { console.error('[visual-test] report not found at', reportPath); process.exit(2); }
|
|
const report = JSON.parse(fs.readFileSync(reportPath,'utf8'));
|
|
console.log('[visual-test] report generated at', report.generatedAt);
|
|
|
|
// 4) evaluate metrics against threshold
|
|
const THRESHOLD = 0.001; // fail if any region has ratio > 0.1%
|
|
let failed = false;
|
|
for (const item of report.report) {
|
|
if (item.ratio && item.ratio > THRESHOLD) {
|
|
console.error(`[visual-test] REGION ${item.region} exceeded threshold: ratio=${item.ratio} mismatched=${item.mismatched} total=${item.total}`);
|
|
failed = true;
|
|
} else {
|
|
console.log(`[visual-test] REGION ${item.region}: ratio=${item.ratio || 0} mismatched=${item.mismatched || 0}/${item.total || 0}`);
|
|
}
|
|
}
|
|
|
|
const outJson = '/tmp/prejoin_visual_test_summary.json';
|
|
fs.writeFileSync(outJson, JSON.stringify({ url, threshold: THRESHOLD, generatedAt: new Date().toISOString(), report }, null, 2));
|
|
console.log('[visual-test] summary written to', outJson);
|
|
if (failed) {
|
|
console.error('[visual-test] visual test FAILED');
|
|
process.exit(3);
|
|
}
|
|
console.log('[visual-test] visual test PASSED');
|
|
process.exit(0);
|
|
|