Jest: How to mock custom module that is exported from an index.js file?

Viewed 3434

This is the structure of my project (create-react-app):

enter image description here

Contents of /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
};

Contents of /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 };

QuickSearch component imports searchAPI ands uses it to fetch some data over the web.

Now, I need to test (with react-testing-library) the QuickSearch component.

So, I would like to mock the api module (exported in /src/api/index.js) in order to use a mock function instead of searchAPI.searchMulti( ).

If I put below code in /src/componentns/__tests__/QuickSearch.js, it works just fine:

...
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);
});

My problem is that I don't want to mock api in every test file that needs it. Instead, I would like to put api in a __mocks__ folder so that other tests can use it you, too.

How can I do that?

0 Answers
Related