реагирует на использованиеЭффект не выполняется при модульном тестировании с ферментом - PullRequest
Новая
       6

реагирует на использованиеЭффект не выполняется при модульном тестировании с ферментом

0 голосов
/ 11 февраля 2020

У меня есть компонент, который использует useEffect, он делает вызов API для редукционного действия под названием props.getPostsInit();

Как бы я это протестировал, поскольку сейчас я получаю сообщение об ошибке, не вызывая функцию getPostsInit 

  ● <Dashboard/> › Should execute getPostsInit

    expect(jest.fn()).toHaveBeenCalled()

    Expected number of calls: >= 1
    Received number of calls:    0

Панель инструментов 

function Dashboard(props: dashboardProps) {
    // const [title, setTitle] = useState<string>("");
    // const [content, setContent] = useState<string>("");
    // const [value, setValue] = useState<number>(0);
    const didMountRef = useRef<Object>();
    useEffect(() => {
        if (!didMountRef.current) {
            props.getPostsInit();
            props.initCommentUpdates();
        } else {
            console.log("this is component didupdate");
        }
    }, []); // array prevents an infinite loop
   ......

Dashboard.test 

import React from "react";
import { DashboardComponent as Dashboard } from "./dashboard";
import { shallow, mount, render } from "enzyme";
import PostForm from "../../components/forms/createPost/createPost";
describe("<Dashboard/>", () => {
    let wrapper;
    let useEffect;
    const mockUseEffect = () => {
        useEffect.mockImplementationOnce((f) => f());
    };
    const props = {
        getPostsInit: jest.fn(),
        getPopPostsInit: jest.fn(),
        deletePostInit: jest.fn(),
        postCommentInit: jest.fn(),
        titleError: Boolean,
        bodyError: Boolean,
        posts: [],
        error: [],
        title: "Test",
        postContent: "Another test",
        addTitle: jest.fn(),
        addContent: jest.fn(),
        popPosts: [],
        createPostInit: jest.fn(),
        likePost: jest.fn(),
        dislikePost: jest.fn(),
        initCommentUpdates: jest.fn(),
    };
    beforeEach(() => {
        useEffect = jest.spyOn(React, "useEffect");
        mockUseEffect();
        wrapper = shallow(<Dashboard {...props} />);
    });

    it("Should render dashboard component", () => {
        expect(wrapper).toHaveLength(1);
    });

    it("Should execute getPostsInit", () => {
        expect(props.getPostsInit).toHaveBeenCalled();
    });

});

Ответы [ 2 ]

1 голос
/ 11 февраля 2020

Когда речь идет о функциональных компонентах, API поверхностного рендеринга фермента недостаточно надежен (по состоянию на февраль 2020 года) для обработки различных сценариев ios для функциональных компонентов.

Возможно, вам потребуется полностью отрендерить его вместо него используется mount () . 

wrapper = mount(<Dashboard {...props} />);
0 голосов
/ 11 февраля 2020

jest.spyOn(React, "useEffect"); ищет React.useEffect не useEffect

Мне нужно изменить 

useEffect(() => {
    if (!didMountRef.current) {
        props.getPostsInit();
        props.initCommentUpdates();
        console.log("test");
    } else {
        console.log("this is component didupdate");
    }
}, []); // array prevents an infinite loop

на 

React.useEffect(() => {
    if (!didMountRef.current) {
        props.getPostsInit();
        props.initCommentUpdates();
        console.log("test");
    } else {
        console.log("this is component didupdate");
    }
}, []); // array prevents an infinite loop

Теперь все работает нормально, я вижу console.log("test") в тесте

...