黄瓜-柏树伊斯坦布尔一体化

Question

我做了一个项目与反应，柏树，黄瓜和柏树图像快照，以测试前端测试。所有这些都工作得很好，现在我想为执行的黄瓜测试获得一些代码覆盖率。

我试着按照这里的建议(https://github.com/cypress-io/code-coverage)来设置它，但是没有运气。

我也尝试过这个解决方案(https://github.com/cypress-io/cypress/issues/346#issuecomment-365220178)，但结果是一样的。

测试以成功结束，但是代码覆盖率显示了语句、分支、函数和行的Unknown% 0/0。

我目前的设置：

support/index.js

import '@cypress/code-coverage/support'
import './commands'

plugins/index.js

const cucumber = require('cypress-cucumber-preprocessor').default;
const {
  addMatchImageSnapshotPlugin,
} = require('cypress-image-snapshot/plugin');

module.exports = (on, config) => {
  addMatchImageSnapshotPlugin(on, config);
  on('task', require('@cypress/code-coverage/task'))
  on('file:preprocessor', cucumber());
};

Answer 1

由于您没有提到任何关于检测应用程序的内容，所以您正在测试的web应用程序应该按照代码覆盖率的顺序进行测试。

有关检测应用程序的更多信息

https://github.com/cypress-io/code-coverage#instrument-your-application

Answer 2

代码覆盖率要求首先对代码进行检测。在React应用程序中，测试代码的最简单方法是使用@柏树/乐器-cra。只需在package.json中的开始脚本中添加此工具即可

"start": "react-scripts -r @cypress/instrument-cra start"

这将在每次启动应用程序时检测您的代码，并在应用程序根目录生成一个..nyc输出文件夹，该文件夹将包含所有检测代码。您可以通过检查窗口覆盖对象来验证代码是否已被检测。

完成设置：

package.json

"start": "react-scripts -r @cypress/instrument-cra start"

::::

"nyc": {
"extends": "@istanbuljs/nyc-config-typescript",
"all": true,
"report-dir": "coverage",
"reporter": [
  "text",
  "json",
  "lcov",
  "html"
],
"include": [
  "src/**/*.js"
],
"exclude": [
  "**/*.test.js",
  "**/test.js",
  "src/**/*.test.js",
  "src/**/**/*.test.js"
]

}

plugins/index.js

module.exports = (on, config) => {
require('@cypress/code-coverage/task')(on, config);
return config;

支持/索引.

import '@cypress/code-coverage/support';