Jest : Expect-Matchers 1️⃣

m_ngyeong·2023년 10월 30일
TDDjest
0

Jest (JavaScript Testing Framework)

목록 보기
1/4
post-thumbnail

🤡 Before we go any further, type of test

Unit Test(단위 테스트)

Unit test(단위 테스트)는 소프트웨어의 최소 단위인 모듈이나 컴포넌트을 기준으로 독립적으로 진행되는 가장 작은 단위의 테스트이다.

개별 모듈을 테스트하는 것으로 모듈이 정확하게 구현되었는지, 예정한 기능이 제대로 수행되는지를 점검하는 것이다. 즉, 단위 테스트는 애플리케이션을 구성하는 하나의 기능이 올바르게 동작하는지를 독립적으로 테스트하는 것이다.

Intergration Test(통합 테스트)

Integration Test(통합 테스트)는 모듈을 통합하는 과정에서 모듈 간의 상호작용의 유효성을 검사하는 테스트이다.

일반적으로 애플리케이션은 여러 개의 모듈로 구성이 되고, 모듈 간 메시지를 주고받는(함수 호출) 기능을 수행한다. 모듈들이 결합하여 하나의 시스템으로 동작하는지 검증하는 과정에서 진행되는 테스트이다. 통합 테스트는 독립적인 기능에 대한 테스트가 아닌 웹 페이지로부터 API를 호출하여 올바르게 동작하는 지를 확인하는 것이다.

Test Implement

  • Test Case : 하나의 테스트 항목. 어떤 테스트 목적, 조건을 테스트하기 위한 입력값, 실행 전의 상태, 기대 결과, 실행 후의 상태 등을 기재한 것.
  • Test Script : Test Case의 실행을 위한 어떠한 지시서, 혹은 자동 테스트에서 사용되는 테스트 코드들
  • Test Suite : Test Case의 집합체. 일반적으로는 시나리오 별로 구분되거나 특정 feature, version별로 나누기도 함

Jest(JavaScript Testing Framework)

Jest?

facebook에서 선보인 JavaScript Testing 도구이다.

  • zero config
    JavaScript 프로젝트에서 구성 없이 즉시 작업하는 것을 목표하기에 빠르게 테스트 케이스 작성 가능

  • snapshots
    large objects를 쉽게 추적하는 테스트를 수행
    스냅샷은 테스트와 함께 제공되거나 인라인으로 포함됨

  • isolated
    테스트는 성능을 극대화하기 위해 자체 프로세스에서 실행하여 병렬화됨
    Tests are parallelized by running them in their own processes to maximize performance.

  • great api
    전체 toolkit을 한곳에 보유

How to use Jest?

jest 설치

$ mkdir my-jest # 프로젝트 디렉터리를 생성
$ npm init
$ npm install jest --save-dev # 개발할 때만 사용

package.json의 test scripts를 수정

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

jest 실행

# 프로젝트 내의 모든 파일을 찾아서 테스트 실행
$ npm test
# 특정 테스트 파일만 실행
$ npm test 파일명 이나 경로

npm test를 실행하면 프로젝트 내에 모든 테스트 파일을 찾아서 테스트를 실행한다. Jest는 기본적으로 test.js로 끝나거나, __test__ 디렉터리 안에 있는 파일들은 모두 테스트 파일로 인식하여 테스트를 실행한다.

Create Test Code

test.js라는 파일을 생성하고, 그 안에 다음과 같이 입력

test("1 is 1", () => {
  expect(1).toBe(1);
});

터미널에 npm test를 실행

$ npm test

> jest-tutorial@1.0.0 test
> jest

 PASS  ./fn.test.js
  ✓ 1 is 1. (4 ms)

Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   0 total
Time:        0.721 s
Ran all test suites.

기본적인 테스트 패턴

test("테스트 설명", () => {
  expect("검증할 값").toXxx("기대하는 값");
});

toXxx 부분에서 사용되는 함수를 흔히 Test Matcher라고 한다.

expect()

특정 조건을 검사하여 테스트 성공 또는 실패 판단

Modifiers(수정자)

  • .not : 반대되는 것을 테스트
  • .resolves : Promise 성공
  • .rejects : Promise 실패

Matchers

  • toBe() : 숫자나 문자와 같은 객체가 아닌 기본형(primitive) 값을 비교할 때 사용
  • toEqual() : 객체 인스턴스의 모든 속성을 재귀적으로 할 때 사용
  • toStrictEqual() : Equal보다 훨씬 엄격한 Equal. 특정 요소에 undefined가 나오는 것을 허용하지 않음
const fn = {
  makeUser: (name, age) => ({ name, age, genter: undefined }),
};
// toEqual()
test("이름과 나이를 전달받아 객체 반환", () => {
  expect(fn.makeUser("Min", 23)).toEqual({ name: "Min", age: 23 });
});
// toStrictEqual()
test("이름과 나이를 전달받아 객체 반환", () => {
  expect(fn.makeUser("Min", 23)).toStrictEqual({ name: "Min", age: 23 });
});
  • toBeNull() / toBeUndefined() / toBeDefined() 
test("null is null", () => {
  expect(null).toBeNull();
});
  • toBeTruthy() / toBeFalsy() : boolean type 확인
    느슨한 타입 기반 언어인 자바스크립트는 숫자 1이 true로 간주되고, 숫자 0이 false로 간주되는 것과 같이 모든 타입의 값들을 true 아니면 false 간주하는 규칙이 있음
    toBeTruthy()는 검증 대상이 이 규칙에 따라 true로 간주되면 테스트 통과이고, toBeFalsy()는 반대로 false로 간주되는 경우 테스트가 통과됨
test("number 0 is falsy but string 0 is truthy", () => {
  expect(0).toBeFalsy();
  expect("0").toBeTruthy();
});
  • .toBeGreaterThan(number | bigint) : 크다
  • .toBeGreaterThanOrEqual(number | bigint) : 크거나 같다
  • .toBeLessThan(number | bigint) : 작다
  • .toBeLessThanOrEqual(number | bigint) : 작거나 같다
//failed test
test("ID는 10자 이하여야 한다.", () => {
  const id = "THE_BLACK_ORDER";
  expect(id.length).toBeLessThanOrEqual(10);
});
  • toBeCloseTo() : 부동 소수점 숫자를 비교하여 근사치 값인지 판단
const fn = {
  add: (num1, num2) => num1 + num2,
};
//failed test, 2진법을 사용하기 때문에 소숫점을 정확하게 계산하지 못함.
test("0.1 + 0.2 = 0.3", () => {
  expect(fn.add(0.1, 0.2)).toBe(0.3);
});
//passed test
test("0.1 + 0.2 = 0.3", () => {
  expect(fn.add(0.1, 0.2)).toBeCloseTo(0.3);
});
  • toMatch() : 문자열의 경우에는 단순히 toBe()를 사용해서 문자열이 정확히 일치하는지를 체크하지만, 정규식 기반의 테스트가 필요할 때 사용
test("string", () => {
 expect("user1@test.com").toBe("user1@test.com");
 expect("user2@test.com").toMatch(/.*test.com$/);
});
test("Hello World에 e라는 글자 있나?", () => {
  expect("Hello World").toBe("user1@test.com");
});
  • toContain() : 특정 원소가 배열에 들어있는지 테스트
  • toHaveLength() : 배열의 경우에 배열이 길이를 체크
test("User List에 Pooh 있나?", () => {
  const user = "Pooh";
  const userList = ["Tom", "Pooh", "Kai"];
  expect(userList).toHaveLength(3);
  expect(userList).toContain(user);
});
  • toThrow() : 예외 발생 여부를 테스트해야할 때 사용
    toThrow() 함수는 인자도 받는데 문자열을 넘기면 예외 메시지를 비교하고 정규식을 넘기면 정규식 체크
const fn = {
  throwErr: () => {
    throw new Error("xx");
  },
};
test("Error 발생", () => {
  expect(() => fn.throwErr()).toThrow("xx");
});

그외 Matchers 함수 : https://jestjs.io/docs/expect


참고문서,
test: https://velog.io/@dahunyoo/QA-Test-Process-4.-Test-Implement-테스트-구현,
https://mangkyu.tistory.com/143,
Jest: [Youtube]Jest 강좌 - 코딩앙마,
https://www.daleseo.com/jest-basic/

profile
m_ngyeong
ʚȉɞ
다음 포스트

Jest : Asynchronous Code Test 2️⃣

0개의 댓글