Axios 中的單元測試攔截器邏輯

Question

我在 Axios 中設置了一個攔截器，它會刷新令牌，然后在初始 HTTP 響應是 401 時重試調用。

我試圖通過模擬 Axios 請求返回 401 和有效響應（參見下面的簡化版本）並斷言它被調用兩次來對這個邏輯進行單元測試。

我的問題是，因為我在嘲笑請求，攔截器似乎沒有運行。 我沒有重試請求， stubAuthError返回了stubAuthError 。

有什么方法可以實現我所追求的目標，還是有更好的方法來測試它？

索引.js

const axios = require('axios');

axios.interceptors.response.use(
  response => response,
  error => {
    const status = error.response ? error.response.status : null;

    if (status === 401) {
      return makeRequest();
    } else {
      return Promise.reject(error);
    }
  }
);

async function makeRequest() {
  return axios.request('url');
}

module.exports = {
  makeRequest
};

index.spec.js

const axios = require('axios');

const { makeRequest } = require('./index');

const stubAuthError = { response: { status: 401 } };
const stubResponse = { data: { foo: 'bar' } };

it('should make the request twice', async () => {
  expect.assertions(1);

  axios.request = jest.fn();
  axios.request
    .mockRejectedValueOnce(stubAuthError)
    .mockResolvedValueOnce(stubResponse);

  try {
    await makeRequest();
  } catch (error) {}

  expect(axios.request).toHaveBeenCalledTimes(2);
});

Answer 1

攔截器是按順序注冊的，類似於express中間件，

您可以訪問axios.interceptors.request和axios.interceptors.response到攔截器管理器上注冊的單元測試函數

例如：

在我的main.js ：

let axios = require('axios');

axios.interceptors.response.use(
  response => response,
  error => {
    const status = error.response ? error.response.status : null;

    if (status === 401) {
      return makeRequest();
    } else {
      return Promise.reject(error);
    }
  }
);

async function makeRequest() {
  return axios.request('https://randomuser.me/api/');
}

module.exports = {
  makeRequest
};

在我的main.test.js ：

let axios = require('axios');

// 
// based on your question, we don't want to test "makeRequest"
// so, I'm loading the file only to register the interceptors
//
require('./main');

let stubAuthError = { response: { status: 401 } };
let stubExceptionError = { response: { status: 500 } };
let stubResponse = { data: { foo: 'bar' } };

test("interceptor fulfilled", () => {
  let res = axios.interceptors.response.handlers[0].fulfilled(stubResponse);
  expect(res).toEqual(stubResponse);
});

test("interceptor rejected => makeRequest", () => {
  let originalAxiosRequest = axios.request;

  // this fn will be called by "makeRequest"
  axios.request = jest.fn();

  axios.interceptors.response.handlers[0].rejected(stubAuthError);

  expect(axios.request).toHaveBeenCalledTimes(1);

  axios.request = originalAxiosRequest;
});

test("interceptor rejected => exception", async () => {
  await expect(axios.interceptors.response.handlers[0].rejected(stubExceptionError)).rejects.toEqual(stubExceptionError)
});