見出し画像

【Jest_83】 CIにJestを組み込むには？

構造を読む人

CIにJestを組み込む【環境構築〜

1. CIにJestを組み込む目的とメリット

  • コード変更のたびにテスト自動実行で品質保証

  • PRマージ前にテストが通るか検証しバグ混入を防止

  • テストカバレッジを継続的に監視

  • テストの信頼性を保ちながら自動化することで開発スピードアップ

2. 前提条件

  • Jestがローカルで動作しテストが正常に完了すること

  • Node.js環境がCI環境にインストールされていること

  • プロジェクトはGit管理されていること（GitHub, GitLab, Bitbucketなど）

3. CIツールの選定

  • GitHub Actions（GitHub公式、無料枠あり）

  • GitLab CI/CD（GitLabユーザー向け）

  • CircleCI

  • Travis CI（非推奨傾向だがまだ利用者あり）

  • Jenkins（オンプレなど）

ここでは最もメジャーな GitHub Actions を例に解説します。

4. GitHub ActionsでJestを実行する設定

4-1. ワークフローファイル作成

プロジェクトのルート直下に .github/workflows/test.yml を作成します。

name: Run Jest Tests

on:
  push:
    branches:
      - main
      - master
  pull_request:
    branches:
      - main
      - master

jobs:
  test:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout repository
        uses: actions/checkout@v3

      - name: Setup Node.js
        uses: actions/setup-node@v3
        with:
          node-version: 18

      - name: Install dependencies
        run: npm ci

      - name: Run Jest tests
        run: npm test -- --ci --coverage

4-2. ポイント解説

  • actions/checkout@v3 でリポジトリをチェックアウト

  • actions/setup-node@v3 でNode.jsをセットアップ（バージョン指定可能）

  • npm ci はpackage-lock.jsonに忠実なクリーンインストール

  • npm test -- --ci --coverage でJestをCIモードで実行、かつカバレッジ計測も可能

5. JestのCIモードとは？

  • --ci オプションはCI環境向けに最適化した実行モード

  • 並列処理数の調整やwatchモード無効化などを自動設定

  • カバレッジレポートの生成もこのモードで有効化しやすい

6. テスト結果の表示をわかりやすくする工夫

6-1. カバレッジレポートの活用

  • jest.config.js で collectCoverage: true を設定

  • GitHub Actionsなどでレポートをアップロード、カバレッジバッジを表示可能

例：

module.exports = {
  collectCoverage: true,
  coverageDirectory: 'coverage',
  coverageReporters: ['text', 'lcov'],
}

6-2. テスト結果のサマリー表示

  • 標準出力にテスト失敗やカバレッジが表示されるので、ログをCI画面で確認可能

7. 失敗時の通知設定（オプション）

  • GitHub ActionsならPRコメントやSlack連携などで通知可能

  • actions/github-script などを使い柔軟にカスタマイズできる

8. よくあるトラブルと対処法

Nodeバージョン違いでローカルと動作差が出る
　CI設定のNodeバージョンをローカルに合わせる
ネットワークアクセスするテストが失敗する
　API呼び出しはモック化するか、テスト用のスタブサーバを立てる非同期テストのタイムアウトが起きる
　jest.setTimeout() でタイムアウト値を調整
カバレッジ計測がうまくいかない
　Jestの設定ファイルを見直す（collectCoverage等）

9. 複数環境・マトリックス構成

複数のNode.jsバージョンやOSでテストしたい場合は、

strategy:
  matrix:
    node-version: [16, 18, 20]
    os: [ubuntu-latest, macos-latest, windows-latest]
runs-on: ${{ matrix.os }}

steps:
  - name: Setup Node.js
    uses: actions/setup-node@v3
    with:
      node-version: ${{ matrix['node-version'] }}

10. CIに組み込むための実践的Tips

  • ローカルでnpm test --ciが必ず通ることを確認する

  • テストの実行時間を短縮するために必要に応じてテストの並列化やキャッシュ利用を検討

  • テスト失敗時は詳細ログを必ず確認し、原因特定を迅速化する運用を作る

  • CIのジョブを分割してビルドやLintと分けて実行しやすくする

  • カバレッジ閾値を設定し、カバレッジ低下を防ぐ（coverageThreshold）

11. まとめ

1
　Node.jsとJestがローカルで正常に動くことを確認
2
　CIツールを選定し、Jestコマンドを組み込む
3
　.github/workflowsにワークフローファイル作成
4
　npm ciで依存インストールしnpm test --ciで実行
5
　テスト結果とカバレッジをCI画面で確認・管理
6
　失敗通知や複数環境テストなど拡張を検討


いいなと思ったら応援しよう！