Handle Asynchronous Code In Jest

이정훈·2024년 7월 13일

Jest

목록 보기
4/6

자바스크립트에서는 비동기 함수를 다룰 일이 많습니다.
이들을 테스팅 하는 방법에 대해 알아보겠습니다.

Promises

test에서 promise를 반환하면 Jest는 promise가 resolve될 때까지 기다립니다.
fetchData라는 promise를 반환하는 비동기 함수가 있다고 가정해봅시다.
해당 함수는 'peanut butter'를 반환합니다.
이를 테스트 해봅시다.

test('the data is peanut butter', () => {
  return fetchData().then(data => {
    expect(data).toBe('peanut butter');
  });
});

Async/Await

테스트에 Async와 await를 사용할 수 있습니다.

test('the data is peanut butter', async () => {
  const data = await fetchData();
  expect(data).toBe('peanut butter');
});

test('the fetch fails with an error', async () => {
  expect.assertions(1);
  try {
    await fetchData();
  } catch (error) {
    expect(error).toMatch('error');
  }
});

또한 resolves와 rejects함수로 테스트 할 수 있습니다.
resolves함수는 비동기 함수가 resolve되었을 때 테스팅되며
rejects함수는 비동기 함수가 reject되었을 때 테스팅됩니다.

test('the data is peanut butter', async () => {
  await expect(fetchData()).resolves.toBe('peanut butter');
});

test('the fetch fails with an error', async () => {
  await expect(fetchData()).rejects.toMatch('error');
});

catch-->이건 resolves랑 뭐가 다른지 나중에 확인해 보자.

test('the fetch fails with an error', () => {
  expect.assertions(1);
  return fetchData().catch(error => expect(error).toMatch('error'));
});

Callbacks

promise를 이용하지 않고 Callback함수를 이용한다면 jest에서 제공하는 done 인자를 이용해야 합니다.
Jest에서는 콜백함수가 done()을 호출하기 전까지 기다려줍니다.

test('the data is peanut butter', done => {
  function callback(error, data) {
    if (error) {
      done(error);
      return;
    }
    try {
      expect(data).toBe('peanut butter');
      done();
    } catch (error) {
      done(error);
    }
  }

  fetchData(callback);
});
profile
기록으로 흔적을 남깁니다.

0개의 댓글