🕌

Jestで簡単ユニットテスト

2021/04/19に公開

とりあえずテストみたいな精神

------------------- ↓ 前書はここから ↓-------------------

JavaScriptほどコードの信頼性が低いプログラミング言語はない(暴論)

個人的にはTypeScriptをずっとやっているわけだが、
所属チームが必ずしもそうとは限らないわけで。
言語にかかわらず実行前にテストをしっかりやることが重要になってくる。
"単体テスト"といっても実装者が動作確認することでなく、
Jest, PHPUnitなどのテストツールを使ってテストすることをいう。
(筆者は言葉を分けて"ユニットテスト"と呼んでいる。)

JavaScriptのテストツールはいろいろあるが、
個人的に使いやすいのがJestだと思う。
他のツールは使用までの準備が面倒くさい。

簡単な修正とかでコードを書くときに、
サクッとテストする方法をここに載せておく。

ヾ(・ω<)ノ" 三三三● ⅱⅲ コロコロ♪

------------------- ↓ 本題はここから ↓-------------------

前提

NodeJSが稼働していること
未稼働の人はnodebrew(mac, linux)やnodist(windows)、Homebrew(mac, linux)などを使って入れといてほしい。

Jestのインストール

npm経由でJestをインストールする
global側に入れておくとパスを通す必要もない

npm install -g jest
jest --version
26.6.3

Globalがいやだとこだわりのある人は
npx経由で使うといい

npm install jest
npx jest --version
26.6.3

基本設定

任意の場所に設定ファイルを生成しておく

jest --init
(全部Enterで可)

テストケースの書き方

テストケースを記述するというと毛嫌いする人がいるが、
あまり難しく考えなくていい。
デモに倣って書くと、

sum.js
const sum = (a, b) => {
  return a + b;
}
module.exports = sum;
sum.test.js
const sum = require('./sum');

test('adds 1 + 2 to equal 3', () => {
  expect(sum(1, 2)).toBe(3);
});
jest sum.test.js
 PASS  ./sum.test.js
  ✓ adds 1 + 2 to equal 3 (2 ms)

Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   0 total
Time:        0.478 s
Ran all test suites.

お試し運用

さて、それでは実際どうやって使うかだが、
一番簡単なのは作ったコードのメソッド(関数でも可)を切り出して、
テスト実行してみることだ。

上記sum.jsが切り出したfunctionだとして、
以下のように様々なパターンでテストを実行する
(データプロバイダパターンという)

sum.test.js
const sum = require('./sum')

test.each([
  [1, 2, 3],
  [2, 3, 5],
  [3, 4, 7],
])('adds %i + %i to equal %i', (a, b, expected) => {
  expect(sum(a, b)).toBe(expected)
})
jest sum.test.js
 PASS  ./sum.test.js
  ✓ adds 1 + 2 to equal 3 (2 ms)
  ✓ adds 2 + 3 to equal 5
  ✓ adds 3 + 4 to equal 7 (1 ms)

Test Suites: 1 passed, 1 total
Tests:       3 passed, 3 total
Snapshots:   0 total
Time:        0.392 s, estimated 1 s
Ran all test suites matching /sum.test.js/i.

test, describe, itにはそれぞれeachメソッドが実装されているので、
様々なパターンでテストを実行できる。

たとえば、null, undefiend, '', 0のように、
変数にNullっぽいものを追加して分岐が正常になっているかを確認することができる。

Discussion