React+TypeScript项目Cypress E2E测试覆盖率0%问题求助

我在React+TypeScript项目中使用Cypress进行E2E测试，编写了18个测试用例，但覆盖率始终显示0%，推测是配置环节存在问题。项目采用Yarn安装依赖，环境版本：Node ^18.10.0，@types/node ^20.3.2，@cypress/code-coverage ^3.10.7，cypress ^12.16.0，@istanbuljs/nyc-config-typescript ^1.0.2，遵循istanbul(nyc)方案而非babel。

现有配置信息 #

package.json 脚本配置 #

{
  "scripts": {
    "cypress": "nyc --all cypress run",
    "cypress:open": "nyc cypress open",
    "coverage": "nyc report --reporter=html && nyc report --reporter=text-summary --report-dir=coverage_e2e"
  }
}

.nycrc 配置 #

{
    "include": ["src/**/**/**/*.{ts,tsx,js,jsx}", "instrumented/**"],
    "exclude": ["src/tests/**/*.ts"],
    "reporter": ["lcov", "text-summary"],
    "extends": "@istanbuljs/nyc-config-typescript",
    "all": true,
    "check-coverage": true,
    "excludeAfterRemap": false
}

cypress.config.ts 配置 #

import registerCodeCoverageTasks from '@cypress/code-coverage/task';
import {defineConfig} from 'cypress';

export default defineConfig({
    e2e: {
        setupNodeEvents(on, config) {
            registerCodeCoverageTasks(on, config);
        },
    },
    viewportHeight: 720,
    viewportWidth: 1080,
    defaultCommandTimeout: 10000,
    video: false,
});

cypress/plugins/index.ts 配置 #

const codeCoverageTask = require('@cypress/code-coverage/task');

module.exports = (on, config) => {
    codeCoverageTask(on, config);
    return config;
};

cypress/support/index.ts 配置 #

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

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

执行结果 #

ERROR: Coverage for lines (0%) does not meet global threshold (90%)

=============================== Coverage summary ===============================
Statements   : 0% ( 0/443 )
Branches     : 0% ( 0/34 )
Functions    : 0% ( 0/135 )
Lines        : 0% ( 0/364 )

排查方向 #

1. 移除重复的任务注册
   cypress.config.ts已通过registerCodeCoverageTasks注册覆盖率任务，但cypress/plugins/index.ts和cypress/support/index.ts又重复注册了相同任务，会导致逻辑冲突。保留cypress.config.ts中的注册逻辑，删除另外两个文件里的重复代码。

2. 调整NYC命令参数
   nyc --all cypress run中的--all参数会强制统计所有文件，但如果代码未被正确插桩，结果仍会是0%。先移除--all，确保@cypress/code-coverage的自动插桩逻辑正常运行后再考虑是否添加。

3. 简化文件匹配路径
   .nycrc中include字段的src/**/**/**/*.{ts,tsx,js,jsx冗余，改为src/**/*.{ts,tsx,js,jsx}即可匹配所有src下的目标文件；若未手动生成instrumented目录，可删除该路径，插桩逻辑由插件自动处理。

4. 检查TypeScript配置
   确保tsconfig.json的compilerOptions中开启sourceMap: true，NYC需要source map才能正确映射TypeScript代码到覆盖率统计。

5. 对齐依赖版本
   @types/node版本（^{20.3.2）高于Node实际版本（}18.10.0），可能存在类型兼容问题，降级@types/node到^18.x.x版本。

6. 清理缓存重新执行
   删除node_modules/.cache、.nyc_output、coverage等目录，重新执行yarn install和测试命令，避免缓存导致插桩失效。

内容的提问来源于stack exchange，提问作者Venden