Test app 이점, React Testing Library, Jest

오늘도 삽질중·2022년 12월 23일
0

React-Test-App

목록 보기
1/8

✅ 어플리케이션 TEST를 하는 이유

  • 간단하게 더 안정적인 어플리케이션을 만들 수 있기 때문이다.

✅ 테스팅으로 얻는 이점

  • 디버깅 시간을 단축! 만약 데이터가 잘못 나왔다면 프론트 문제인지 백 문제인지 등 전부 테스트를 통해서 찾아봐야하는데 테스팅 환경이 구축이 되면 쉽게 찾아낼 수 있다.
  • 안정적인 어플리케이션
  • 이 밖에도 재설계 시간의 단축, 추가로 구현해야할게 있을때 더욱 용이하게 할 수 있다.

✅ 리엑트 테스팅 라이브러리(React Testing Library)

정의: 리액트 컴포넌트를 테스트하는 가벼운 솔루션

  • React Testing Library는 React 구성 요소 작업을 위한 API를 추가하여 DOM Testing Library위에 구축된다.
  • 또한 React Testing Library는 에어비앤비에서 만든 구현 주도인 Enzyme을 대처하는 행동 주도인 솔루션이다.
<p>
  hihi<code>src/App.js</code> and save to reload..
</p>  
  • 구현 주도란?
    구현 주도 테스트위에서는 UI를 테스트 할 때 주로 <p>태그가 쓰였고 hihi 등의 문자가 들어갔다는것을 테스트하는 것이다. 그래서 만약 <p>태그를 <h2>태그로 바뀌면 에러가 날 것이다.
  • 행동 주도란?
    하지만 행동 주도 테스트에서는 사용자의 입장에서 테스트 하기에 <p>태그가 쓰이던 <h3> 태그가 쓰여 글을 표현하는지가 중요한것이 아니고 어떠한 이벤트를 발생시켰을때 화면이 어떻게 변화가 되는지 같은 테스트가 더 주를 이룬다.

✅ Jest

  • facebook에 의해서 만들어진 테스팅 프레임워크이다. 최소한의 설정으로 동작하고 Test Case를 만들어 어플리케이션 코드가 잘 돌아가는지 확인해준다.

  • 리액트 어플리케이션을 테스트할 때 리액트 테스팅 라이브러리랑 jest모듈을 이용해 리액트 테스트를 한다. 리액트 테스트 라이브러리로 -> DOM렌더링하고, 렌더링된 DOM을 jest로 이용해서 테스트할 것이다. 또한 jest는 테스트 코드를 짠 파일을 찾아 실행시켜주는 역할도 한다(파일 test, spec / 폴더 tests라고 하면 jest가 알아서 찾아줌)

profile
의미없는 삽질은 없다1

0개의 댓글