TDD(Test-driven Development)코드를 작성하기 전에 테스트를 쓰는 소프트웨어 개발 방법론작은 단위의 테스트 케이스를 작성하고, 이를 통과하는 코드를 작성하는 과정을 반복하는 것예상하지 못했던 버그를 줄여 소요 시간을 줄일 수 있다Write Faili
자동으로 테스트 관련 라이브러리(Testing Libarary)가 설치된다. 이 중 @testing-library/jest-dom는 import까지 자동으로 되어있다. (setupTest.js 파일에서)테스트 script도 자동으로 설정되어 있다. (npm run te
위 이미지 (전원 OFF 텍스트 활성화 = ON 버튼 활성화 = OFF 버튼 비활성화) 상태에서 테스트 진행toBeDisabled 함수 앞에 not을 붙인다.fireEvent 사용활성화 상태이던 ON 버튼이 비활성화 상태가 되는 것이 맞으므로 테스트는 PASS된다.
CRA로 앱 설치했을 때 기본 제공되는 테스트 코드인자로 주어진 컴포넌트의 JSX에 대한 가상 DOM을 만든다.screen global을 통해서 가상 DOM에 접근한다. render 메서드와 screen global 객체 둘 다 RTL를 import해서 가져온다. (
컴포넌트를 가상 DOM으로 렌더링 (render)가상 DOM 탐색 (getByText)가상 DOM과 상호작용but.. 테스트를 찾고 실행하고 단언(Assertion)할 Test Runner가 필요 👉🏽 Jest!!Testing Library와 같이 쓰이는 것을 권장
테스트를 최대한 격리 함수나 컴포넌트를 테스트 할 때 의존성을 표시컴포넌트가 의존하는 다른 함수나 컴포넌트가 있으면 실제 버전 대신 테스트 버전을 사용👉🏽 문제 발생 시 다른 어떤 것이 아닌 해당 유닛의 문제임을 알 수 있도록.내부 테스트 시행격리 상태에서 컴포넌트
DOM 노드 트리 내의 모든 암시적 ARIA 역할의 목록을 출력하는 데 사용할 수 있는 Testing Library의 헬퍼 함수각 Role에는 해당 Role과 일치하는 모든 노드의 목록이 포함된다.getByRole을 사용하여 테스트 중인 DOM을 쿼리하는 방법을 찾는