Mock componentDidMount метод жизненного цикла для тестирования

Question

У меня есть компонент, который использует axios в componentDidMount для получения данных с сервера. При использовании Jest / Enzyme для модульного тестирования компонента тесты завершаются с ошибкой в ​​сети.

Как мне высмеивать componentDidMount, чтобы axios звонок на сервер не происходил?

Компонент, о котором идет речь, использует React DnD и является 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 или load_data, чтобы он не пытался вызвать сервер. Если бы метод load_data передавался как опора, я мог бы просто установить эту опору на jest.fn(). Однако это мой компонент высшего уровня, который не получает никаких реквизитов.

Answer 1

С новым обновлением для энзима, методы жизненного цикла включены по умолчанию. (https://airbnb.io/enzyme/docs/guides/migration-from-2-to-3.html#lifecycle-methods)

Однако вы можете отключить их при мелком рендеринге как таковом:

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

документы: https://airbnb.io/enzyme/docs/api/shallow.html#shallownode-options--shallowwrapper

Answer 2

Методы Lifecyle по умолчанию не работают с мелкими, вам нужно добавить флаг с мелкими

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

Перед этим вы можете создать шпиона на componentDidMount, чтобы проверить, был ли он вызван как

const spyCDM = jest.spyOn(Board.prototype, 'componentDidMount');

и для предотвращения попадания запроса axios на сервер, вы можете смоделировать вызов axios, используя moxios