Question

我试图在我的componentDidMount()方法以及仅该方法上使用React中的Jest运行单元测试。我的componentDidMount()如下：

componentDidMount() {
    //Delay to simulate welcome loading screen
    const delay = 2000;
    setTimeout(() => {
      this.setState({ appLoaded: true }); //this line has no coverage, according to IDE
    }, delay);
  }

我尝试遵循this，但遇到了很多错误。最大的区别之一是给定的样本具有componentDidMount()方法，与我的方法完全不同。我的componentDidMount()中具有本地功能，而他们没有。我该如何对它进行单元测试？

尤其是，我想测试显示this.setState({ appLoaded: true });的行，因为据说这行未被覆盖。

Answer 1

使用setTimeout时，请使用假计时器：runTimersToTime或advanceTimersByTime（如果使用的是jest v ^ 22.0.0）。即：

import { shallow } from 'enzyme';

jest.useFakeTimers();

it('tracks app loaded', () => {
  const wrapper = shallow(<YourAwesomeComponent />);
  expect(wrapper.state('appLoaded')).toBeFalsy();
  jest.runTimersToTime(2000);
  expect(wrapper.state('appLoaded')).toBeTruthy();
});

我如何在React的componentDidMount（）中对方法的主体进行单元测试？

1 个答案: