- Raise use-swipe-gesture mutation score to 66.13% (target 65%+) - Maintain use-reduced-motion mutation score at 76.32% (target 50%+) - Fix use-reduced-motion.ts ESLint set-state-in-effect warning - Add UJ-10 deep searcher journey (category browse → article read → content discovery) - Add 40 new test files (analytics, detail, sections, ui, lib components) - Update test-strategy-plan.md to v2.0 (sync test count to 1591) - Sync README.md with final release metrics Quality gates: TS 0 errors, ESLint 0 errors, 121 suites / 1591 tests passed
94 lines
3.1 KiB
JavaScript
94 lines
3.1 KiB
JavaScript
// @ts-nocheck
|
|
import { chromium, devices } from '@playwright/test';
|
|
|
|
const viewports = [
|
|
{ name: 'Mobile - iPhone 14', width: 390, height: 844 },
|
|
{ name: 'Tablet - iPad', width: 768, height: 1024 },
|
|
{ name: 'Desktop - 1024', width: 1024, height: 768 },
|
|
{ name: 'Desktop - 1440', width: 1440, height: 900 },
|
|
];
|
|
|
|
const pages = [
|
|
{ name: '首页', url: 'http://localhost:3000' },
|
|
{ name: '产品列表', url: 'http://localhost:3000/products' },
|
|
{ name: '解决方案列表', url: 'http://localhost:3000/solutions' },
|
|
{ name: '服务列表', url: 'http://localhost:3000/services' },
|
|
];
|
|
|
|
async function runResponsiveTest() {
|
|
const browser = await chromium.launch();
|
|
const results = [];
|
|
|
|
for (const page of pages) {
|
|
for (const viewport of viewports) {
|
|
console.log(`\n测试: ${page.name} - ${viewport.name} (${viewport.width}x${viewport.height})`);
|
|
|
|
const context = await browser.newContext({
|
|
viewport: { width: viewport.width, height: viewport.height },
|
|
});
|
|
|
|
const pageInstance = await context.newPage();
|
|
|
|
try {
|
|
await pageInstance.goto(page.url, { waitUntil: 'domcontentloaded', timeout: 30000 });
|
|
await pageInstance.waitForTimeout(2000);
|
|
|
|
const title = await pageInstance.title();
|
|
const scrollHeight = await pageInstance.evaluate(() => document.documentElement.scrollHeight);
|
|
|
|
const heroTitleFontSize = await pageInstance.evaluate(() => {
|
|
const heroTitle = document.querySelector('h1');
|
|
if (heroTitle) {
|
|
const style = window.getComputedStyle(heroTitle);
|
|
return style.fontSize;
|
|
}
|
|
return null;
|
|
});
|
|
|
|
const screenshotPath = `./responsive-test/${page.name.replace(/\//g, '-')}_${viewport.name.replace(/\s/g, '-')}.png`;
|
|
await pageInstance.screenshot({ path: screenshotPath, fullPage: true });
|
|
|
|
console.log(` ✓ 标题: ${title}`);
|
|
console.log(` ✓ 页面高度: ${scrollHeight}px`);
|
|
console.log(` ✓ Hero 标题字号: ${heroTitleFontSize || 'N/A'}`);
|
|
console.log(` ✓ 截图已保存: ${screenshotPath}`);
|
|
|
|
results.push({
|
|
page: page.name,
|
|
viewport: viewport.name,
|
|
width: viewport.width,
|
|
height: viewport.height,
|
|
scrollHeight,
|
|
heroTitleFontSize,
|
|
status: 'success',
|
|
});
|
|
} catch (error) {
|
|
console.log(` ✗ 错误: ${error.message}`);
|
|
results.push({
|
|
page: page.name,
|
|
viewport: viewport.name,
|
|
width: viewport.width,
|
|
height: viewport.height,
|
|
status: 'error',
|
|
error: error.message,
|
|
});
|
|
}
|
|
|
|
await context.close();
|
|
}
|
|
}
|
|
|
|
await browser.close();
|
|
|
|
console.log('\n\n========== 响应式测试总结 ==========');
|
|
const successCount = results.filter(r => r.status === 'success').length;
|
|
const errorCount = results.filter(r => r.status === 'error').length;
|
|
console.log(`总测试数: ${results.length}`);
|
|
console.log(`成功: ${successCount}`);
|
|
console.log(`失败: ${errorCount}`);
|
|
|
|
return results;
|
|
}
|
|
|
|
runResponsiveTest().catch(console.error);
|