React Jest 中未定义 FormData

Question

我正在为 React 项目编写单元测试代码。我正在尝试测试一个功能

//function aa
export const login = (values) => async => (dispatch) => {
  let bodyFormData = new FormData();

  bodyFormData.append('username', values.login);
  bodyFormData.append('password', values.password);
  return await axios({
   method: 'post',
   url: url,
   data: bodyFormData
  }
}

//aa test
it("Login Action", async () => {
  afterEach(() => {
    store.clearActions();
  });
  const values = {
    login: "aaaaa",
    password: "bbbbb"
  };
  const expectedResult = { type: "LOGIN_PASS" };

  const result = await store.dispatch(login(values));
  expect(result).toEqual(expectedResult);
});

在浏览器中，这工作正常。但是在测试时我得到以下错误

参考错误：未定义 FormData

我尝试使用此模块但没有运气... https://www.npmjs.com/package/form-data

我不想只测试 axios，我需要测试完整的功能。

Answer 1

您需要FormData在单元测试中进行模拟，因为FormDataweb API 在 node.js/jsdom 环境中不可用。

function FormDataMock() {
  this.append = jest.fn();
}

global.FormData = FormDataMock

如果您想模拟FormData全局中的其他方法：

const entries = jest.fn()
global.FormData = () => ({ entries })