💉
2020-12-23

JestでAxiosをMockしテストする

Jest

Jestでテストを書く際に,AxiosをMockする必要があります.Axiosの一部をmockする方法,全体をmockする方法の2つを紹介します.

テストケース内で制御する方法

MockするAPIが少ない場合には,こちらの手法が有効です.シンプルに実装することができ,見通しが良いです.

import axios from 'axios'
jest.mock('axios')
axios.get.mockImplementation((api) => {
  switch (api) {
    case '/api/test':
      return Promise.resolve( { status: 200 } )
  }
})

Manual Mocks で制御する方法

マニュアルモックはモックデータを返す機能をスタブするために使用します。 例えば、ウェブサイトやデータベースのような外部リソースにアクセスする代わりに、偽のデータが使えるマニュアルモックが欲しいと考えるでしょう。 これによりテストは高速で信頼性の高いものになります。

Manual Mocksについて Jest公式ドキュメント より引用
共通のapiを複数箇所で呼び出す場合は,こちらの手法が有効です.
全てのテストケースにおいてAxiosをMockし,ディレクトリ構造でAPIを表現することができます.
GET api/test をMockしたい場合は,__mockData__/api/test.json にファイルを配置します.
./mocks/axios.js

const fs = require('fs')

const mock = jest.fn((url) => {
  return new Promise((resolve, reject) => {
    fs.readFile(`./__mockData__/${url}.json`, 'utf8', (err, data) => {
      if (err) reject(err)
      resolve(JSON.parse(data))
    })
  })
})


module.exports = {
  get: mock,
}

mockData/api/test.json

{
  "status": 200
}