※この記事はドラフト版です。
関数単体テストの実施 準備
フロントエンドの言語がTypeScriptであるため
「Jest」というテストツールを使って関数のテストを行っていきます。
※３年前にとある案件でnode.jsでバックエンドの処理を作っていた際に
後からJest導入が要件に追加され苦労した記憶。。。
Jestのインストール
※node.jsがインストールされている前提です。
npm install --save-dev jest ts-jest @types/jest ts-node
Jestの設定を行う
スクリプトを追加する
package.json
{
"scripts": {
"test": "jest"
}
}
Jestの設定ファイルを作成する
npx ts-jest config:init
次のファイルが作成される
jest.config.js
/** @type {import('ts-jest').JestConfigWithTsJest} */
module.exports = {
preset: "ts-jest",
testEnvironment: "node",
};
Jestを使ってみる
前の手順までで、Jestの準備が終わりました。
実際にJestを試していきます。
関数の作成
Jestにかける用の関数を作っていきます。
add.ts
export function add(x: number, y: number) {
return x + y;
}
テストコードの作成
先ほど作成した関数をテストするコードを書いていきます。
add.test.ts
import { add } from "./add";
test("1 + 1 は 2", () => {
expect(add(1, 1)).toBe(2);
});
テストの実行
npm run test
下記の警告が表示
ts-jest[config] (WARN) message TS151001: If you have issues related to imports, you should consider setting `esModuleInterop` to `true` in your TypeScript configuration file (usually `tsconfig.json`). See https://blogs.msdn.microsoft.com/typescript/2018/01/31/announcing-typescript-2-7/#easier-ecmascript-module-interoperability for more information.
TypeScriptの設定ファイルの作成
npx tsc --init
再度テストの実施
npm run test
警告が消えた
VSCodeのjestの拡張機能のインストール
Runボタンを押すと、該当のテストケースだけ実行してくれる
まとめ
テストの実施の記事のつもりでしたが、準備だけで終わりました。
Jestの設定が初期値なので不安がありますが、動いているのでOKとします。
今後、テストを行う中で不具合がでたら対応する方向で行きます。
次の予定は加算だけでなくいくつかの関数を書いて、関数毎にテストを書いていく予定です。