[javscript] 자바스크립트 테스트코드, Jest 란?

저번 시간에는 TDD가 무엇인지, 장점이 뭔지, 사람들이 왜 쓰는지에 대해서 알아봤다.

나는 주로 Node.js나 Nest.js를 사용해서 백앤드 개발을 하는데 둘 다 자바스크립트 기반의 프레임워크이다.

이번 시간에는 자바스크립트에서 사용할 수 있는 테스트 툴인 Jest에 대해서 공부해보려고 한다.

 

Jest 란?

제스트(Jest)는 페이스북에서 만든 자바스크립트 테스팅 라이브러리이다.

말 그래도 내가 작성한 코드가 제대로 동작하는지 테스트할 때 사용한다.

여러 가지 상황들을 설정하고, 그 상황에 맞는 결과가 나오는지 자동으로 테스트해준다.

 

Jest 설치 및 사용 방법

 

아래 명령어를 통해 jest와 babel-jest를 설치해준다. (babel은 JavaScript 엔진에서 실행할 수 있는 이전 버전과 호환되는 JavaScript 버전으로 변환하는 데 사용되는 자바스크립트 트랜스 컴파일러이다.)

 

npm install jest babel-jest @babel/core @babel/preset-env

 

설치가 완료되면 package.json에 들어가서 scripts부분에 아래와 같이 작성해준다.

test 실행 시 jest가 실행되도록 하는 코드이다. jest가 실행되면 test.js 또는 spec.js 확장자를 갖는 파일들을 모두 실행해준다. (아래에서 살펴보자)

"scripts": {
    "test": "jest",
  },

 

Jest로 단위 테스트 코드를 구현할 때 자주 사용되는 API는 아래와 같다.

• describe()
  • 여러 개의 test() 코드를 하나의 테스트 작업 단위로 묶어주는 API. 하나의 테스트 케이스를 test()라고 한다면 describe()는 여러 개의 테스트 케이스를 하나의 그룹으로 묶어주는 역할을 한다.
• test()
  • 테스트 코드를 돌리기 위한 API. 하나의 테스트 케이스를 의미하며 it()과 같은 역할을 한다.
• expect()
  • 테스트할 대상을 넣는 API. expect()에는 주로 테스트 입력 값 또는 기대 값을 넣는다.
• beforeEach()
  • 테스트 파일의 각 테스트 코드가 돌기 전에 수행할 로직을 넣는 API. 테스트 케이스마다 반복되는 로직을 넣기에 적합하다.

 

 

그럼 예시를 들어보자.

 

vallidation.js 와 validation.spec.js 파일을 만들어준다. 

테스트 파일 이름은 (파일 이름). test.js 나 (파일 이름). spec.js로 지어주면 된다.

정규식을 이용해서 email 형식이 올바른지 테스트를 해보려고 한다.

//validation.js

module.exports = {
    isEmail: (value) => {
        const email = value || "";
        const [localPart, domain, ...etc] = email.split("@");
        
        if (!localPart || !domain || etc.length) {
            return false;
        } else if (email.includes(" ")) {
            return false;
        } else if (email[0] === "-") {
            return false;
        } else if (!/^[a-z0-9+_-]+$/gi.test(localPart)) {
            return false;
        } else if (!/^[a-z0-9.-]+$/gi.test(domain)) {
            return false;
        }
        return true;
    },
};

 

 

위와 같이 작성했다면 이제 테스트를 해볼 validation.spec.js 파일을 살펴보자.

 

test()와 expect(), toEqual() API를 이용해서 테스트 코드를 작성해보았다.

 

 

//validation.spec.js

const { isEmail } = require('./validation');

test('입력한이메일주소에는 @가 하나만 있어야 이메일 형식이다.',()=>{
    expect(isEmail("my-email@domain.com")).toEqual(true);
    expect(isEmail("my-email@@@@@@@domain.com")).toEqual(false);
    expect(isEmail("my-emaildomain.com")).toEqual(false);
});
test('입력한 이메일 주소에 공백이 존재하면 이메일 형식이 아니다',()=>{
    expect(isEmail("my-email@domain.com")).toEqual(true);
    expect(isEmail("my email@domain.com")).toEqual(false);
   
});
test('입력한이메일주소 맨 앞에 하이픈이 있으면 이메일형식이 아니다.',()=>{
    expect(isEmail("my-email@domain.com")).toEqual(true);
    expect(isEmail("-my-email@@@@@@@domain.com")).toEqual(false);
    
});
test('입력한 이메일 주소중 로컬 파트 에는 영문 대소문자와 숫자, 특수문자는 덧셈기호 하이픈 언더바 3개외에 다른값이 존재하면 이메일 형식이 아니다.',()=>{
    expect(isEmail("my-email99+-_@domain.com")).toEqual(true);
    expect(isEmail("my!!!mail@domain.com")).toEqual(false);
    expect(isEmail("이메일@domain.com")).toEqual(false);
});

 

위와 같이 코드를 작성하고 test를 실행해본다. 위에 package.json에서 test를 실행하면 jest가 실행되도록 설정해놨기 때문에 아래와 같이 npm test를 실행해주면 된다.

npm test

 

그럼 아래와 같이 테스트 결과가 나올 것이다.