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
58 lines
1.9 KiB
JavaScript
58 lines
1.9 KiB
JavaScript
import fs from 'fs';
|
|
import path from 'path';
|
|
import { chromium } from 'playwright';
|
|
|
|
async function captureRegions(url) {
|
|
const browser = await chromium.launch({ headless: true, args: ['--no-sandbox'] });
|
|
const page = await browser.newPage({ viewport: { width: 1280, height: 720 } });
|
|
await page.goto(url, { waitUntil: 'networkidle' });
|
|
await page.waitForTimeout(500);
|
|
|
|
const regions = [
|
|
{ name: 'video_preview', selector: '.video-preview' },
|
|
{ name: 'mic_status', selector: '.mic-status' },
|
|
{ name: 'controls', selector: '.controls' },
|
|
{ name: 'form', selector: 'form' }
|
|
];
|
|
|
|
const outDir = '/tmp';
|
|
const report = { url, captures: [] };
|
|
|
|
for (const r of regions) {
|
|
try {
|
|
const el = await page.$(r.selector);
|
|
if (!el) {
|
|
console.warn('Selector not found', r.selector);
|
|
report.captures.push({ name: r.name, selector: r.selector, found: false });
|
|
continue;
|
|
}
|
|
const box = await el.boundingBox();
|
|
const outPath = path.join(outDir, `prejoin_region_${r.name}.png`);
|
|
// use element screenshot to crop
|
|
await el.screenshot({ path: outPath });
|
|
report.captures.push({ name: r.name, selector: r.selector, found: true, box, path: outPath });
|
|
} catch (e) {
|
|
console.error('Failed capture for', r.selector, e);
|
|
report.captures.push({ name: r.name, selector: r.selector, found: false, error: String(e) });
|
|
}
|
|
}
|
|
|
|
await browser.close();
|
|
const reportPath = path.join(outDir, 'prejoin_regions_report.json');
|
|
fs.writeFileSync(reportPath, JSON.stringify(report, null, 2));
|
|
console.log('Wrote report', reportPath);
|
|
return reportPath;
|
|
}
|
|
|
|
(async () => {
|
|
try {
|
|
const url = process.argv[2] || 'http://127.0.0.1:8000/docs/prejoin_template.html';
|
|
const rp = await captureRegions(url);
|
|
console.log('Done, report at', rp);
|
|
} catch (e) {
|
|
console.error('Error running captureRegions', e);
|
|
process.exit(2);
|
|
}
|
|
})();
|
|
|