[Javascript] Jest의 기본 개념

References

https://jestjs.io/

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

 

 

Jest란?

Jest는 테스트 프레임워크로 단순성에 초점을 맞춰 설계되었다.

현재 지원하는 프레임워크 및 라이브러리는 Babel, Typescript, Node, React, Angular, Vue 등이 있다.

 

 

Jest가 가진 특성

Zero Config

Jest aims to work out of the box, config free, on most JavaScript projects.

Jest의 경우 여러 자바스크립트 프레임워크 및 라이브러리에 호한 목적으로 설계 되었기 때문에 별도의 설정 과정 없이 사용 할 수 있다.

// 먼저 npm을 통해 Jest를 설치한 후
npm install —save-dev jest

// 별도의 테스트 파일(자바스크립트 확장자 이름 앞에 .test를 붙인다)을 만들고 코드만 작성하면 준비 완료!
function sum(a, b) {
  return a + b;
}
module.exports = sum;

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

// 이 후엔 터미널로 test 명령어를 실행 한 뒤 CLI에서 원하는 테스트 작업을 수행하면 된다.
PASS  ./sum.test.js
✓ adds 1 + 2 to equal 3 (5ms)

 

Snapshots

Make tests which keep track of large objects with ease. Snapshots live either alongside your tests, or embedded inline.

Jest의 경우 구현된 기능의 예상 결과를 예측하고자 할 때 이러한 작업과정을 쉽게 할 수 있다.

// 예를 들어 배열 타입을 반환하는 함수를 만들었다 칠때...
const multipleTimesNumbers(getNumber) {
	let arr = [];
	for (let i=0; i<getNumber; i++) {
		arr.push(i);
	}
	
	return arr;
}

export default multipleTimesNumbers;

// 이 후엔 터미널로 test 명령어를 실행 한 뒤 CLI에서 원하는 테스트 작업을 수행하면 된다.
import multipleTimesNumbers as mtns from "./multipleTimesNumbers";

test("Is Correct Three Times?", () => {
	expect(mtns(3)).toMatchInlineSnapshot();
});

 

Isolated

Tests are parallelized by running them in their own processes to maximize performance.

Jest의 경우 테스트에 초점을 맞추기 위해 별도의 프로세스에서 실행이 된다.(병렬성)

 

Great API

From it to expect - Jest has the entire toolkit in one place. Well documented, well maintained, well good.

Jest는 test 코드가 직관적으로 설계 되어있어 협업 과정에서 어떠한 기능을 테스트하고자 하는지 빠르게 알 수 있다.

// test 함수 내부의 expect 기능을 통해 기댓값이 무엇인지 알 수 있다.
import multipleTimesNumbers as mtns from "./multipleTimesNumbers";

test("Is Correct Three Times?", () => {
	expect(mtns(3)).toMatchInlineSnapshot();
});