#reactjs #jestjs #enzyme
Вопрос:
У меня есть следующий компонент в react. И я использую jest 24.0.0 и Enzyme 3.3 для написания тестовых примеров. В следующем компоненте я хочу обработать три тестовых случая.
- Загрузочный текст появится без добавления,редактирования и добавления компонентов.
- Как только будет вызван useeffect и заданы данные, он отобразит кнопку добавления и редактирования и функцию макета на onClick.
- Компонент будет там, используя упомянутое имя класса
Main Component import Component from './Component' const [posts, setPosts] = useState([]) useEffect(() =gt; { fetch("https://jsonplaceholder.typicode.com/posts") .then((response) =gt; response.json()) .then((data) =gt; { setPosts(data) }) }, []) return ( lt;divgt; lt;h1gt;Cool applt;/h1gt; {!posts amp;amp; lt;divgt;Loading...lt;/divgt;} {posts amp;amp; posts.length amp;amp; ( lt;divgt; lt;button className="btnAdd" onClick={OnAddHandler}gt;Addlt;/buttongt; lt;button className="btnEdit" onClick={onEditHanlder}gt;Editlt;/buttongt; lt;/divgt; ) lt;Component className="postComponent" posts = {posts} /gt; lt;/divgt; )
Я попробовал какой-то способ, и он выглядит следующим образом
it("Add,Edit Button is not visible on loading",()=gt;{ const wrapper = mount(lt;MainComponent/gt;) expect(wrapper.exists("btnAdd")).toBe(false) })
Но я не мог понять, как справиться с другим сценарием, как указано выше. Как мы можем проверить, вызывается ли эффект использования, получить данные ответа и сохранить их в состоянии.
может ли кто-нибудь взглянуть и просто опубликовать пример фрагмента, который был бы признателен.
Спасибо.