Jest: 비동기 코드 테스트하기

비동기 코드를 테스트를 할 경우 로직이 완료되기 전에 테스트가 시행되기 때문에 정확한 테스트 결과값을 얻을 수 없다. 이에 Jest에서도 비동기 코드를 테스트 할 수 있는 몇 가지 방법을 제공한다. 

 

콜백함수 방식

Jest에서 done이라는 argument를 사용하게 되면 콜백 함수가 완료될 때까지 기다린 후에 테스트를 진행한다.

// fn.js
// 3초 뒤에 콜백함수를 호출하는 로직
const fn = {
    getName: callback => {
        const name = "codingji";
        setTimeout(() => {
            callback(name);
        }, 3000); 
    }
}

module.exports = fn;

//fn.test.js
const fn = require("../fn");

describe("콜백 함수 예제확인", () => {
  test("3초 뒤에 받은 이름이 codingji 맞다.", (done) => {
    function callback(name) {
      try {
        expect(name).toBe("codingji"); // 이름이 "codingji"인지 확인
        done(); // 테스트 완료
      } catch (error) {
        done(error); // 에러 발생 시 done()에 에러 전달
      }
    }
    fn.getName(callback); // getName 호출, 콜백 전달
  });
});

 

아래 예제를 확인하면 3초가 지난 다음에 테스트가 진행된 것을 볼 수 있다.

 

Promise 방식

Promise는 기존의 콜백함수에 추가적으로 resolves와 rejects를 활용하여 더 간단하고 쉽게 테스트를 시행할 수 있다. 주의할 점은 반드시 return문을 사용해야 한다. 

// fn.js
const fn = {
    getName: (isFail) => {
        const name = "codingji";
        
        return new Promise((resolve, reject) => {
            setTimeout(() => {
                if (isFail) {
                    reject("error"); //isFail이 true일 경우 reject 전달
                } else {
                    resolve(name); //isFail이 false일 경우 resolve 전달
                }
            }, 3000);
        });
    }
}

module.exports = fn;

// fn.test.js
const fn = require("../fn");

describe("Promise 예제 확인", () => {
  // test("3초 뒤에 받는 이름이 codingji다.", () => {
  //   return fn.getName(false).then((name) => {
  //     expect(name).toBe("codingji");
  //   })}); ==> 해당 코드를 아래의 resolves로 줄여 사용 가능하다. 
  
  test("3초 뒤에 받는 이름이 codingji다.", () => {
  //return문 반드시 사용
    return expect(fn.getName(false)).resolves.toBe("codingji"); // 성공 테스트
  });

  test("3초 뒤에 'error'를 받아온다.", () => {
    return expect(fn.getName(true)).rejects.toBe("error"); // 실패 테스트
  });
});

 

Async / await 방식

async / await 방식은 테스트 함수 맨 앞에 async를 작성하고, Promise를 리턴하는 함수 앞에 await를 붙여주면 된다. 이 방식의 경우 복잡한 로직 (여러 개의 비동기 호출이 있을 때 등)에서 사용하면 보다 더 가독성이 좋은 테스트 코드를 작성할 수 있다. 

// fn.test.js
const fn = require("../fn");

describe("Promise 예제 확인", () => {
  test("3초 뒤에 받는 이름이 codingji다.", async () => {
    // 비동기 함수를 동기화 해서 받음
    expect(await fn.getName(false)).toBe("codingji");
  });

  test("3초 뒤에 'error'를 받는다.", async () => {
    try {
      await fn.getName(true); // 에러를 발생시키고
    } catch (error) {
      expect(error).toBe("error"); // 해당 하는 에러메시지를 테스트한다.
    }
  });
});