mockを使ったNode.js(Express)のAPIテスト

## はじめに
Jest・SupertestでAPIテストを作成した際に躓いたので、その実装の備忘録を残しておく。
この記事では時に、より実践的なテストにするためにはmockを用いるべきであるがどのようにmock化してWeb APIがcallされないようにするか？という部分について書き残す。
※mockを用いず、ただ単にnode.js(Express)のAPIテスト(End Pointテスト)を実行できるようするための方法は、[Jest・Supertestを使用したnode.js(Express)のAPIテスト　app.listen()はエラーになる](https://qiita.com/yuta-katayama-23/items/29b91fed629fe758a42d)を参照。

以下で実装したテストの実行結果（GitHub Actionsの結果）は以下。

https://github.com/yuta-katayama-23/travel-app/runs/2757301572

## なぜmock化する必要があるか？
Node.js(Express)でServer Sideを構築する場合、外部のWeb APIを実行しデータを取得することも多くある。その際に、UnitTestやAPIテストで実際に通信を行ってしまうと、テストとして動作が不安定になるなどの問題が発生してしまうため。
詳細は[こちら](https://qiita.com/yuta-katayama-23/items/29b91fed629fe758a42d#%E3%81%9F%E3%81%A0%E3%81%93%E3%81%AE%E3%81%BE%E3%81%BE%E3%81%A7%E3%81%AF%E3%83%86%E3%82%B9%E3%83%88%E3%81%97%E3%81%A6%E3%82%88%E3%81%8F%E3%81%AA%E3%81%84)を参照。

## 外部のWeb APIの実行をmock化してAPIテストする
ここで言うAPIテストは**End Pointテスト**で、実際に期待されるEnd Pointがありそこから結果が返ってくるか？をテストする。
（実際には[以下で取り上げるテスト内容](#apiのエンドポイントがcallされた時に実行される処理をテスト)もテストしているとも言えるが・・・。）
この場合、Node.jsのmoduleをmock化し**外部のWeb APIを実行させないようにする**＋`supertest`を用いてテストを実装できる。

### 正常系のテスト
テスト対象のコードは以下。

```app.js
const express = require('express');
const app = express();

/* Middleware */
app.use(express.urlencoded({
    extended: false
}));
app.use(express.json());

// Cors for cross origin allowance
const cors = require('cors');
app.use(cors());

// Initialize the main project folder
app.use(express.static('dist'))

// dotenv
const dotenv = require('dotenv')
dotenv.config();

const axios = require('axios').default;

// config for get countries and cities
const axiosConfig = {
    baseURL: 'https://api.countrystatecity.in/v1/',
    timeout: 2500,
    headers: { 'X-CSCAPI-KEY': `${process.env.COUNTRYSTATECITY_API_KRY}` }
}

app.get('/allCountries', async (req, res) => {
    try {
        const countries = await axios.get('countries', axiosConfig)
        res.status(200).send({ countries: countries.data })
    } catch (error) {
        errorHandler(res, error)
    }
})

const errorHandler = (res, error) => {
    if (error.response) {
        res.status(500).send(error.response.data)
    } else {
        res.status(500).send({ error: error.message })
    }
}

module.exports = app;
```

テストコードは以下。

```js:test.js
const request = require('supertest')
const app = require('../../../src/server/app')

const axios = require('axios')
jest.mock('axios') // ここでNode.jsのmodule（今回はaxios）をmock化している

describe('axiosをmock化＆supertestでrequestを飛ばしてテスト', () => {

    it('/allCountries', async () => {
        const resp = { data: [{ name: 'test' }] };
        axios.get.mockResolvedValue(resp); // mock化したmoduleの実行結果を定義している https://jestjs.io/docs/mock-function-api#mockfnmockresolvedvaluevalue

        const res = await request(app).get('/allCountries')
        expect(res.status).toEqual(200)
        expect(res.body.countries[0].name).toEqual('test')
    })
})
```

※テストコードの解説・注意事項
　・jest.mock(*module*)はrequire/importのスコープに記載する
　　jest公式にも以下のように書いてある通り、jest.mock(*module*)はrequire/importのスコープに記載しないとダメ。

> Note: In order to mock properly, Jest needs jest.mock('moduleName') to be in the same scope as the require/import statement.
注: 適切にモックするために、Jest は jest.mock('moduleName') が require/import ステートメントと同じスコープにある必要があります。

```js:route-mock.test.js
// 省略

const axios = require('axios')

describe('axiosをmock化＆supertestでrequestを飛ばしてテスト Get Endpoints (mocking)', () => {

    it('/allCountries', async () => {
        jest.mock('axios') // ←このような実装はエラーになる

        // 省略
    })
})
```

### 異常系のテスト
テスト対象のコードは[上記](#正常系のテスト)と同じ。
テストコードは以下。

```js:test.js
const request = require('supertest')
const app = require('../../../src/server/app')

const axios = require('axios')
jest.mock('axios')

describe('axiosをmock化＆supertestでrequestを飛ばしてテスト', () => {
    it('Abnormal pattern test of API /allCountries', async () => {
        const resp = new Error('error test');
        axios.get.mockRejectedValueOnce(resp);

        const res = await request(app).get('/allCountries')
        expect(res.status).toEqual(500)
        expect(res.body.errorMsg).toEqual('error test')
    })
})
```

## APIのエンドポイントがcallされた時に実行される処理をテスト
ここで言うAPIテストは**APIのcall時に実行される処理のテスト**の事。
End Pintが存在するか？よりはそのEnd Pointをcallした時に実行される処理が期待される挙動であるか？を検証する。
この場合、単純にエイリアス（関数）を呼び出してテストしてあげればよいが、そのテストを実行できるようにNode.js(Express)のソースコードの構成もテストできる形にする必要がある。

### プロジェクトの構成のリファクタリング
まず、Node.js(Express)の構成だがMVCモデルに則り以下のようにする。

```
src
・・・
└── server
    ├── app.js
    ├── controllers
    │   └── controller.js
    ├── routes
    │   └── router.js
    └── server
        └── server.js
```

すると、単純にエイリアス（関数）であるコードを書く事ができるので、テストを実行する際にはこの関数を呼び出すだけでいい。

```js:controller.js
const axios = require('axios').default;

// dotenv
const dotenv = require('dotenv')
dotenv.config();

// config for get countries and cities
const axiosConfig = {
    baseURL: 'https://api.countrystatecity.in/v1/',
    timeout: 2500,
    headers: { 'X-CSCAPI-KEY': `${process.env.COUNTRYSTATECITY_API_KRY}` }
}

const allCountries = async (req, res) => {
    try {
        const countries = await axios.get('countries', axiosConfig)
        res.status(200).send({ countries: countries.data })
    } catch (error) {
        errorHandler(res, error)
    }
}

const errorHandler = (res, error) => {
    if (error.response) {
        res.status(error.response.status).send({
            error: error.response.data,
            errorMsg: error.message
        })
    } else {
        res.status(500).send({ errorMsg: error.message })
    }
}

module.exports = {
    allCountries,
};
```

実際のテスト対象のソースコード全体は以下を参照。

https://github.com/yuta-katayama-23/travel-app

### テストコードの実装
[上記](#プロジェクトの構成のリファクタリング)で関数化できたのでテストコードは以下のようになる。
（テスト対象のコードは[上記](#プロジェクトの構成のリファクタリング)の`allCountries`関数。）

#### 正常系のテスト
```js:test.js
const { allCountries } = require('../../../src/server/controllers/controller')

const axios = require('axios')
jest.mock('axios')

describe('axiosはmock化＆関数のテストとしてテスト', () => {
    it('/allCountries', async () => {
        const resp = { data: [{ name: 'not use superttest' }] };
        axios.get.mockResolvedValue(resp);

        const req = {}
        const res = {
            status: jest.fn().mockReturnThis(),
            send: jest.fn().mockReturnThis()
        }

        await allCountries(req, res)
        expect(res.status.mock.calls[0][0]).toBe(200)
        expect(res.send.mock.calls[0][0].countries[0].name).toEqual('not use superttest')
    })
})
```

※テストコードの解説

- `jest.fn().mockReturnThis()`<br>`axiosのresponse`が`res.status().send()`というようなメソッドチェーンで使われるのでそれ自身(this)を返してあげる必要があるので`.mockReturnThis()`で`this`を返すようにしている[^.mockReturnThis()]
- `mock.calls[0][0]`<br>呼び出されたモックに対して`mock.calls[n][m]`で、n番目の引数に対してm回目の呼び出しで指定された引数を取り出すという意味で、今回は引数1つ＆呼び出した回数も1回なので、mock.calls[0][0]に結果が可能されている<br>上記のコードで言えば、`res.status(200).send({ countries: countries.data })`というテスト対象のコードが、mock化したそれぞれの関数（`status: jest.fn()…`と`send: jest.fn()…`）に対し、<br>・`.status(200)`で1回呼び出されその時の引数は200なので`res.status.mock.calls[0][0]`で200が取り出せる<br>・`.send({ countries: countries.data })`で1回呼び出されその時の引数は`{ countries: countries.data }`なので`res.send.mock.calls[0][0]`で`{ countries: [{ name: 'not use superttest' }] }`が取り出せる<br>という事。[^mock.calls]

[^.mockReturnThis()]: https://jestjs.io/ja/docs/mock-functions#%E3%83%A2%E3%83%83%E3%82%AF%E3%81%AE%E5%AE%9F%E8%A3%85
[^mock.calls]: https://jestjs.io/ja/docs/mock-functions#mock-%E3%83%97%E3%83%AD%E3%83%91%E3%83%86%E3%82%A3

#### 異常系のテスト
```js:test.js
const { allCountries } = require('../../../src/server/controllers/controller')

const axios = require('axios')
jest.mock('axios')

describe('axiosはmock化＆関数のテストとしてテスト', () => {
    it('Abnormal pattern test of API /allCountries', async () => {
        const resp = new Error('error test');
        axios.get.mockRejectedValue(resp);

        const req = {}
        const res = {
            status: jest.fn().mockReturnThis(),
            send: jest.fn().mockReturnThis()
        }

        await allCountries(req, res)
        expect(res.status.mock.calls[0][0]).toBe(500)
        expect(res.send.mock.calls[0][0].errorMsg).toEqual('error test')
    })
})
```

## 参考文献
- https://jestjs.io/docs/manual-mocks#mocking-node-modules
- https://jestjs.io/ja/docs/mock-functions#%E3%83%A2%E3%82%B8%E3%83%A5%E3%83%BC%E3%83%AB%E3%81%AE%E3%83%A2%E3%83%83%E3%82%AF
- https://www.agent-grow.com/self20percent/2019/03/25/only-express-and-jest-testing/
- https://tech.bitbank.cc/lets-test-by-jest/