时间戳

首页 > 解决方案 > Cypress 和 React ts/tsx 代码覆盖没有返回结果。总是 100% 因为没有测试任何东西。仪器代码问题可能

cypress - Cypress 和 React ts/tsx 代码覆盖没有返回结果。总是 100% 因为没有测试任何东西。仪器代码问题可能

问题描述

目前在使用 React 17.0.2 时根本没有收到任何代码覆盖率。

注意：不使用 react 脚本，因此无法利用 instrument-cra 插件。

我原以为通过@cypress/browserify-preprocessortypescript 选项会完成仪器代码步骤，但赛普拉斯仍然抱怨。有什么想法吗？

要复制问题：

添加简单的ts函数：（add.ts）

export const add = (a: number, b: number) => {
    return a + b;
};

对其进行测试：（add.spec.ts）

import { add } from './add';

it('adds numbers', () => {
    expect(add(2, 3)).to.equal(5);
});

内support/index.js

import '@cypress/code-coverage/support'

内plugins/index.js

const webpack = require('@cypress/webpack-preprocessor')

module.exports = (on, config) => {
    const options = {
        webpackOptions: require('../../webpack.config.coverage.js'),
    };
    on('file:preprocessor', webpack(options))
    // cypress coverage
    require('@cypress/code-coverage/task')(on, config);
    const browserify = require('@cypress/browserify-preprocessor')
    const optionsBrowserify = browserify.defaultOptions
    optionsBrowserify.browserifyOptions.transform[1][1].babelrc = true
    optionsBrowserify.typescript = require.resolve('typescript')
    module.exports = browserify(optionsBrowserify)
    return config;
};

里面babelrc.json：

{
  "plugins": [
    "istanbul"
  ],
}

里面webpack.config.coverage：

module: {
    rules: [
      {
        // when bundling application's own source code
        // transpile using Babel which uses .babelrc file
        // and instruments code using babel-plugin-istanbul
        test: /\.(tsx|ts)$/,
        include: path.resolve(__dirname, '../src'),
        exclude: /(node_modules|bower_components)/,
        use: [
          {
            loader: 'babel-loader'
          }
        ]
      }
    ]
  },

然后运行测试npm or npx cypress open 输出： 错误

通过查看窗口覆盖对象，无法在您的应用程序中找到任何覆盖信息。您是否忘记检测您的应用程序？请参阅代码覆盖率#instrument-your-application [@cypress/code-coverage]

转到上面的链接，没有解决方案按照文档中的建议工作。

标签： cypresscode-coverage

解决方案

推荐阅读