模拟 componentDidMount 生命周期方法进行测试

我有一个使用的组件axios within componentDidMount从服务器检索数据。当使用 Jest / Enzyme 对组件进行单元测试时，测试因网络错误而失败。

我该如何嘲笑componentDidMount所以这样axios调用服务器不会发生？

有问题的组件使用反应DnD http://react-dnd.github.io/react-dnd/docs-overview.html并且是一个DragDropContext.

class Board extends Component {
    componentDidMount() {
        this.load_data();
    }

    load_data = () => {
        // axios server calls here
    }
}
export default DragDropContext(HTML5Backend)(Board);

测试示例：

it('should do something', () => {
    const board = shallow(<Board />);
    // get the boardInstance because board is wrapped in Reactdnd DragDropContext
    const boardInstance = board.dive().instance();
    boardInstance.callSomeMethodToTestIt();
    expect(testSomething);
}

所以我只需要嘲笑componentDidMount or load_data这样它就不会尝试调用服务器。如果load_data方法作为道具传入，我可以简单地将该道具设置为jest.fn()。然而，这是我的顶级组件，它没有收到任何道具。

随着酶的新更新，生命周期方法默认启用。 （https://airbnb.io/enzyme/docs/guides/migration-from-2-to-3.html#lifecycle-methods https://airbnb.io/enzyme/docs/guides/migration-from-2-to-3.html#lifecycle-methods)

但是，您可以通过浅层渲染禁用它们，如下所示：

const board = shallow(<Board />, { disableLifecycleMethods: true });

docs: https://airbnb.io/enzyme/docs/api/shallow.html#shallownode-options--shallowwrapper https://airbnb.io/enzyme/docs/api/shallow.html#shallownode-options--shallowwrapper