测试覆盖率

2025年3月10日 · 阅读需 6 分钟

测试覆盖率是测试代码的质量，它表示代码被测试的百分比。

在系统学习构建 npm 包时，发现在推荐的徽章展示中包含测试覆盖率的徽章，有助于帮助用户了解代码的质量。

但是貌似遇见了我的知识盲区，遂学且记之。

🔧

🔧	特点
Coveralls	支持多种语言，与 github 集成简单，适合开源项目
codecov	支持更详细的报告分析，适合复杂的项目
SonarCloud	提供代码质量 + 覆盖率综合报告，适合企业级的项目

这里以 coveralls 及 codecov 为例。

Codecov 是一个开源的代码覆盖率平台，它提供了详细的报告分析，适合复杂的项目。 Codecov 支持多种语言，包括 JavaScript、Python、Ruby、Java、C++、C#、Go、Swift、Kotlin、Rust、PHP、R、Scala、Perl、Lua、Erlang、Haskell、OCaml、Clojure、Elixir、Pascal、Dart、Racket、Lisp、Fortran、Ada、Prolog、VBScript、VBA、Visual Basic、Objective-C、Objective-C++、Assembly、C。

1. 安装

npm install --save-dev jest jest-junit codecov # 生成 JUnit 格式测试报告
npm install --save-dev ts-jest ts-node @types/jest
npm install --save-dev jest-environment-jsdom

2. 配置

在 `package.json` 文件中添加 `scripts` 配置

package.json
"scripts": {
  "test": "jest --coverage",
  "coverage": "codecov"
}

在 `jest.config.js` 文件中添加配置 (同 coveralls)

jest.config.js
module.exports = {
  collectCoverage: true,
  coverageDirectory: 'coverage',
  coverageReporters: ['lcov', 'text-summary'],
  collectCoverageFrom: [
    'src/**/*.{js,jsx}',
    '!**/node_modules/**',
    '!**/vendor/**',
  ],
};

github actions 配置

创建（已有可修改）.github/workflows/coverage.yml 文件

node --eval "fs.mkdirSync('.github/workflows/', { recursive: true })"

.github/workflows/coverage.yml
name: Run tests and upload coverage

on:
  push:
    branches: [main]
    # tags: ['*']

jobs:
  test:
    name: Run tests and collect coverage
    runs-on: ubuntu-latest
    # 仅当提交消息包含 "version" 时运行自动化测试
    if: contains(github.event.head_commit.message, 'version')
    steps:
      - name: Checkout
        uses: actions/checkout@v4
        with:
          fetch-depth: 0

      - name: Set up Node
        uses: actions/setup-node@v4
        with:
          node-version: 20.x

      - name: Install dependencies
        run: npm install

      - name: Run tests
        run: npx jest --coverage

      - name: Upload results to Codecov
        uses: codecov/codecov-action@v5
        with:
          # token: ${{ secrets.CODECOV_TOKEN }} # 仅私人仓库需要
          files: ./coverage/lcov.info
          verbose: true

3. codecov 集成

获取 token（公开仓库可以省略 token）
- 登录 codecov
- 点击 Add Repo 按钮，添加仓库
- 获取 CODECOV_TOKEN (自动生成)
配置 github secrets
- 在 Settings ➡️ secrets ➡️ Actions 添加： CODECOV_TOKEN: <your_token>

CODECOV_TOKEN: <your-token>

4. 本地调试命令

CODECOV_TOKEN=your_token npm run coverage

5. 测试覆盖率报告

下面是 a-type-of-js 的 codecov 测试覆盖率报告

完整的示例

安装

npm install --save-dev jest jest-junit coveralls codecov # 生成 JUnit 格式测试报告
npm install --save-dev ts-jest ts-node @types/jest
npm install --save-dev jest-environment-jsdom

配置 jest.config.js

jest.config.js
/** @type {import('ts-jest').JestConfigWithTsJest} **/
export default () => {
  return {
    collectCoverage: true,
    collectCoverageFrom: ['index.ts', '!**/node_modules/**', '!**/vendor/**'],
    coveragePathIgnorePatterns: ['/node_modules/', '/dist/', 'test', '.*.d.ts'],
    coverageReporters: ['text', 'lcov', 'html', 'text-summary'],
    coverageDirectory: 'coverage',
    preset: 'ts-jest',
    verbose: true,
    testEnvironment: 'node',
    transform: {
      '^.+\\.tsx?$': [
        'ts-jest',
        {
          isolatedModules: true,
          tsconfig: 'tsconfig.json',
        },
      ],
    },
    testMatch: ['**/*.test.(js|ts|tsx)'],
  };
};

配置 package.json

package.json
{
  "scripts": {
    "test": "jest --coverage",
    "report": "cat ./coverage/lcov.info | coveralls",
    "coverage": "codecov"
  }
}

集成 codecov、coveralls

使用 github 账号分别登录 codecov、coveralls
添加仓库
获取 token （非私人仓库可以省略 token）
配置 github secrets

最终的 coverage.yml

node --eval "fs.mkdirSync('.github/workflows/', { recursive: true })"

.github/workflows/coverage.yml
name: Run tests and upload coverage

on:
  push:
    branches: [main]

jobs:
  test:
    name: Run tests and collect coverage
    runs-on: ubuntu-latest
    if: contains(github.event.head_commit.message, 'version')
    steps:
      - name: Checkout
        uses: actions/checkout@v4
        with:
          fetch-depth: 0

      - name: Set up Node
        uses: actions/setup-node@v4
        with:
          node-version: 20.x

      - name: Install dependencies
        run: npm install

      - name: Run tests
        run: npx jest --coverage

      - name: Upload results to Codecov
        uses: codecov/codecov-action@v5
        with:
          # token: ${{ secrets.CODECOV_TOKEN }}
          files: ./coverage/lcov.info
          verbose: true

      - name: copy coverage to test-coverage directory
        uses: coverallsapp/github-action@v2
        with:
          github-token: ${{ secrets.GITHUB_TOKEN }}
          path-to-lcov: ./coverage/lcov.info

测试覆盖率

🔧

🔧 Coveralls

1. 安装

2. 配置

在 `package.json` 文件中添加 `scripts` 配置

在 `jest.config.js` 文件中添加配置

github actions 配置

3. coveralls 集成

4. 本地调试命令

5. 测试覆盖率报告

🔧 Codecov

1. 安装

2. 配置

在 `package.json` 文件中添加 `scripts` 配置

在 `jest.config.js` 文件中添加配置 (同 coveralls)

github actions 配置

3. codecov 集成

4. 本地调试命令

5. 测试覆盖率报告

完整的示例

安装

配置 jest.config.js

配置 package.json

集成 codecov、coveralls

最终的 coverage.yml

参考资料

🔧

🔧 Coveralls​

1. 安装​

2. 配置​

在 package.json 文件中添加 scripts 配置​

在 jest.config.js 文件中添加配置​

github actions 配置​

3. coveralls 集成​

4. 本地调试命令​

5. 测试覆盖率报告​

🔧 Codecov​

1. 安装​

2. 配置​

在 package.json 文件中添加 scripts 配置​

在 jest.config.js 文件中添加配置 (同 coveralls)​

github actions 配置​

3. codecov 集成​

4. 本地调试命令​

5. 测试覆盖率报告​

完整的示例​

安装​

配置 jest.config.js​

配置 package.json​

集成 codecov、coveralls​

最终的 coverage.yml​

参考资料​

🔧 Coveralls

1. 安装

2. 配置

在 `package.json` 文件中添加 `scripts` 配置

在 `jest.config.js` 文件中添加配置

github actions 配置

3. coveralls 集成

4. 本地调试命令

5. 测试覆盖率报告

🔧 Codecov

1. 安装

2. 配置

在 `package.json` 文件中添加 `scripts` 配置

在 `jest.config.js` 文件中添加配置 (同 coveralls)

github actions 配置

3. codecov 集成

4. 本地调试命令

5. 测试覆盖率报告

完整的示例

安装

配置 jest.config.js

配置 package.json

集成 codecov、coveralls

最终的 coverage.yml

参考资料