Matchers (Jest, RTL)

2023. 3. 28.·🎨 프론트엔드 공부/기타

📍참고

https://jestjs.io/docs/using-matchers

 

Using Matchers · Jest

Jest uses "matchers" to let you test values in different ways. This document will introduce some commonly used matchers. For the full list, see the expect API doc.

jestjs.io

 

📍Matcher 란?

✅Jest에서 값을 다양한 방법으로 테스트하기 위해 사용

- a > b, a = b, a < b 등..

- 2 + 2 = 4 인지 평가하는 예시

test('two plus two is four', () => {
  expect(2 + 2).toBe(4); // 값이 같은지 평가
});

 

📍Matchers from Jest

✅Jest의 matcher는 A, B 두 값을 비교하는데 쓰인다

- expect(A) .matcher(B) 형태로, A 와 B 를 비교한다

- 예시

expect(["A", "B"]).toHaveLength(2) // 검사할 값이 array이고, 특정 길이인지 확인
expect(5).toEqual(5) // 검사할 값이 특정 값인지 확인
expect(["A", "B", "C"]).toContain("B") // array, string이 특정 값을 포함하는지 확인
expect(fn).toThrow() // 함수를 호출하면 에러가 발생하는지 확인
expect(mock).toHaveBeenCalled() // 목업 함수가 호출되는지 확인

 

📍Matchers from RTL(jest-DOM)

✅RTL의 matcher는 값이 아닌 DOM을 검사하는데 쓰인다

- 엄밀히 따지면, jest-dom 라이브러리의 matcher가 제공된다

- 예시

 

expect(element).toBeInTheDocument() // element가 현재 페이지에 있는지 확인
expect(element).toBeEnabled() // element가 사용 가능한 상태인지 확인
expect(element).toHaveClass() // element가 특정 클래스를 갖고 있는지 확인
expect(element).toHaveTextContent() // element가 특정 콘텐츠(텍스트)를 가졌는지 확인
expect(element).toHaveValue() // input, select, textarea 등이 value를 가졌는지 확인
'🎨 프론트엔드 공부/기타' 카테고리의 다른 글
  • 시맨틱 버저닝(semantic versioning) 과 NPM
  • npm workspace로 모노레포 구축하기
  • Testing Library의 Queries
  • CRA 환경의 내장 testing 라이브러리
지식물원
지식물원
지식이 자라는 식물원!
  • 지식물원
    지식물원
    지식물원
  • 전체
    오늘
    어제
    • 분류 전체보기 (510)
      • 🎨 프론트엔드 공부 (247)
        • JS & TS (86)
        • HTML & CSS (22)
        • React & Next (49)
        • Vue & Nuxt (22)
        • 기타 (68)
      • 🤓 기술 학습 & 공부 기록 (116)
        • Node.js (0)
        • Python (37)
        • 백엔드 (0)
        • 딥러닝 (1)
        • 컴퓨터 일반 (72)
        • 개발 인프라 (6)
      • 👨‍💻 프로젝트 경험 (6)
        • Work (0)
        • Toy (6)
      • ⚙️ 개발 팁 & 노하우 (21)
        • 프론트엔드 (6)
        • 기타 (15)
      • ☕️ 커리어 & 인터뷰 준비 (88)
        • 코딩 테스트 (88)
      • 📰 기술 트렌드 & 생각 정리 (4)
      • 📚 기타 (25)
        • 마케팅 (15)
        • 비개발서적 (10)
  • 블로그 메뉴

    • 태그
  • 링크

  • 공지사항

    • 모바일 접속 시 코드 하이라이팅 깨질 때
  • 인기 글

  • hELLO· Designed By정상우.v4.10.3
지식물원
Matchers (Jest, RTL)
상단으로

티스토리툴바