React _ 104.03 _ React_Testing_Library

react- testing-library

• jest는 자바스크립트 테스트 프레임워크로 자바스크립트를 전반적으로 테스트하기 위한 프레임워크이다.
• 리액트도 자바스크립트이기는 하지만, jsx를 사용하고 있으므로 일반적인 자바스크립트는 아니다
• 또한 리액트의 jsx는 html의 dom을 다루기 때문에 단순한 자바스크립트의 테스트로 정확한 오류를 잡아내기는 어렵다.
• 리액트뿐 아니라 최근 프론트엔드 프레임워크 라이브러리인 앵귤러와 vue도 자바스크립트에서ㅗ dom을 직접 다루기 때문에 일반적인 자바스크립트 테스트 프레임워크로는 모든 테스트를 수행하기 어렵다.

@testing-library

• 위와 같은 문제들을 해결하고자 만들어진 DOM 테스팅 라이브러리이다.
• 사용자 중심 방식으로 UI 컴포넌트를 테스트하는데 도움을 주는 라이브러리다.
• 리액트 이외에도 앵귤러, Vue, Sevelte등 UI 컴포넌트를 다루는 최신 라이브러리를 지원하고 있다.
• 리액트를 지원하는 @testing-library는 react-testing-library이다.

장점

• 매우 가벼운 솔루션으로, 유지 보수가 가능한 리액트 컴포넌트용 테스트 코드를 작성할 수 있다.

• 리액트 컴포넌트용 테스트 코드 작성을 도와준다.

  • 테스트코드를 작서알 때 컴포넌트 세부 구현 사항을 포함하지 않으면서도 신뢰할 수 있는 테스ㅡ코드 작성에 도움을 준다.
  • 이렇게 컴포넌트의 세부 구현 사항을 포함하지 않은 테스트 코드를 작성하면 컴포넌트의 세부 구현 부분을 리팩토링해도 테스트 코드를 수정할 필요가 없다.
  • 이로 한번 작성한 테스트 코드는 긴 시간 유지할 수 있으며 오랜 기간 유지가능한 테스트 코드는 자주 수정하지 않아도 되므로 개발 생산성을 향상시켜준다.

• react-testing-library는 react-dom위에서 동작한다.

• 다른 테스트 프레임워크는 리액트 컴포넌트를 단순히 인스턴스로 처리하지만 react-testint-library는 실제 DOM노드에서 작동하므로 더 신뢰할 수 있는 테스트를 할 수 있다.

• 사용자 중심의 테스트 유틸리티를 제공한다.