Есть ли способ ждать события, которое вызывает асинхронную функцию в Jest / Enzyme?

Question

У меня есть мастер, содержащий шаги, каждый шаг имеет свою собственную проверку (синхронизация / асинхронность).

например:

<Wizard>
   <Form1 />
   <Form2 />
   <Form3 />
</ Wizard>

Каждая форма содержит onContinue метод, который проверяет входные данные формы.

onContinue = async () => {
    let step = this.steps[this.state.step];
    let validation = await step.validate();
    // check for error and change step number.
    this.changeStep(this.state.step + 1, validation);
};

Теперь я пытаюсь проверить поведение мастера, убедившись, что при нажатии на Продолжить номер шага увеличен на 1.

it('should set the state property "step" to 1 after successfully clicking the continue button', () => {
      const props = {
        id: 'testId',
        children: noErrorChildren
      };
      const wizard= mount(<Wizard {...props} />);
      tree.find('onContinue-button').simulate('click');
      expect(wizard.state().step).toEqual(1);
});

После запуска теста появляется эта ошибка:

Error: expect(received).toEqual(expected)

Expected value to equal:
  1
Received:
  0
Expected :1
Actual   :0

переменная step не увеличена до 1, как ожидалось.

Спасибо.

Answer 1

Причина, по которой переменная step не увеличивается должным образом, заключается в том, что onContinue является функцией async, и ваш тестовый файл не пытался ждать ответа.Поскольку он асинхронный, и вы рассматривали его как обычную функцию, код продолжал выполняться, не дожидаясь результата.

Попробуйте сделать это и посмотрите, поможет ли это,

В вашем itВ блоке вы можете указать анонимную функцию как асинхронную, например:

it('should do some stuff...', async () => {

, а затем перед методом tree.find добавить ключевое слово await

await tree.find('onContinue-button').simulate('click');