Jest:如何模拟从 index.js 文件导出的自定义模块?

Ant*_*kis 5 javascript unit-testing reactjs jestjs react-testing-library

这是我的项目(create-react-app)的结构:

在此处输入图片说明

/src/api/searchAPI.js 的内容:

import client from './client';

async function searchMulti(query, options = {}) {
  options.query = query;
  return await client.get('/search/multi', options);
}

export default {
  searchMulti
};
Run Code Online (Sandbox Code Playgroud)

/src/api/index.js 的内容:

import movieAPI from './movieAPI';
import personAPI from './personAPI';
import searchAPI from './searchAPI';
import configurationAPI from './configurationAPI';

export { movieAPI, personAPI, searchAPI, configurationAPI };
Run Code Online (Sandbox Code Playgroud)

QuickSearch 组件导入searchAPI 并使用它通过网络获取一些数据。

现在,我需要测试(使用react-testing-library)QuickSearch 组件。

因此,我想模拟api模块(在 /src/api/index.js 中导出)以使用模拟函数而不是searchAPI.searchMulti()

如果我将下面的代码放在 /src/componentns/__tests__/QuickSearch.js 中,它就可以正常工作:

...
import { searchAPI } from '../../
...
...
jest.mock('../../api', () => {
  return {
    searchAPI: {
      searchMulti: jest.fn().mockResolvedValue({ results: [] })
    }
  };
});

...

it('some test', () => {
  searchAPI.searchMulti.mockResolvedValueOnce({ results: [] });

  const { queryByTitle, getByPlaceholderText } = renderWithRouter(
    <QuickSearch />
  );

  const input = getByPlaceholderText(/Search for a movie or person/i);

  expect(searchAPI.searchMulti).not.toHaveBeenCalled();

  act(() => {
    fireEvent.change(input, { target: { value: 'Aladdin' } });
  });

  expect(searchAPI.searchMulti).toHaveBeenCalledTimes(1);
});
Run Code Online (Sandbox Code Playgroud)

我的问题是我不想在每个需要它的测试文件中模拟api。相反,我想将api放在 __mocks__ 文件夹中,以便其他测试也可以使用它。

我怎样才能做到这一点?