2
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Jestについて学んだことまとめ

Last updated at Posted at 2020-01-17

目次

  1. Jestとは
  2. なぜテストが必要なのか
  3. 何をテストするのか
  4. Jestの使い方について
  5. 今後学習すべき課題

今回の学習のゴール

  • Jestとは何か、何ができるかを知る
  • 実際の使い方について知る

1. Jestとは

  • Facebookがオープンソースとして開発しているテストフレームワーク
  • JavaScriptの単体テストのためのツール
  • 特徴
    • テストを自動的に並行で実行する
    • ウォッチモードでは変更されたファイルに関連するテストのみを実行する
      • ウォッチモード : テストコードに変更がある度にテストを実行できるモード
  • TypeScriptで記述したものでも利用できる

2. なぜテストが必要なのか

  • 品質の担保のため
    • 不具合が発生しないようにするため
    • 仕様通りに動くことを確認しリリースするため

※ テストカバレッジを出すことで、テストケースが十分に網羅されていないコードをできるだけ少数に抑えることが可能となる(テストカバレッジとは、所定の網羅条件がテストによってどれだけ実行されたかを割合で表したもの)

3. 何をテストするのか

  • Jestは、JavaScriptの単体テストのためのツールであるので、
    関数やメソッドといった小さい単位で1つ1つの処理が正しく機能しているかを確認する
    • 単体テストは、テストの1種
      • ウォーターフォール型の開発では、単体テスト、結合テスト、システムテスト、運用テストがある
      • 結合テストでは、いくつかのモジュールを組み合わせた際に仕様通り動くか確認する
      • システムテストでは、開発環境ではなく本番同様の環境で、仕様通り動くか要件を満たしているか等の確認をする
      • 運用テストでは、システムの運用者(エンドユーザー)が動作を確認する
    • 単体テストは、テストの対象単位が小さく摘出した不具合の修正が比較的簡単であるため、できるだけ多くのバグを摘出する必要がある

4. Jestの使い方について

npmを利用してJestをローカルにインストール

npm install --save-dev jest

matcher関数(値のテストをする関数)を使ったJest使用例

※ matcher関数の一覧はexpect API ドキュメントを参照

  • テストしたい対象を用意
sum.js
function sum(a, b) {
  return a + b;
}
module.exports = sum;    // 関数sumをmoduleとして扱いexportsする
  • テストコードが書かれたファイルの作成
    • 関数expectは、値をテストしたい時に使用する関数で、値について何らかの事をアサートする関数とともに使用する
sum.test.js
const sum = require('./sum');    // exportsされた関数を呼び出す

test('adds 1 + 2 to equal 3', () => {
  expect(sum(1, 2)).toBe(3);    // 関数expectと関数toBeの値が等しいかテスト
});

package.jsonに以下を記述

  • scriptsプロパティは、任意のshell scriptを実行するエイリアスコマンドを定義できる
    • shell scriptで書かれる主な処理は、ファイルの操作、プログラムの実行、テキストの印刷など
    • エイリアスとは、コマンドに別名を付けること
  • npm run testでテストを実行することができるようになる
package.json
{
  "scripts": {
    "test": "jest"
  }
}
  • 上記のファイル構成は以下の通り
.
├── package.json
├── sum.js
└── sum.test.js

テストの実行コマンド

npm run test

実行結果

  • テストが成功して問題がなかった場合PASSと表示される
    • テストに失敗するとFAILと表示される
PASS  ./sum.test.js
✓ adds 1 + 2 to equal 3 (5ms)

Jestコマンドのヘルプ

  • 使用可能な全てのオプションを参照できる
jest --help

ウォッチモードでテストを実行する場合

  • テストコードに変更がある度にテストを実行することができるモード
npm test -- --watch    # npmで実行
npm test -- --watchAll    # npmで全てのテストを実行

5. 今後学習すべき課題

  • API Reference · Jestを参照して、テストファイル内に記述するメソッドについて理解し、実際にテストコードを書く
  • テストどこまでやるのか問題

参考

2
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?