Реактивная ферментная асинхронная функция жизненного цикла

Question

В моем компоненте есть асинхронная функция componentDidMount, которая выполняет вызов API и обновляет хранилище mobx. Компонент имеет аннотацию @observer.

Я издевался над API, но у меня возникли проблемы - я не могу понять, как ожидать этот метод жизненного цикла в моем тесте:

 it("Magick", async () => {
    const comp = await mount(<Comp/>); // -- no point of await here

    // await comp.instance().componentDidMount(); -- should work, even if function is called wtice
    // await new Promise((resolve) => setTimeout(resolve, 100)); // -- smelly and prone to crashing

    expect(Axios.post).toBeCalledTimes(1);
    expect(MobX.value).toBe(-1);

    comp.unmount();
});

Фрагмент компонента:

 componentDidMount = async () => {
    try {
        const result = await AxiosWrapper.GetValue();

        if (result) {
            const errors = Parser.getErrors(result);
            if (errors) {
                console.log(errors);
            } else {
                MobX.value = Parser.getValue(result)
            }
        }
    } catch (e) {
        console.log(e);
    }
};

Метод обертки Axios:

static async GetValue() {
    return await Axios.post(...);
}

Единственное решение, которое я нашел, это добавление тайм-аута, но это недопустимо. Любое другое решение, которое я нашел, не работает - есть идеи?

Answer 1

Благодаря @estus, указавшему мне правильное направление.

Я исправил это:

• сделано componentDidMount вызвать отдельную функцию other.
• шпион other, await spy.mock.results[0].value;

Если я попытался шпионить непосредственно за componentDidMount, я получил ошибку: TypeError: object[methodName].mockImplementation is not a function.

Это может быть из-за того, что у рассматриваемого компонента есть декораторы @observer и @withNamespaces.

Answer 2

Чтобы сделать компонент тестируемым, должно быть обещание цепочки. Проблема с этим компонентом состоит в том, что componentDidMount является методом экземпляра, его нельзя шпионить или высмеивать до создания экземпляра компонента. Вместо этого должно быть:

async componentDidMount() {
  ...
}

Тогда можно шпионить за прототипом класса:

const cdmSpy = jest.spyOn(Comp.prototype, 'componentDidMount');
const comp = mount(<Comp/>);
await cdmSpy.mock.results[0].value;
...

В качестве альтернативы, componentDidMount можно вызвать вручную и протестировать вместе с опцией Enzyme disableLifecycleMethods.