0.0.10 • Published 5 years ago
puppeteer-coverage v0.0.10
puppeteer-coverage
在项目使用自动化测试中,采用的是puppeteer方案,但是在做覆盖率统计时候,puppeteer-to-istanbul无法解析源代码。因为我们项目是经过webpack编译之后的代码。需要对应的将编译后的js还原成源代码,再来统计覆盖率数据。
如何使用
npm install puppeteer-coverage --save-dev
接着你需要在每个自动化测试用例结束前调用
const saveCoverage = require('puppeteer-coverage').saveCoverage;
const path = require('path');
const nyc_output_path = path.resolve('./.nyc_output/');
let jsCoverage = await page.coverage.stopJSCoverage();
saveCoverage(jsCoverage, nyc_output_path);
等所有自动化用例执行结束,需要通过另一个脚本,来生成自动化的覆盖率
output_coverage.js文件:
const pti = require('puppeteer-coverage');
const pathLib = require('path');
(async function() {
const options = {
nyc_output_path: pathLib.resolve(__dirname, './.nyc_output/'),
src_dir: pathLib.resolve(__dirname, '../src'),
source_map_dir: pathLib.resolve(__dirname, '../dist/js/'),
url_regexp: /promotion\/res\/htmledition\/js\/(.+\.(js|css))/,
filterCoverageFile: (path)=>{
return !(path.includes('/src/js/') &&
!path.includes('js/common/weixin-third') &&
!path.includes('/js/common/weixin-ui') &&
!path.includes('js/lib') &&
!path.includes('campaign/manage') &&
!path.includes('common/utils') &&
!path.includes('rdcanvas') &&
!path.includes('rdsns') &&
!path.includes('moments/edit') &&
!path.includes('campaign/email_edit') &&
!path.includes('sns_assembly/revert') &&
!path.includes('common/report') &&
!path.includes('common/target') &&
!path.includes('material_std') &&
!path.includes('.scss') && !path.includes('.css'));
}
};
console.log('options=', options);
await pti.output(options);
})();
options说明
- nyc_output_path:必须,nyc的路径,跟你的package.json同一层级。
- src_dir:必须,源码目录,必须可访问
- source_map_dir:必须,编译js后同时生成的source_map目录
- url_regexp: 必须,需要过滤的js url正则。html里面加载了很多js文件,这个可以让我们过滤需要生成覆盖率的js文件
- filterCoverageFile: 非必须,true代表过滤这个文件的覆盖率。false代表不过滤。
npm运行脚本
"output_coverage": "node output_coverage.js && nyc report --reporter=html",
"coverage_summary": "node output_coverage.js && nyc report --reporter=text-summary"