TIL - Jest 간단소개

Taesol Kwon·2020년 4월 5일
0

Wecode

목록 보기
25/32

Jest

  • jest란 Facebook에서 개발한 단위 테스트가 가능한 테스트 라이브러리이다.
  • 설치 방법
  1. jest 개발의존성으로 설치
npm i -D jest
  1. package.json에 script 부분 수정
"scripts": {
    "test": "jest"
  },

npm test 라고 치면 jest가 실행 되어 테스트를 해볼 수 있다.
Jest는 기본적으로 test.js로 끝나거나, __test__디렉토리 안에 있는 파일들은 모두 테스트 파일로 인식한다. 만약 특정 테스트 파일만 실행하고 싶은 경우에는 npm test <파일명 이나 경로>를 입력하면 된다.

Jest Method

  • test / it: 테스트 하나를 작성할 때 사용하는 키워드이다.(하나의 테스트 단위)
test("1 is 1", () => {
  expect(1).toBe(1)
})
  • describe: 여러 테스트 케이스를 묶을 수 있다.
describe('describe is nested test', () => {
    beforeAll(() => {
      ...
    });

    afterAll(() => {
     ...
    });

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

    test('** fucntion test', (done) => {
      ...
    });
  });
  • afterAll(fn, timeout): 모든 테스트가 끝나고 한번 실행된다.
  • afterEach(fn, timeout): 하나의 테스트가 끝날 때 마다 매번 실행된다.
  • beforeAll(fn, timeout): 모든 테스트가 시작하기 전에 한번 실행된다.
  • beforeEach(fn, timeout): 하나의 테스트가 시작하기 전에 매번 실행된다.
  • toEqual(): 두 값이 같은지 비교하는 Matcher이다. object가 정확히 같은지 판단할 수 있다. javascript에서 object.is 와 같다.
  • toBeTruthy(), toBeFalsy(): 값이 false인지 true인지 확인하는 Matcher이다.
  • toHaveLength(): object의 길이를 확인하는 Matcher이다.
  • toContain(): array에 포함하는지 확인하는 Matcher이다.
  • toThrow(): 에러를 throw()하는지 확인하는 Matcher이다.

<예시>
직접 VSCODE에서 쳐보며 결과값을 확인해보자.

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

function getUser(id) {
  if (id <= 0) throw new Error("Invalid ID");
  return {
    id,
    email: `user${id}@test.com`
  };
}

test("return a user object", () => {
  expect(getUser(1)).toEqual({
    id: 1,
    email: `user1@test.com`
  });
});

test("number 0 is falsy but string 0 is truthy", () => {
  expect(0).toBeFalsy();
  expect("0").toBeTruthy();
});

test("array", () => {
  const colors = ["Red", "Yellow", "Blue"];
  expect(colors).toHaveLength(3);
  expect(colors).toContain("Yellow");
  expect(colors).not.toContain("Green");
});

test("string", () => {
  expect(getUser(1).email).toBe("user1@test.com");
  expect(getUser(2).email).toMatch(/.*test.com$/);
});

test("throw when id is non negative", () => {
  expect(() => getUser(-1).toThrow());
  expect(() => getUser(-1).toThrow("Invalid ID"));
});
  • fetch를 이용한 비동기 test 방법
function fetchUser(id, cb) {
  setTimeout(() => {
    console.log("wait 0.1 sec.");
    const user = {
      id: id,
      name: "User" + id,
      email: id + "@test.com"
    };
    cb(user);
  }, 100);
}


//done 이용시 비동기처럼 테스트 할 수 있다.
test("fetch a user", done => {
  fetchUser(1, user => {
    expect(user).toEqual({
      id: 1,
      name: "User1",
      email: "1@test.com"
    });
    done();
  });
});

function fetchUser(id) {
  return new Promise(resolve => {
    setTimeout(() => {
      console.log("wait 0.1 sec.");
      const user = {
        id: id,
        name: "User" + id,
        email: id + "@test.com"
      };
      resolve(user);
    }, 100);
  });
}

test("fetch a user", () => {
  return fetchUser(1).then(user => {
    expect(user).toEqual({
      id: 1,
      name: "User1",
      email: "1@test.com"
    });
  });
});

test("fetch a user", async () => {
  const user = await fetchUser(1);
  expect(user).toEqual({
    id: 1,
    name: "User1",
    email: "1@test.com"
  });
});

<참고사이트>(https://www.daleseo.com/jest-basic/)

profile
사진촬영을 좋아하는 프론트엔드 개발자입니다.

0개의 댓글