reactjs - componentDidMount中的jest enzyme 测试方法

Question

我正在尝试测试已在 componentDidMount 中调用的方法:

private timerToken;

public componentDidMount() {
    this.timerToken = setInterval(() => { this._getWebJobStatus(); }, 2000);
}

test("_getWebJobStatus() is called", () => {
        const spy = jest.spyOn(UploadStatus.prototype, "componentDidMount").mockReturnThis();
        const wrapper = mount(<testComponent />);
        const component = wrapper.instance() as testComponent;
        const _getWebJobStatusMock = jest.fn();
        component['timerToken'] = _getWebJobStatusMock;
        expect(spy).toHaveBeenCalledTimes(1);   // this works
        expect(_getWebJobStatusMock).toHaveBeenCalled();   //this is not working
    });

如何测试 _getWebJobStatus() 被调用？

谢谢!

Answer 1

Jest 对测试计时器功能有很好的支持。您可以通过以下方式测试您的代码:

jest.useFakeTimers();

describe("Component", () => {
    const getComponent = () => shallow(<Component />);

    it('should call setInterval on mounting', () => {
        const component = getComponent();

        expect(setInterval).toHaveBeenCalledWith(expect.any(Function), 1000);
    });
});

有关此内容的文档可以在这里找到:https://facebook.github.io/jest/docs/en/timer-mocks.html
附:尽可能避免使用 enzyme 提供的安装或渲染，浅层比其余两种更快，因此减少了运行测试套件所需的时间。