我一直在尝试使赛普拉斯代码覆盖范围与我的Angular生产项目一起工作无济于事。
为了尝试帮助诊断它,我创建了一个最小的实现项目,以确保我没有在生产版本中引入任何奇怪的东西,我不认为这是同样的问题。它开始使我发疯!
我使用了一些参考资料,据我所知,我已经准备好了必要的东西:
据我所知,Angular和Cypress的一面都已连接起来,并且正在.nyc_output文件夹和覆盖率报告中获取输出。但是,该报告并未指出打字稿行的覆盖范围或这些统计信息。
我见过this,但似乎没有帮助。
代码检测(Webpack扩展+ angular.json):
module.exports = {
module: {
rules: [
{
test: /\.(js|ts)$/,loader: "istanbul-instrumenter-loader",options: { esModules: true },enforce: "post",include: require("path").join(__dirname,"..","src"),exclude: [
/\.(e2e|spec)\.ts$/,/node_modules/,/(ngfactory|ngstyle)\.js/,],},};
"serve": {
"builder": "ngx-build-plus:dev-server","options": {
"browserTarget": "architecture-testing:build","extraWebpackConfig": "./cypress/coverage.webpack.js","sourceMap": true
},"configurations": {
"production": {
"browserTarget": "architecture-testing:build:production"
}
}
}
赛普拉斯似乎正在记录和保存报道:
const registerCodeCoveragetasks = require("@cypress/code-coverage/task");
module.exports = (on,config) => {
registerCodeCoveragetasks(on,config);
return config;
};
out.json似乎具有正确的文件和代码映射:
package.json(nyc config + deps):
{
"name": "architecture-testing","version": "0.0.0","scripts": {
"postinstall": "ngcc","ng": "ng","start": "ng serve","build": "ng build","test": "ng test","lint": "ng lint","e2e": "ng e2e","precypress": "rimraf .nyc_output coverage","cypress": "ng run architecture-testing:cypress-run","cypress:open": "cypress open","cypress:run": "cypress run"
},"nyc": {
"extends": "@istanbuljs/nyc-config-typescript","all": true,"exclude": [
"coverage/**","cypress/**","**/*.spec.ts"
]
},"private": true,"dependencies": {
"@angular/animations": "~9.1.9","@angular/common": "~9.1.9","@angular/compiler": "~9.1.9","@angular/core": "~9.1.9","@angular/forms": "~9.1.9","@angular/platform-browser": "~9.1.9","@angular/platform-browser-dynamic": "~9.1.9","@angular/router": "~9.1.9","rxjs": "~6.5.4","tslib": "^1.10.0","zone.js": "~0.10.2"
},"devDependencies": {
"@angular-devkit/build-angular": "~0.901.7","@angular/cli": "~9.1.7","@angular/compiler-cli": "~9.1.9","@briebug/cypress-schematic": "^3.3.0","@cypress/code-coverage": "^3.8.1","@cypress/webpack-preprocessor": "5.4.1","@istanbuljs/nyc-config-typescript": "^1.0.1","@types/node": "^12.11.1","codelyzer": "^5.1.2","cypress": "^4.8.0","istanbul-instrumenter-loader": "^3.0.1","istanbul-lib-coverage": "^3.0.0","ngx-build-plus": "^9.0.6","nyc": "^15.1.0","rimraf": "^3.0.2","source-map-support": "^0.5.19","ts-loader": "7.0.5","ts-node": "^8.3.0","tslint": "~6.1.0","typescript": "~3.8.3"
}
}
规范文件:
it('does something',() => {
cy.visit('http://localhost:4200');
cy.get('[data-cy=button-one]').click();
cy.get('[data-cy=button-output]').should('have.text','you clicked button 1');
});
抱歉,已经很久了,但是我对下一步该怎么做感到困惑。如果您能指出我的任何方向,我都非常感谢。
根据答案调查进行更新:
查看@ cypress / code-coverage的过去版本,似乎对我来说是该插件的v3.3.0中引入的问题。降级最小项目时,所有v3.2。*版本都对我有用。在查看了v3.3.0的文档更改之后,自述文件中的关键信息是:
**Note:** if you have `all: true` NYC option set,this plugin will check the produced `.nyc_output/out.json` before generating the final report. If the `out.json` file does not have information for some files that should be there according to `include` list,then an empty placeholder will be included,see [PR 208](https://github.com/cypress-io/code-coverage/pull/208).
我最初的nyc配置是:
"nyc": {
"extends": "@istanbuljs/nyc-config-typescript","**/*.spec.ts"
]
}
所以出于某种原因,即使我在out.json中对正在测试的文件具有度量标准,也正在创建第二个“空占位符”节点并覆盖随后的报告生成。我猜这可能是我的设置的错误或问题,所以会问创作者。
如果我将nyc配置更改为以下内容,现在可以看到覆盖范围:
"nyc": {
"extends": "@istanbuljs/nyc-config-typescript","include": [
"src/**/*.ts"
],"**/*.spec.ts"
]
}
这确实意味着,如果我未通过测试命中文件,则该文件将不作为“ all”作为空占位符包括在内:true不再存在。
在@ briebug / cypress-schematic @ 3.3.0看来,这似乎没有引起任何问题(在不使用其生成器的情况下也会发生同样的问题),但已被提出为here和here