Cypress单元测试显示覆盖率对象为空或未找到覆盖率信息问题咨询

我之前也被这个问题卡过好一阵！看到你碰到的空覆盖率对象和那个警告，大概率是代码插桩或者Cypress插件配置出了问题，下面是我亲测有效的排查和解决步骤，一步步来应该能搞定：

1. 先确认应用代码是否正确被插桩（Instrument） #

这是警告里明确提示的点，也是最常见的原因。不同的构建工具配置方式不一样：

• Webpack + Babel 项目：
  首先安装插桩依赖：

  npm install babel-plugin-istanbul --save-dev
  

  然后在你的Babel配置文件（.babelrc或babel.config.js）里添加插件，注意只在测试环境启用，避免影响生产代码：

  {
    "env": {
      "test": {
        "plugins": ["istanbul"]
      }
    }
  }
  

• Vite 项目：
  使用Vite专用的插桩插件，先安装：

  npm install vite-plugin-istanbul --save-dev
  

  然后在vite.config.js里配置：

  import istanbul from 'vite-plugin-istanbul';
  
  export default {
    plugins: [
      istanbul({
        include: 'src/**/*', // 指定要覆盖的代码目录
        exclude: ['node_modules', 'test/**/*'], // 排除不需要统计的目录
        extension: ['.js', '.vue', '.ts', '.tsx'] // 适配你的项目文件扩展名
      })
    ]
  };
  

2. 检查Cypress覆盖率插件的安装与注册 #

确保@cypress/code-coverage的配置全流程都到位：

• 先安装插件依赖：

  npm install @cypress/code-coverage --save-dev
  

• 在Cypress的支持文件里导入插件支持：
  打开cypress/support/e2e.js（如果是组件测试则是cypress/support/component.js），添加：

  import '@cypress/code-coverage/support'
  

• 在Cypress的配置文件里注册任务：
  打开cypress.config.js，修改setupNodeEvents部分：

  const { defineConfig } = require('cypress')
  
  module.exports = defineConfig({
    e2e: {
      setupNodeEvents(on, config) {
        // 注册覆盖率收集任务
        require('@cypress/code-coverage/task')(on, config)
        return config
      }
    },
    // 组件测试也要同步配置
    component: {
      setupNodeEvents(on, config) {
        require('@cypress/code-coverage/task')(on, config)
        return config
      }
    }
  })
  

3. 验证window.__coverage__对象是否存在 #

运行测试时，打开浏览器开发者工具的Console面板，输入window.__coverage__：

• 如果返回undefined，说明插桩完全没生效，回到第一步重新检查构建工具的插桩配置。
• 如果返回了正常的对象，那可能是Cypress插件没正确捕获到，这时候可以在测试里加个断言验证：

  cy.visit('/') // 访问你的应用首页
  cy.window().should('have.property', '__coverage__') // 断言覆盖率对象存在
  

4. 排除其他干扰因素 #

• 禁用生产模式的代码压缩：如果测试时用了mode: 'production'（Webpack）或build: { minify: true }（Vite），会把插桩代码移除，测试时一定要用开发模式。
• 清理缓存：删除node_modules/.cache、dist或build目录，重新安装依赖并构建项目，避免旧的缓存代码影响。
• 排查冲突插件：如果项目里有代码分割、按需加载类的插件，暂时禁用它们，测试是否能正常生成覆盖率，再逐步排查冲突点。

5. 组件测试的特殊注意点 #

如果是用Cypress组件测试，除了上面的配置，还要确保：

• 组件测试的配置文件里也注册了覆盖率任务（上面的component部分）
• 组件的构建环境也启用了插桩，比如Vite的组件测试会单独用一个配置，要确保那个配置里也加了vite-plugin-istanbul。

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