frontend/테스트

Jest 와 @testing/library 간단 정리

장구루애비 2022. 3. 30. 18:01

Jest

jest는 자바스크립트 전반적인 기능을 테스트 할 수 있는 "테스트 러너" 이자 "프레임웍" 이다.

jest matchers

toBe: 동일성 비교

toEqual: 동등성 비교

 

동일은 값 또는 참조 주소가 완전 일치한치 여부.

동등은 객체가 같은형태인지 여부. 

 

작성  규칙 관련

expect() 에는 테스트할 기능을 넣는다.

예시:

expect(테스트할 표현식).toBe(테스터가 기대하는 결과값)

 

몰랐던 용어

code coverage : 테스트코드가 얼마나 많은 소스코드를 테스트 하는지를 나타내는 지표

 


@testing-library

DOM을 테스트하기 위한 라이브러리.

@testing-library는 테스트러너 또는 프레임웍이 아니기 때문에 jest 같은 도구와 함께 사용되어야 한다.

 

이런 것들을 테스트 할 수 있다

  • 어떤 라벨을 갖고 있는지
  • 엘리먼트 길이 체크
  • 이미지가 src 체크 alt 애트리뷰트를 가졌는지
  • 이미지가 logo.svg 와같은 파일을 가졌는지
  • 스냅샷과 같은지 테스트
  • styleRule을 가졌는지 modifier를 가졌는지
  • event handler는 jest.fn()으로
  • fireEvent를 통해 클릭 후 DOM이 어떻게 변했는지