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

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

Например:

<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, как ожидалось.

Спасибо.

что такое onContinue? это onClick = {onContinue}?

AlexZvl 31.03.2019 11:07

ты это проверял? stackoverflow.com/a/51045733/3305456

AlexZvl 31.03.2019 11:09

@AlexandrZavali Да, не сработало

H.Hinn 31.03.2019 11:10
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
4
4
2 833
1

Ответы 1

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

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

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

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

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

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

Я пытаюсь последовательно заставить это работать, но ожидание, кажется, работает только случайно, а не по замыслу. По-прежнему существует состояние гонки, потому что симуляция не возвращает обещание, которое нужно ждать.

HMR 23.04.2020 01:09

Другие вопросы по теме