Как проверить потом часть после обещания в шутку

Question

Я работаю над проектом React и использую jest для написания тестов для своего кода.

Это код, который я хочу проверить.

const handleSubmit = (handleSuccess, handleErrors) => {
  signupAPI(user)
    .then(handleSuccess)
    .catch(handleErrors);
};

Вот код теста:

test('should call handleSuccess', () => {
  signupAPI.mockImplementation((user) => Promise.resolve(user));
  const handleSuccess = jest.fn();
  const handleErrors = jest.fn();

  handleSubmit(handleSuccess, handleErrors); 

  expect(signupAPI).toHaveBeenCalled(); // test passes

  expect(handleSuccess).toHaveBeenCalled(); // test fails
});

Когда я запускаю тест, он никогда не перемещается в часть «тогда» после обещания.Как проверить, что функция внутри части then действительно вызывается?

Answer 1

Если вы используете возврат в handleSubmit, это будет работать.Попробуйте это:

const handleSubmit = (handleSuccess, handleErrors) => {
  return signupAPI(user)
    .then(handleSuccess)
    .catch(handleErrors);
};

И для теста:

test('should call handleSuccess', () => {
  signupAPI.mockImplementation((user) => Promise.resolve(user));
  const handleSuccess = jest.fn();
  const handleErrors = jest.fn();

  handleSubmit(handleSuccess, handleErrors).then(() => {
    expect(signupAPI).toHaveBeenCalled(); // test passes

    expect(handleSuccess).toHaveBeenCalled(); // test fails
  });
});

Это должно работать просто отлично!если это не работает, вы можете попытаться добавить возврат к handleSubmit в вашем тесте, например

return handleSubmit(handleSuccess, handleErrors).then(() => {
  ...
}); 

Answer 2

Проблема в том, что вы не ждете обещания, которое вы создали в тесте:

test('should call handleSuccess', async() => {
  const p = Promise.resolve()
  signupAPI.mockImplementation((user) => p.then(user));
  const handleSuccess = jest.fn();
  const handleErrors = jest.fn();

  handleSubmit(handleSuccess, handleErrors); 
  await p
  expect(signupAPI).toHaveBeenCalled(); // test passes

  expect(handleSuccess).toHaveBeenCalled(); // test fails
});

Answer 3

Проблема с handleSubmit заключается в том, что он обрабатывает обещания как прославленные обратные вызовы.Нет необходимости передавать обратные вызовы then и catch.Он не возвращает обещание, поэтому не может быть прикован цепью.

Вот как это можно исправить:

const handleSubmit = (handleSuccess, handleErrors) => {
  return signupAPI(user)
    .then(handleSuccess)
    .catch(handleErrors);
};

и

test('should call handleSuccess', async () => {
  ...
  handleSubmit(handleSuccess, handleErrors); 

  await handleSubmit(handleSuccess, handleErrors); 
  expect(signupAPI).toHaveBeenCalled();
  expect(handleSuccess).toHaveBeenCalled();
});

И вот как это можно правильно написать:

const handleSubmit = () => signupAPI(user)