JavaScriptのテストフレームワーク Jestに入門する

岡野です。

‍

私は今までExcelで試験書を作成し、実施して結果をExcelの試験書に書き込むということが多かったのですが、昨今はテストフレームワークを使用することが多いと感じます。

‍

そこで今回はテストフレームワークのひとつである、Jestを使ってみたいと思います。

‍

本記事は**Jest公式のGetting Started**のやってみた記事になります。

やってみた感想から

以下、個人的な感想です。

‍

Excelの試験書とテストフレームワークでの試験、どちらが効率的かと言われると、

• 試験書作成の初期コストの面ではExcelでの試験書は試験の観点さえ押されば誰でも作成できますが、テストフレームワークはExcelに比べてお作法等、覚えることが多いのでExcelの方が初期コストはよいのかなと思います。
• テストの実施効率についてはExcelの試験書は作成したらデバッグや画面ポチポチ等、基本手動ですが、テストフレームワークは一度作成してしまえばコマンド一つで何度でも実施可能です。
• 一度作成した試験の流用性の面ではどちらも同等かと思います。
• ‍

総合的に見ると

• コーディングの流れで試験も作成・実施できるので、品質上がりそう
• 新人さんがよくやるテスター作業の中でコーディングできるので勉強にもなる。

とか考えると、テストフレームワークは導入した方がよいのかなと思います。ただ、テストをテストフレームワークで実施することを意識したコーディングが必要になるかもしれません。

Jestを使ってみる

Jestを試す環境(ディレクトリ)作成

$ mkdir jest
$ cd jest

Jestのインストール

$ yarn add --dev jest

pacakge.jsonを編集

以下をpackage.jsonに以下の追記します。

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

追記するとこんな感じになります。

{
  "scripts": {
    "test": "jest"
  },
  "devDependencies": {
    "jest": "^26.6.3"
  }
}

テスト対象のコード作成

以下のコードファイルを作成します。

引数で2つの数値を受け取り、加算する処理ですね。

ファイル名：sum.js

function sum(a, b) {
  return a + b;
}
module.exports = sum;

Jestでテストコードを作成

ファイル名：sum.test.js

// テスト対象のコードファイルを取り込む
const sum = require('./sum');

// test内に試験の概要を記載することができます。
test('adds 1 + 2 to equal 3', () => {

  // expect内に試験対象のメソッドを記載し、期待する結果を続けて記載します。
  expect(sum(1, 2)).toBe(3);
});

ちなみに**.toBe()の部分をMatcher(マッチャー)**と言います。

テスト実行

現在のディレクトリ構成はこんな感じです。

jest
├── node_module
├── package.json
├── sum.js
├── sum.test.js
└── yarn.lock

それではテストを実行してみましょう。

yarn testでテスト実行可能です。

$ yarn test
yarn run v1.22.4
warning package.json: No license field
$ jest
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: 1.162 s
Ran all test suites.
✨ Done in 2.05s.

テスト実行成功です！

思ったよりも簡単ですね。

いろんなMatcher

テスト対象のメソッドをexpectで実施する際、メソッドの結果に対してMatcherで評価するのですが、Jestには多くのMatcherが準備されています。

‍

主要なMatcherを確認したい場合はこちらをご確認ください。

すべてのMatcherを確認したい場合はこちらをご確認ください。

最後に

今回は入門ということでJest公式サイトのGetting Startedを実施しましたが、Jestには非同期処理とモック機能があります。

‍

いずれ、このあたりも記事にしたいと思います。

‍