티스토리 뷰

320x100

이 글은 주니어 개발자가 쓴 글로 오류가 있을 수 있습니다.

문제가 있거나 수정이 필요한 부분은 댓글로 알려주시면 감사하겠습니다.


Jest란?

Facebook에서 만든 JavaScript Test Framework입니다. Babel, TypeScript, Node, React, Angular, Vue 등과 함께 사용할 수 있고, Test Runner, Test Matcher, Test Mock Framework를 모두 제공합니다.

 

기본 사용 방법

test("테스트 설명", () => {
  expect("검증 대상").toXXX("기대 결과");
});

 

Jest CLI 옵션(CLI Options)

제가 사용할 수도 있을 것 같은 옵션을 정리한 내용입니다. 모든 옵션이 궁금하신 분은 링크에서 확인하실 수 있습니다.

 

jest <regexForTestFiles>

  • regex에 매치되는 파일들을 테스트한다.
  • 주의) windows에서는 경로 구분자로 '/'를 사용하거나 '\\'로 이스케이프 해야 한다.

--ci

  • CI 환경에서 실행된 것으로 간주한다. 새 스냅샷을 자동으로 저장하지 않고, 테스트가 실패하면 '--updateSnapshot'로 실행해야 된다.

--clearCache

  • Jest 캐시 디렉터리를 삭제한다. 테스트는 실행하지 않는다.
  • 주의) 캐시를 지우면 성능이 저하된다.

--collectCoverageFrom=<glob>

  • glob 패턴으로 작성된 위치의 테스트 적용 범위 정보를 출력한다.

--collect[=<boolean>]

  • Alias: '--collectCoverage'
  • 테스트 적용 범위 정보를 출력한다.
    • stmts: Statements - 전체 명령문 중 얼마나 테스트되었는가?
    • branch: 전체 분기문 중 얼마나 테스트되었는가?
    • funcs: 전체 함수 중 얼마나 테스트되었는가?
    • lines: 전체 코드 라인 중 얼마나 테스트되었는가?
    • uncovered line $s: 테스트되지 못한 줄(s번째 줄)

--errorOnDeprecated

  • 사용하지 않는 API가 도움되는 에러를 던지게 한다. 업그레이드를 위한 정리에 유용하다.

--expand

  • Alias: -e 패치 대신 모든 diff와 error를 보여준다.

--filter=<file>

  • 실행하지 않을 테스트 파일을 설정한다.

-findRelatedTests <spaceSeparatedListOfSourceFiles>

  • 실행할 테스트 파일 목록을 설정한다. 아주 적은 양의 테스트를 실행하기에 유용합니다.

--init

  • 기본 jest.config.js 파일을 생성한다.
  • 질문에 대한 설정이 되어 있고, 나머지 설정들은 간략한 설명과 함께 default 값으로 주석 처리되어 있다.

--json

  • 테스트 결과를 json으로 출력한다. [참고]
  • '--outputFile=<filename>'와 같이 사용 가능하다.

--logHeapUsage

  • 힙 사용량을 출력한다. 메모리 누수를 추적하기에 유용하다.
  • '--runInBand', '--expose-gc'와 함께 사용 가능하다.

---maxConcurrency=<num>

  • test.concurrent의 동시 실행 개수를 지정한다.

--maxWorkers=<num>|<string>

  • Alias: '-w'
  • 성능에 중요한 영향을 주는 무언가 인 듯하다..

--onlyChanged

  • Alias: '-o'
  • 현재 레파지토리에서 이전 커밋과 비교하여 변경된 파일만 테스트한다.

--roots

  • 루트 패스를 설정한다.

--runInBand

  • Alias: '-i'
  • 하위 프로세스의 worker pool을 생성하는 대신, 모든 테스트를 현재 프로세스에서 실행한다. 디버깅에 유용하다.

--testNamePattern=<regex>

  • Alias: '-t'
  • 정규식과 일치하는 테스트만 실행한다.
  • 예를 들어, "GET /api/computer with auth"와 같은 권한 부여와 관련된 테스트만 실행하려면 jest -t=auth를 사용할 수 있다.
  • 정규식은 test 이름과 describe 블록 이름과 매치된다.

--testPathPattern=<regex>

--testPathIgnorePatterns=<regex>|[array]

  • 테스트할/테스트에서 제외할 경로를 설정한다.
  • 주의) windows에서는 경로 구분자로 /를 사용하거나 \\\\로 이스케이프 해야 한다.

--testTimeout=<number>

  • default: 5000

--updateSnapshot

  • Alias: '-u'
  • 테스트 실행 중에 실패한 스냅샷을 기록한다.
  • --testNamePattern과 함께 사용할 수 있다.

--verbose

  • 개별 테스트 결과를 hierarchy로 보여준다.

--version

  • Alias: '-v'
  • Jest version을 출력한다.

--watch

  • 파일이 변경되면 변경된 파일과 관련된 테스트를 다시 실행한다.

--watchAll

  • 파일이 변경되면 모튼 테스트를 다시 실행한다.

 

Jest 설정(Configuring Jest)

jest.config.json 혹은 jest.config.js 파일에서 설정할 수 있습니다.

CLI Options 와 유사한 설정은 생략했습니다. 모든 설정이 궁금하신 분은 링크에서 확인하실 수 있습니다.

 

automock

  • Default: false
  • 테스트에서 import한 모든 모듈이 자동으로 mock이 된다.
  • 모든 모듈은 API 형식은 유지하면서 내부는 대체 구현된다.
  • 임의로 returnValue를 설정하는 등 mock 기능을 사용할 수 있다.

clearMocks

  • Default: false
  • 테스트마다 모든 mock의 mock.calls와 mock.instances를 초기화한다.
  • 각 테스트 전에 'jest.clearAllMocks()'를 호출하는 것과 동일한 효과가 있다.

coverageThreshold

  • 적용 범위 결과에 최소 임계값을 설정한다. 임계값을 넘지 못하면 테스트는 실패한다.
  • "coverageThreshold": {
      "global": {
        "branches": 50,
        "functions": 50,
        "lines": 50,
        "statements": 50
      },
      "./src/Queue/": {
        "branches": 40,
        "statements": 40
      }
    }

moduleNameMapper

  • webpack의 resolve.alias와 유사하다.

testEnviroment

  • Default: "node"
  • "jsdom"으로 설정하면 DOM API를 사용할 수 있다(ex. document.createElement('div'))

testURL

  • default: http://localhost
  • jsdom 환경의 URL을 설정한다. location.href 같은 속성에 반영된다.

 

사용 중인 옵션

{
  "clearMocks": true,
  "collectCoverage": true,
  "verbose": true,
  "testEnvironment": "jsdom",
  "moduleNameMapper": {
    "^@/(.*)$": "<rootDir>/src/$1", // import 시, "@/file"을 하면 "<rootDir>/src/file"을 가져온다.
    "^@/lib/(.*)$": "<rootDir>/src/lib/$1" // "@/lib/file" => "<rootDir>/src/lib/file"
  }
}

collectCoverage는 테스트가 잘 되고 있는지 확인할 수 있기에 필수로 사용하고 있고, verbose는 테스트 파일을 일일이 열어보지 않아도 테스트 항목을 확인할 수 있게 해주어 역시 필수로 사용하고 있습니다.

testEnvironment는 해당 프로젝트에서 DOM API를 사용하고 있어 설정했고, moduleNameMapper는 필요한 경우 프로젝트에 맞게 설정합니다.

 

이외에 좋은 설정 방법이 있으면 댓글로 알려주시면 감사하겠습니다.

320x100
댓글