react-testing-library 를 사용한 리액트 컴포넌트 테스트

• react-testing-library는 Enzyme과 달리 모든 테스트를 DOM 위주로 진행하며, 컴포넌트의 props나 state를 조회하지 않는다. 이는 컴포넌트의 기능이 동일하게 작동한다면, 내부 구현 방식이 변경되어도 테스트가 실패하지 않도록 하기 위함이다.

• react-testing-library를 사용하여 Profile 컴포넌트를 만들고 테스트하는 방법을 설명한다. Profile 컴포넌트는 username과 name을 props로 받아 렌더링하며, 이를 App에서 렌더링하여 결과를 확인한다.

• React 컴포넌트의 테스트 코드를 작성하는 방법을 설명하며, 이를 위해 react-testing-library의 render 함수를 사용하고, 이 함수의 결과물로 나오는 다양한 쿼리 함수들을 활용하여 원하는 DOM을 선택할 수 있다.

• 스냅샷 테스팅이란 렌더링된 결과가 이전에 렌더링한 결과와 일치하는지 확인하는 작업을 의미하며, 이를 통해 코드의 변경 사항을 쉽게 파악하고 업데이트할 수 있다.