Аксиомы Mocking в React Hooks с использованием библиотеки Resact-Hooks-Testing - PullRequest
1 голос
/ 16 июня 2019

Попытка смоделировать GET-запрос к API, но всегда получить

Тайм-аут - асинхронный обратный вызов не был вызван в течение 10000 мс, указанных в jest.setTimeout.

, хотяЯ увеличил тайм-аут, он по-прежнему выдает ошибку.

Крюк

export default function apiCaller() {
  const [rawApiData, setRawApiData] = useState({});
  const [errorMsg, setErrorMsg] = useState('');

  const callApi = async (inputValue) => {
    try {
      const apiData= await axios.get(
        `https://cloud.iexapis.com/stable/stock/market/batch?types=chart&symbols=${inputValue}&range=3m&token=lalaccf0`
      );
      setRawApiData(apiData);
    } catch (err) {
      setErrorMsg(
        'Error occured!! ' +
          (Boolean(err.response) ? err.response.data : err.message)
      );
    }
  };

  return { rawApiData, callApi, errorMsg };
}

Axios mock

export default {
  get: jest.fn().mockResolvedValue({ data: {} }),
};

Тест

import { renderHook, act } from 'react-hooks-testing-library';
import apiCaller from '../components/stock-chart/stockApiCaller';
import axios from 'axios';
jest.mock('axios');

it('should set error properly when api call is unsuccessfull because of bad data', async () => {

      axios.get.mockResolvedValueOnce({ data: { test: '123' } });
      const { result, waitForNextUpdate } = renderHook(() => apiCaller());

      act(() => result.current.callApi('fb/tsla'));
      await waitForNextUpdate();

      expect(result.current.rawApiData.data.test)
        .toBe(123)
    }, 10000);

1 Ответ

1 голос
/ 16 июня 2019

Я наконец-то решил проблему. Существует новый способ записи act (), то есть async act (). Ниже приведена обновленная версия теста, которая отлично работает.

it('should set rawData properly when api call is successfull because of', async () => {
  axios.get.mockResolvedValueOnce({ data: { test: '123' } });
  const { result, waitForNextUpdate } = renderHook(() => apiCaller());
  await act(async () => {
    result.current.callApi('fb/tsla');
    await waitForNextUpdate();
  });
  expect(result.current.rawApiData.data.test).toBe('123');
});

Обновление реагирует на 16.9.0-alpha.0

https://github.com/facebook/react/releases/tag/v16.9.0-alpha.0

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...