Zenn
⛳

[Vitest]mockを使ってテストしてみよう

2024/04/11に公開
#
mock
#
テスト
Vitest
tech

はじめに

Vitest は、高速で柔軟なユニットテストフレームワークです。Vitest を使うことで、モックを活用したテストを簡単に書くことができます。本記事では、Vitest のモック機能を使ったテスト手法について解説します。

mockとは

mock とは、実際の動作を模倣したダミーオブジェクトのことです。テストを行う際に、実際の動作を再現するのが難しい場合や時間がかかる場合、mock を使うことで効率的にテストを行うことができます。

なぜmockを使うのか

mock を使うメリットは以下のようなことが考えられます。

  • 外部依存関係のあるコードをテストしやすくなる
  • 外部の API や DB 接続など、テスト環境で再現が難しい動作をモックできる
  • 外部システムの影響を受けずにテストできる
  • テストの実行時間が短縮できる
  • これらのメリットを活かすことで、効率的かつ信頼性の高いテストを書くことができます。

mockを使ってテストを書いてみる

Vitest では、vi.fn() を使ってモック関数を作成することができます。以下に具体的な例を示します。

export const mockTestFunc = (value1: number, value2: number): number => {
  return value1 + value2;
};

import { mockTestFunc } from './mock';
import { expect, test, vi } from 'vitest';

test('mockTestFunc adds two numbers correctly', () => {
  const mockFn = vi.fn(mockTestFunc);

  const result1 = mockFn(2, 3);
  expect(result1).toBe(5);
  expect(mockFn).toHaveBeenCalledWith(2, 3);
  expect(mockFn).toHaveBeenCalledTimes(1);

  const result2 = mockFn(10, 20);
  expect(result2).toBe(30);
  expect(mockFn).toHaveBeenCalledWith(10, 20);
  expect(mockFn).toHaveBeenCalledTimes(2);
});

test('mockTestFunc returns undefined for non-number inputs', () => {
  const mockFn = vi.fn(mockTestFunc);

  const result1 = mockFn('a' as unknown as number, 3);
  expect(result1).toBeUndefined();
  expect(mockFn).toHaveBeenCalledWith('a' as unknown as number, 3);

  const result2 = mockFn(10, false as unknown as number);
  expect(result2).toBeUndefined();
  expect(mockFn).toHaveBeenCalledWith(10, false as unknown as number);
});

この例では、mockTestFunc 関数をモック化し、正常な入力と異常な入力に対してテストを行っています。モック関数の呼び出し回数やパラメータ、戻り値などをアサーションすることで、関数の動作を検証しています。

Vitest の vi.fn() を使うことで、簡単にモック関数を作成できます。また、toHaveBeenCalledWith や toHaveBeenCalledTimes などのアサーション関数を使うことで、モック関数の呼び出しの検証も行えます。

最後に

Vitest を使ったモックを活用したテストについて解説しました。モックの活用は、効率的かつ信頼性の高いテストを書くための重要なテクニックです。

参考

https://vitest.dev/guide/mocking.html

https://vitest.dev/api/mock

Discussion