【JavaScript入門】本格的なテスト

簡易 assert で赤字が出るだけでも便利でしたが、実運用では

  • 何百本ものテストケースを一括実行
  • 失敗時の差分表示・モック注入・カバレッジ測定
  • CI(GitHub Actions など)と連携して PR ごとに自動判定

 が欲しくなります。そこで登場するのが テストフレームワーク です。ここではフロントエンド/Node.js の現場で定番となっている Jest をメインに、Mocha との比較も交えながら「本格的なテスト」を最小構成で動かしてみます。

フレームワーク特徴向いている用途
Jest断トツの利用率。expect API, モック, カバレッジ, Watch モードをオールインワン提供。React/Next.js など Web SPA, Node ユーティリティ
Mocha + Chai極めてシンプルなテスランナー。アサートやモックは好みのライブラリと組み合わせ。ライブラリ開発、小規模 CLI
VitestVite 構成と相性抜群。Jest 互換 API+高速実行(ESM)。Vite + TS/React/Vue プロジェクト

TIP: Jest の設定が重いと感じたら Vite プロジェクトでは Vitest を検討するとビルド高速化に役立ちます。

5 分で動く Jest プロジェクト

1.ディレクトリ準備

mkdir jest-demo
cd jest-demo
Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope Process
npm init -y
npm i -D jest   # Jest を開発依存で追加

2.被テストコード sum.js

// 足し算ユーティリティ
function sum(a, b) {
  return a + b;
}
module.exports = sum;

3.テストコード sum.test.js

const sum = require('./sum');

describe('sum 関数', () => {
  test('1 + 2 は 3', () => {
    expect(sum(1, 2)).toBe(3);
  });

  test('負数も加算できる', () => {
    expect(sum(-5, 8)).toBe(3);
  });
});

4.package.json に以下のスクリプト追加

{
  "scripts": {
    "test": "jest"
  }
}

追加後のスクリプトは以下となります。

{
  "name": "jest-demo",
  "version": "1.0.0",
  "main": "index.js",
  "scripts": {
    "test": "jest"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "description": "",
  "devDependencies": {
    "jest": "^29.7.0"
  }
}

5.実行

npm test

> jest-demo@1.0.0 test
> jest

 PASS  ./sum.test.js
  sum 関数
    ✓ 1 + 2 は 3 (2 ms)
    ✓ 負数も加算できる

Test Suites: 1 passed, 1 total
Tests:       2 passed, 2 total
Snapshots:   0 total
Time:        1.23 s


まとめ

  • Jest を使えば “インストール → npm test” だけで 高速かつリッチなテスト環境 が完成。
  • CLI 実行は CI との親和性が高く、プルリク時に自動実行するだけで大規模リグレッションを防止。
  • テストスイートには 1) arrange(準備)→2) act(実行)→3) assert(検証) の 3 段を意識すると読みやすい。

まずはユーティリティ関数 1 本でも良いので Jest テストを書き、成功体験をチームに浸透させてみましょう。