jest

// src/utils/fetchData.ts
import axios, { AxiosResponse } from 'axios';

// fetchData関数の引数であるurlの型を定義
type Url = string;

// fetchData関数の戻り値の型を定義
interface Data {
  id: number;
  title: string;
}

// fetchData関数の定義
// 引数としてurlを受け取り、戻り値としてPromise<Data>型を返す
export async function fetchData(url: Url): Promise<Data> {
  try {
    const response: AxiosResponse<Data> = await axios.get(url);
    return response.data;
  } catch (error) {
    throw error;
  }
}

// src/__tests__/utils/fetchData.test.ts
import { fetchData } from '../../utils/fetchData';
import axios, { AxiosResponse } from 'axios';

// axiosの型定義からMockを作成
const mockedAxios = axios as jest.Mocked<typeof axios>;

// テスト対象のデータ型
interface Data {
  id: number;
  title: string;
}

describe('fetchData', () => {
  it('should fetch data successfully', async () => {
    // モックされたaxios.getのレスポンスを設定
    const mockResponse: AxiosResponse<Data> = {
      data: {
        id: 1,
        title: 'Sample Title'
      },
      status: 200,
      statusText: 'OK',
      headers: {},
      config: {}
    };
    mockedAxios.get.mockResolvedValue(mockResponse);

    const url = 'https://api.example.com/data/1';
    const data = await fetchData(url);

    // axios.getが期待通りに呼び出されたことを確認
    expect(mockedAxios.get).toHaveBeenCalledWith(url);
    // fetchData関数が期待通りのデータを返すことを確認
    expect(data).toEqual({
      id: 1,
      title: 'Sample Title'
    });
  });

  it('should throw an error if request fails', async () => {
    // モックされたaxios.getのエラーを設定
    mockedAxios.get.mockRejectedValue(new Error('Network error'));

    const url = 'https://api.example.com/data/1';

    try {
      await fetchData(url);
    } catch (error) {
      // axios.getが期待通りに呼び出されたことを確認
      expect(mockedAxios.get).toHaveBeenCalledWith(url);
      // fetchData関数が期待通りのエラーをスローすることを確認
      expect(error).toEqual(new Error('Network error'));
    }
  });
});

vitest

// test/utils/fetchData.test.ts
import { fetchData } from '../../src/utils/fetchData';
import axios, { AxiosResponse } from 'axios';

// axiosの型定義からMockを作成
const mockedAxios = axios as jest.Mocked<typeof axios>;

// テスト対象のデータ型
interface Data {
  id: number;
  title: string;
}

describe('fetchData', () => {
  it('should fetch data successfully', async () => {
    // モックされたaxios.getのレスポンスを設定
    const mockResponse: AxiosResponse<Data> = {
      data: {
        id: 1,
        title: 'Sample Title'
      },
      status: 200,
      statusText: 'OK',
      headers: {},
      config: {}
    };
    mockedAxios.get.mockResolvedValue(mockResponse);

    const url = 'https://api.example.com/data/1';
    const data = await fetchData(url);

    // axios.getが期待通りに呼び出されたことを確認
    expect(mockedAxios.get).toHaveBeenCalledWith(url);
    // fetchData関数が期待通りのデータを返すことを確認
    expect(data).toEqual({
      id: 1,
      title: 'Sample Title'
    });
  });

  it('should throw an error if request fails', async () => {
    // モックされたaxios.getのエラーを設定
    mockedAxios.get.mockRejectedValue(new Error('Network error'));

    const url = 'https://api.example.com/data/1';

    try {
      await fetchData(url);
    } catch (error) {
      // axios.getが期待通りに呼び出されたことを確認
      expect(mockedAxios.get).toHaveBeenCalledWith(url);
      // fetchData関数が期待通りのエラーをスローすることを確認
      expect(error).toEqual(new Error('Network error'));
    }
  });
});