testing-library에 대해서

puka·2022년 9월 13일

Jasmine

  • 가장 인기 있는 JavaScript 유닛 테스트 프레임워크 중 하나이다.
  • Jasmine은 초기 설정을 쉽게 해주며, 장치 기능이 정말로 필요한 경우에도 라이브러리를 추가할 수 있다.
  • ReactTestUtils API에 대한 이해가 필요하다.
  • 전역으로 인해 앱에 테스트를 바로 추가할 수 있다.
  • 모든 프레임워크 중에서 Jasmine이 Angular에 적합하다.

AVA

  • 최소한의 테스트 라이브러리인 AVA는 JavaScript의 비동기성을 이용하여 동시에 테스트를 실행하므로 성능이 향상된다.
  • 전역으로 사용되지 않기 때문에 자신이 사용하는 것을 더 쉽게 통제할 수 있다. 이렇게 하면 테스트가 더욱 명확해져서 정확히 어떤 일이 일어나고 있는지 알 수 있다.
  • JavaScript의 비동기성을 활용하여 테스트하는 것이 유익하다. 주요 이점은 배포 간 대기 시간을 최소화하는 것이다.
  • 필요한 항목만 제공하는 단순 API가 포함되어 있습니다. 추가로 라이브러리를 설치해야 할 수도 있다.

TAPE

  • AVA와 마찬가지로 글로벌을 지원하지 않고 사용자가 직접 포함하도록 요구한다.
  • TAPE에 설정/해제 방법이 없다. 대신, 각 테스트에서 설정 코드를 명시적으로 정의하여 각 테스트를 보다 명확하게 해야 하는 모듈식 시스템을 선택합니다. 또한 테스트 간에 공유되는 상태를 중지한다.
  • Typescript/coffeescript/es6 지원한다.
  • 쉽고 빠르게 시작하고 실행할 수 있는 Tape는 많은 구성 옵션을 오버로드하지 않고 JavaScript를 실행하면 어디에서나 실행할 수 있는 JavaScript 파일이다.

Mocha

가장 많이 사용되는 라이브러리인 Mocha는 개발자들에게 기본 테스트 구조만 제공하는 유연한 라이브러리이다.

  • 필요한 라이브러리를 포함하여 유연한 구성을 원하는 경우 Mocha에 필요한 추가 설정 및 구성을 반드시 확인해야 한다. 추가적으로 설치하는 것이 약간 단점..?
  • Mocha는 테스트 구조를 전역으로 포함하므로 모든 파일에 테스트 구조를 포함하거나 요구하지 않아도 되므로 시간을 절약할 수 있다. 단점은 플러그인에 이러한 내용이 포함되어 있으면 불일치가 발생할 수 있다는 점이다.

Jest

다양한 리액트 애플리케이션과 함께 Facebook에서 사용하고 추천하는 Jest는 잘 지원된다. Jest는 또한 영리한 병렬 테스트로 인해 매우 빠른 테스트 라이브러리를 보고한다.

  • 주로 Jest를 사용하여 React 애플리케이션을 테스트하지만, Jest는 다른 애플리케이션에 쉽게 통합할 수 있으므로 Jest의 고유한 기능을 다른 곳에서 사용할 수 있다.
  • 목록에 있는 다른 라이브러리와는 달리 Jest는 넓은 API를 제공하므로 꼭 필요한 경우가 아니면 추가 라이브러리를 포함할 필요가 없다.
  • Jest는 지속적으로 개발 되어지고 있는 라이브러리이며, 쉽게 접근할 수 있는 여러 안내서가 구비되어 있으며, 프로젝트를 만들 때 볼 수 있는 다양한 환경을 지원한다.
  • jest는 테스트 프레임워크이다.

Enzyme

  • enzyme은 테스트 라이브러리이다.
    • enzyme 메소드로 렌더링한 wrapper는 다양한 기능(mount, shallow, render)을 할 수 있습니다. 내부 state나 props에 접근할 수도 있고, 이벤트를 시뮬레이션할 수도 있다.

      shallow - 이렇게 하면 기본적으로 매번 단일 구성 요소가 렌더링된다. 다시 말해서 효소는 테스트의 하위 요소를 고려하지 않는다. 구성 요소 자체를 주변의 다른 구성 요소나 내부로부터 분리하여 테스트하려는 상황을 고려해야한다.이 렌더링 유형은 완전 통합 테스트보다는 단위 테스트를 선호하는 경우에 유용하다.

      mount - 이것은 모든 하위 요소를 포함하는 전체 DOM 렌더링을 사용하는 얕은 부분의 반대이다. 각 구성 요소가 다른 구성 요소(DOM API)와 집중적으로 상호 작용하는 상황에 이상적이다.

      render - 정적 HTML로 렌더링된다. 여기에는 모든 하위 요소가 포함된다. 이와 동시에, 리액트 라이프사이클 방법에 대한 액세스를 방지하여 테스트를 위한 유연성과 기능을 적게 제공한다. 속도는 굉장히 빠르다. 서버용 jQuery Core를 기반으로 하는 DOM 조작 및 트래버설 API인 Cherio를 기반으로 한다.

react-testing-library

  • document 가 간단하다. 복잡하지 않은 가벼운 느낌
  • facebook에서 권장
  • 쿼리 라는 것으로 타겟엘리먼트에 접근(을 권장)
  • 테스트가 실제 DOM 에서 동작한다. Enzyme은 instance를 이용한 테스트가 많고, react-testing-library는 DOM 중심의 테스트이다.
  • 컴포넌트를 띄우는 방법은 render로 한가지이다.

참고 https://raygun.com/blog/javascript-unit-testing-frameworks/

0개의 댓글