#reactjs #testing #react-hooks #react-testing-library
#reactjs #тестирование #реагирующие перехваты #react-testing-library
Вопрос:
Я пытаюсь протестировать компонент, который использует пользовательский перехват. Этот перехват использует контекст с useContext
перехватом. Моя проблема в том, что контекст сохраняется между двумя последовательными тестами. Я пытался подделать контекст, но это не помогает.
Вы можете увидеть код в этом codesandbox:https://codesandbox.io/s/l0192w68z хотя я не смог запустить тесты там…
Я также загрузил его на github, где тесты фактически выполняются:https://github.com/uriklar/react-testing-library-with-use-context
Я был бы признателен за любые указания! Как я могу получать новый контекст при каждом запуске теста.
Спасибо!
Комментарии:
1. Не издевайтесь над контекстом, визуализируйте поставщика с помощью вашего компонента:
render(<StoreContext.Provider value={}><MenuItem /></StoreContext.Provider>)
2. Спасибо @Gpx, но мой компонент MenuItem использует пользовательский перехват с useContext и импортирует контекст через поставщика. Я пытался делать так, как вы сказали, но я продолжал получать тот же контекст, что и в Provider.js
3. Я создал ветку с вашим предложением, тест по-прежнему завершается с ошибкой таким же образом: github.com/uriklar/react-testing-library-with-use-context/tree /…
Ответ №1:
Проблема в том, что ваши <MenuItem />
компоненты используют одно и то же хранилище (по умолчанию) между тестами. На самом деле было несколько проблем, и я говорил о них в этом прямом эфире, и вот запрос на извлечение, показывающий, что вы можете сделать, чтобы улучшить ситуацию.
Я надеюсь, что это полезно!
Комментарии:
1. Я напишу это и здесь для всеобщего сведения. При использовании typescript передача хранилища по умолчанию обязательна, иначе мой контекст не будет набран правильно (плюс, typescript заставляет вас передавать значение по умолчанию для createContext) В видео вы показали много опций, которые могут помочь обойти это. Спасибо за ваше время