はじめに
Next.js環境にtypescript+jestのテスト環境を入れたかったため、インストール内容の覚書として記載
前提条件
-
typescriptがインストールされていること
導入手順
jestをtypescriptで認識させるためにはBabelによる方法とts-jestを使う方法が存在するが、ここではts-jestを使った構築方法を記載する
インストール
jestとtypescript環境を一括でインストールする
yarn
yarn add --dev jest @types/jest ts-jest
npm
npm install --save-dev jest @types/jest ts-jest
初期化
以下コマンドで初期化を行うことで、jest.config.jsが生成され、jestに対してts-jestをpresetとして使用するように設定される。
yarn
yarn ts-jest config:init
npm
npx ts-jest config:init
jest.config.js
module.exports = {
preset: 'ts-jest',
testEnvironment: 'node',
};
また、package.jsonにてyarn testもしくはnpm testのコマンドでテストが実行できるように以下設定を追加する
"scripts": {
...
"test": "jest",
...
},
テストコードの記述と実行
テスト対象のtsファイルと、テストコードが記載されたtest.tsを用意する。
sum.ts
export function sum(a, b) {
return a + b;
}
sum.test.ts
import {sum} from './sum'
test('adds 1 + 2 to equal 3', () => {
expect(sum(1, 2)).toBe(3);
});
最後にテストを実行する
yarn
yarn test
npm
npm test
VSCodeの場合はJest Runnerの拡張機能を入れることでエディタ上から実行・デバッグすることができる
