const fs = require('fs');
const path = require('path');
function loadResults(filename) {
const filePath = path.join('test-results', filename);
if (!fs.existsSync(filePath)) {
return null;
}
return JSON.parse(fs.readFileSync(filePath, 'utf8'));
}
function generateHTMLReport() {
const performance = loadResults('performance-summary.json');
const seo = loadResults('seo-summary.json');
const accessibility = loadResults('accessibility-summary.json');
const forms = loadResults('form-validation-summary.json');
const timestamp = new Date().toLocaleString('zh-CN');
const html = `
开发环境测试报告 - ${timestamp}
${performance ? generatePerformanceSection(performance) : ''}
${seo ? generateSEOSection(seo) : ''}
${accessibility ? generateAccessibilitySection(accessibility) : ''}
${forms ? generateFormSection(forms) : ''}
📊 总体评估
${generateOverallSummary(performance, seo, accessibility, forms)}
📝 建议和后续步骤
${generateRecommendations(performance, seo, accessibility, forms)}
`;
const outputPath = 'test-results/test-report.html';
fs.writeFileSync(outputPath, html);
return outputPath;
}
function generatePerformanceSection(data) {
const avgScore = data.reduce((sum, page) =>
sum + (page.metrics?.performance || 0), 0) / data.length;
return `
⚡ 性能测试结果
平均分数
${avgScore.toFixed(1)}
| 页面 |
性能 |
可访问性 |
最佳实践 |
SEO |
${data.map(page => `
| ${page.page} |
${page.metrics?.performance?.toFixed(0) || 'N/A'} |
${page.metrics?.accessibility?.toFixed(0) || 'N/A'} |
${page.metrics?.bestPractices?.toFixed(0) || 'N/A'} |
${page.metrics?.seo?.toFixed(0) || 'N/A'} |
`).join('')}
`;
}
function generateSEOSection(data) {
const passRate = ((data.totalPages - data.pagesWithIssues) / data.totalPages * 100);
return `
🔍 SEO检查结果
通过率
${passRate.toFixed(1)}%
| 严重程度 |
数量 |
| 🔴 高 |
${data.severity.high} |
| 🟡 中 |
${data.severity.medium} |
| 🟢 低 |
${data.severity.low} |
`;
}
function generateAccessibilitySection(data) {
const avgScore = data.summary.averageScore;
const passRate = ((data.totalPages - data.pagesWithIssues) / data.totalPages * 100);
return `
♿ 可访问性测试结果
达标率
${passRate.toFixed(1)}%
标准: WCAG 2.1 AA
总违规数: ${data.summary.totalViolations}
`;
}
function generateFormSection(data) {
return `
📝 表单验证结果
通过率
${data.summary.passRate}%
总测试数
${data.summary.totalTests}
`;
}
function generateOverallSummary(performance, seo, accessibility, forms) {
const sections = [];
if (performance) {
const avgScore = performance.reduce((sum, page) =>
sum + (page.metrics?.performance || 0), 0) / performance.length;
sections.push(`
性能
${avgScore.toFixed(1)}
`);
}
if (seo) {
const passRate = ((seo.totalPages - seo.pagesWithIssues) / seo.totalPages * 100);
sections.push(`
SEO
${passRate.toFixed(1)}%
`);
}
if (accessibility) {
sections.push(`
可访问性
${accessibility.summary.averageScore}
`);
}
if (forms) {
sections.push(`
表单
${forms.summary.passRate}%
`);
}
return sections.join('');
}
function generateRecommendations(performance, seo, accessibility, forms) {
const recommendations = [];
if (performance) {
const lowPerfPages = performance.filter(p => p.metrics?.performance < 80);
if (lowPerfPages.length > 0) {
recommendations.push(`
⚡ 性能优化
- 优化以下页面的加载速度: ${lowPerfPages.map(p => p.page).join(', ')}
- 实施图片懒加载和压缩
- 优化CSS和JavaScript资源
- 配置CDN加速
`);
}
}
if (seo) {
if (seo.totalIssues > 0) {
recommendations.push(`
🔍 SEO改进
- 修复 ${seo.severity.high} 个高优先级SEO问题
- 完善所有页面的Meta标签
- 添加Open Graph标签
- 生成并提交sitemap.xml
- 配置robots.txt
`);
}
}
if (accessibility) {
const lowAccessPages = accessibility.pages.filter(p => parseFloat(p.score) < 80);
if (lowAccessPages.length > 0) {
recommendations.push(`
♿ 可访问性改进
- 修复以下页面的可访问性问题: ${lowAccessPages.map(p => p.page).join(', ')}
- 添加ARIA标签
- 改进键盘导航
- 优化颜色对比度
- 确保所有交互元素可访问
`);
}
}
if (forms) {
if (parseFloat(forms.summary.passRate) < 100) {
recommendations.push(`
📝 表单改进
- 修复表单验证逻辑
- 改进错误提示信息
- 添加提交成功反馈
- 确保表单在移动端正常工作
`);
}
}
return recommendations.join('') || '✅ 所有测试都通过了！网站已准备好上线。
';
}
async function main() {
console.log('📊 生成综合测试报告...\n');
const reportPath = generateHTMLReport();
console.log(`✅ 报告已生成: ${reportPath}`);
console.log(`💡 在浏览器中打开查看详细报告`);
}
main().catch(console.error);