Протестируйте несколько выборок в componentDidMount с помощью Jest / Enzyme - PullRequest
0 голосов
/ 13 октября 2018

Я начинаю больше узнавать о тестировании React с использованием Jest / Enzyme и пытаюсь научиться тестировать API-вызовы, использующие fetch.

У меня есть вызов fetch в методе componentDidMount() иЯ могу проверить это правильно.В методе beforeEach() у меня есть метод window.fetch, который создает фиктивную выборку.Вот пример:

beforeEach(() => {
mockData = /* mock data */
// mock fetch call  
window.fetch = jest.fn().mockImplementation(() => Promise.resolve({
  json: () => Promise.resolve({
    data: mockData,
  })
}));
component = shallow(<Component />);
});

Однако у меня есть другой компонент, который имеет два вызова выборки в методе componentDidMount(), и мне интересно, как я могу смоделировать каждый вызов выборки по отдельности.Возможно ли сделать два window.fetch вызова или как-то передать URL для получения?

Я все еще новичок в этом, поэтому любая помощь будет оценена!

Спасибо!

1 Ответ

0 голосов
/ 13 октября 2018

Вы можете использовать библиотеку fetch-mock , чтобы смоделировать каждый запрос отдельно.Предположим, вы запрашиваете 2 URL-адреса и хотите вернуть mockData в запросе на первый URL-адрес и только 404 статуса во втором.Ваш пример кода, смоделированный с fetch-mock, может выглядеть так:

import fetchMock from "fetch-mock";

beforeEach(() => {
  mockData = { /* mock data */ };
  fetchMock.mock("/first/url", mockData);
  fetchMock.mock("/second/url", 404);
  component = shallow(<Component />);
});

/* You should also restore the original fetch in afterEach */
afterEach(() => {
  fetchMock.restore();
}
...