Почему реагирующий хук генерирует ошибку действия при использовании с fetch api? - PullRequest
Новая
       29

Почему реагирующий хук генерирует ошибку действия при использовании с fetch api?

0 голосов
/ 18 февраля 2019

Я получаю Warning: An update to App inside a test was not wrapped in act(...). в своем наборе тестов всякий раз, когда я делаю запрос API и обновляю состояние.

Я использую библиотеку реагирования-тестирования.Я также пытался использовать утилиты тестирования ReactDOM, получил тот же результат.Еще одна вещь, которую я пробовал, заключалась в том, что контейнер обернулся в act, но все равно получил тот же результат.

Обратите внимание: мое приложение работает и мои тесты успешно пройдены.Мне просто нужно знать, что я делаю неправильно, или это ошибка в пакете реагировать на эту ошибку.И плохо высмеивать консольную ошибку и отключать ее. 

global.fetch = require('jest-fetch-mock');

it('should clear select content item', async () => {
    fetch.mockResponseOnce(JSON.stringify({ results: data }));

    const { container } = render(<App />);

    const content = container.querySelector('.content');

    await wait();

    expect(content.querySelectorAll('.content--item').length).toBe(2);
});

Вот реализация хука: 

const [data, setData] = useState([]);
const [error, setError] = useState('');

const fetchInitData = async () => {
    try {
        const res = await fetch(API_URL);
        const data = await res.json();

        if (data.fault) {
            setError('Rate limit Exceeded');
        } else {
            setData(data.results);
        }
    } catch(e) {
        setError(e.message);
    }
};

useEffect(() => {
    fetchInitData();
}, [isEqual(data)]);

Ответы [ 2 ]

0 голосов
/ 04 марта 2019

Чтобы избавиться от предупреждения act(), необходимо убедиться, что ваши обещания выполняются синхронно.Вы можете прочитать здесь как это сделать.

Резюме:

Решение для этого немного сложное:

  • мы глобально заполняем Promise с помощью реализации, которая может разрешать обещания «немедленно», например обещание
  • переносит ваш javascript с помощью пользовательской настройки babel, такой как в этом репозитории
  • use jest.runAllTimers ();теперь это также сбрасывает очередь задач на обещание
0 голосов
/ 18 февраля 2019

Это известная проблема, проверьте эту проблему в Github https://github.com/kentcdodds/react-testing-library/issues/281

...