React Testing Library의 query중 [get | query | find] byRole이 있다. 첫번째 인자는 DOM트리에 존재하는 컨테이너를 받고, 두번째 인자에는 옵션을 받는다. 옵션에는 다음과 같이 여러가지가 있다. 나는 그중 name에 대해 정리하려고 한다. TPGI.com을 참고했다. # Accessible Name getByRole query를 사용하여 테스팅 할 때, 테스팅하려는 가상 DOM tree에 동일한 role을 가진 HTML Element가 여러개 있을 수 있다. 이 중 하나를 특정짓고 싶을 때 name을 사용한다. 여기서 말하는 Accessible Name이

공식문서를 참고하여 작성했습니다. MSW란? Service Worker를 사용하여 네트워크 호출을 가로채는 API mocking 라이브러리. 즉, 브라우저에서 자신이 백엔드 API인 것처럼 동작하면 가짜 데이터를 응답으로 보내준다. MSW를 통해 충족시켜야 하는 것들 네트워크 call들을 가로채어 특정 응답을 반환한다. 테스팅 동안에는 네트워크 call들을 차단한다. 서버 응답을 사용하여 테스트 컨디션을 만들어준다. MSW Set up npm install msw handler 생성 => 특정 URL과 라우트에 무엇을 반환할지 결정 하는 함수가 handler이다. 요청을 처리할 test server생성 테스트 하는 동안 테스트 서버가 항상 수신 대기중인지, 호출을 잘 가로채고 있는

공식문서를 번역한 글입니다. 1. 누구나 접근 가능한 쿼리 마우스를 사용하고 화면을 시각적으로 보며 스크린 리더와 같은 보조 기술(assistive technology)를 사용하는 사람이라면 누구나 접근 가능. > ### 1) getByRole > getByRole은 모든 요소들에 쿼리하기 위해 사용된다. > 예) `getByRole('button', {name: /submit/i}) > role에 대한 정의 > ### 2) getByLabelTest > form필드에서만 사용된다. 하지만 사용자들이 보통 이런 요소들을 우선적으로 찾기 때문에 최우선적으로 작성되어야 한다. > ### 3) getByPlaceholderText placeholder는 label을