novalon-website/scripts/README.md

开发环境测试脚本

本目录包含用于在开发环境中测试和验证网站的可复用脚本。

📋 可用脚本

性能测试

performance-audit.js

使用Lighthouse进行性能审计，生成详细的性能报告。

运行方式:

npm run audit:performance
# 或
node scripts/performance-audit.js

输出:

• test-results/performance-summary.json - 性能数据摘要
• test-results/performance/*.html - 每个页面的详细报告

评估标准:

• 性能分数 >= 80: ✅ 通过
• 可访问性分数 >= 80: ✅ 通过
• SEO分数 >= 80: ✅ 通过

SEO检查

seo-check.js

检查所有页面的SEO配置，包括Meta标签、Open Graph标签、结构化数据等。

运行方式:

npm run audit:seo
# 或
node scripts/seo-check.js

输出:

• test-results/seo-summary.json - SEO检查结果

检查项:

• Meta标签完整性
• Open Graph标签
• H1标签
• 图片alt属性
• 链接有效性
• 语言属性

可访问性测试

accessibility-test.js

使用axe-core进行可访问性测试，符合WCAG 2.1 AA标准。

运行方式:

npm run audit:accessibility
# 或
node scripts/accessibility-test.js

输出:

• test-results/accessibility-summary.json - 可访问性测试结果

标准:

• WCAG 2.1 AA
• 最低分数: 80

表单验证

form-validation.js

测试表单的UI验证、字段可见性和提交功能。

运行方式:

npm run audit:forms
# 或
node scripts/form-validation.js

输出:

• test-results/form-validation-summary.json - 表单验证结果

测试项:

• 表单字段可见性
• 必填字段验证
• 邮箱/电话格式验证
• 表单提交功能

综合报告

generate-test-report.js

生成包含所有测试结果的综合HTML报告。

运行方式:

npm run report:generate
# 或
node scripts/generate-test-report.js

输出:

• test-results/test-report.html - 综合测试报告

一键运行

run-all-tests.sh

运行所有测试并生成综合报告。

运行方式:

npm run audit:all
# 或
./scripts/run-all-tests.sh

前置条件:

• 开发服务器运行在 http://localhost:3000
• 已安装所有依赖

🚀 快速开始

1. 安装依赖

npm install -D @axe-core/playwright lighthouse chrome-launcher

2. 启动开发服务器

npm run dev

3. 运行所有测试

# 在另一个终端
npm run audit:all

4. 查看报告

open test-results/test-report.html

📊 测试覆盖

测试页面

• 首页 (/)
• 关于我们 (/about)
• 联系我们 (/contact)
• 服务 (/services)
• 产品 (/products)
• 案例 (/cases)
• 新闻 (/news)

测试维度

• ⚡ 性能（Lighthouse）
• 🔍 SEO（Meta标签、Open Graph等）
• ♿ 可访问性（WCAG 2.1 AA）
• 📝 表单功能（UI验证、提交测试）

📝 自定义配置

修改测试页面

编辑各个脚本中的 PAGES 数组：

const PAGES = [
  { name: '页面名称', url: 'http://localhost:3000/path' },
  // 添加更多页面...
];

修改评分标准

编辑各个脚本中的 THRESHOLDS 或 MIN_SCORE 常量：

const THRESHOLDS = {
  performance: 90,  // 提高标准
  accessibility: 90,
  seo: 90
};

🔧 故障排除

开发服务器未运行

❌ 开发服务器未运行

解决: 先运行 npm run dev

端口冲突

如果3000端口被占用，修改脚本中的URL：

const BASE_URL = 'http://localhost:3001';  // 使用其他端口

测试超时

增加等待时间：

await page.goto(url, { waitUntil: 'networkidle', timeout: 30000 });

📚 参考资料

• Lighthouse文档
• axe-core文档
• Playwright文档
• WCAG 2.1指南