ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [Test] Jest 기본 사용법
    FrontEnd/Test 2024. 1. 9. 17:01

    https://www.daleseo.com/jest-basic/

     

    Jest로 기본적인 테스트 작성하기

    Engineering Blog by Dale Seo

    www.daleseo.com

    1. jest란

     Jest는 테스트 과정에서 필요한 Test Runner, Matcher, Mock을 한 번에 해결해 줄 테스팅 프레임워크로 불리운다.

    npm i -D jest

    2. 실행

    package.json 스크립트 옵션에서 아래와 같이 작성하여 npm test 라고 입력시 jest가 실행되도록 함

    jest는 test.js로 끝나는 파일이나 , __test__ 디렉터리 안에 있는 파일은 모두 테스트 파일로 인식해줌.

    ( 특정 테스트 파일만 실행하고 싶으면 npm test <파일명 || 경로> 입력

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

    3. 테스트 라이브러리를 실행함에 있어 필요한 사전지식(?)

    1. 매처 (Matcher):
      • 매처는 테스트 중에 특정 값이나 조건을 검증하는 데 사용되는 표현입니다. 이들은 테스트 코드 내에서 기대값(expected value)을 실제 값(actual value)과 비교하는 데 사용됩니다.
      • 예를 들어, Jest 같은 테스팅 프레임워크에서 expect(value).toBe(42)라는 코드는 value가 42와 정확히 일치하는지 확인하는 매처입니다. 여기서 .toBe(42)가 매처의 역할을 합니다.
      • 매처는 등가성 비교, 타입 검사, 배열의 길이 확인 등 다양한 형태로 존재할 수 있으며, 테스트의 의도를 명확하게 표현하는 데 중요한 역할을 합니다.
    2. 러너 (Runner):
      • 테스트 러너는 테스트 케이스를 실행하고 결과를 보고하는 소프트웨어입니다. 테스트 러너는 테스트 스위트를 관리하고, 각 테스트 케이스를 순차적으로 실행하며, 성공, 실패, 오류 등의 결과를 사용자에게 표시합니다.
      • 예를 들어, Jest, Mocha, Jasmine 등은 자바스크립트 환경에서 널리 사용되는 테스트 러너입니다. 이들은 테스트 코드를 구동하고, 결과를 개발자에게 알려주며, 종종 명령줄 인터페이스(CLI)를 통해 추가적인 테스트 옵션을 제공합니다.
      • 테스트 러너는 테스트 환경을 설정하고, 테스트 실행 순서를 관리하며, 종합적인 테스트 보고서를 생성하는 데 중요합니다.
    3. 목 (Mock):
      • 목은 실제 객체를 테스트 목적으로 모방한 객체입니다. 이들은 실제로 복잡하거나 예측 불가능한 외부 시스템(예: 데이터베이스, API, 복잡한 로직)과의 상호작용을 단순화하기 위해 사용됩니다.
      • 예를 들어, API 호출을 하는 함수를 테스트할 때, 실제 API 서버에 요청을 보내는 대신 목 객체를 사용하여 API 응답을 모방할 수 있습니다. 이렇게 하면 네트워크 지연이나 불안정한 외부 요인으로부터 독립적으로 테스트를 진행할 수 있습니다.
      • 목은 테스트 대상 코드가 외부 요소와 어떻게 상호작용하는지를 제어할 수 있도록 하며, 테스트의 신뢰성과 일관성을 높이는 데 도움을 줍니다.

    4. 자주 사용되는 Matcher

    // toEqual(), toMatch()
    
    function getUser(id) {
        return {
            id,
            email: `user${id}@test.com`,
        };
    }
    
    // toEqual() 를 통해 위의 함수를 테스트,
    // toMatch() 를 통해 정규표현식 체크
    
    test('return a user object', () => {
        expect(getUser(1)).toEqual({
            id: 1,
            email: `user1@test.com`,
        });
        expect(getUser(1).email).toMatch(/.*test.com/);
    });

     

    // toBeFalsy() , toBeTruthy()
    
    test('number 0 is falsy but string 0 is truthy', () => {
        expect(0).toBeFalsy();
        expect('0').toBeTruthy();
    });
    
    /**
     숫자 1이 true로 간주되고, 숫자 0이 false로 간주되는 것과 같이 모든 타입의 값들을 true 아니면 false 간주하는 규칙이 있음. 
     toBeTruthy()는 검증 대상이 이 규칙에 따라 true로 간주되면 테스트 통과이고, 
     toBeFalsy()는 반대로 false로 간주되는 경우 테스트가 통과됩니다.
     
     참고로 "0" 은 0이 아니므로 true로 간주 되어서 패스 되는겨
     */

     

    // toHaveLength(), toContain() 배열에 특정 길이를 갖는 요소가 있는지, 특정 원소가 있는지 존재 여부
    
    test("array", () => {
      const colors = ["Red", "Yellow", "Blue"];
      expect(colors).toHaveLength(3);
      expect(colors).toContain("Yellow");
      expect(colors).not.toContain("Green");
    });

     

    // toThrow(), expect() 함수에 넘기는 검증 대상을 함수로 한 번 감싸줘야함
    // 그렇지 않으면 예외 발생 여부를 체크하는 것이 아니라, 
    // 테스트 실행 도중 정말 그 예외가 발생하기 때문에 그 테스트는 항상 실패하게 됨 (id가 음수여서가 아닌 다른 예외로 발생하기 때문에 실패함)
    
    function getUser(id) {
        if (id <= 0) throw new Error('Invalid ID');
        return {
            id,
            email: `user${id}@test.com`,
        };
    }
    
    test('throw when id is non negative', () => {
        expect(() => getUser(-1)).toThrow();
        expect(() => getUser(-1)).toThrow('Invalid ID');
    });

     

Designed by Tistory.