-
Jest?
- 페이스북이 만든 테스팅 프레임 워크
- 최소한의 설정으로 동작하고 테스트 케이스를 만들어서 어플리케이션 코드가 잘 돌아가는지 확인할 수 있다
- RCA 이용하면 바로 사용 가능
Jest 가 Test 파일을 찾는방법
- 파일이름.test.js
- 파일이름.spec.js
- tests 폴더안에 있는 파일
파일구조
- describe 안에 test(it) 이 있는 구조
describe
- 비슷한 테스트 케이스 여러 테스트를 그룹화하는 블록을 만든다
it (test)
- 개별 테스트를 수행하는 곳
- 각 테스트를 하나의 문장처럼 설명
- it 내부는 expect 와 matcher 로 구성된다
expect
- 값을 테스트 할때마다 사용.
- 혼자서는 거의 사용되는 일이 없고, matcher와 페어로 사용된다
matcher
- 여러가지 다른 방법으로 어떤 값을 테스트하도록 사용된다
(toBe, not.toBe, toBeTruthy, toBeCalledWith 등)
- jest github에서 커스텀매처를 확인할 수 있다
App.test.js 의 디폴트 내용 render
- DOM 에 컴포넌트를 렌더링하는 함수
- 인자로는 렌더링할 컴포넌트가 들어간다
return 은 RTL 에서 제공하는 쿼리함수와 기타 유틸리티 함수를 담고 있는 객체를 리턴하지만
소스코드가 복잡해지면 리턴해야하는 함수가 증가하기 때문에
가능한 screen 객체를 사용하는 것이 좋다
-> 사용해야할 쿼리가 많아질수록 코드가 복잡해진다
쿼리함수
쿼리는 페이지에서 요소를 찾기위해 테스트 라이브러리가 제공하는 수단
get, find, query 와 같이 여러유형이 있다
-> 차이점은 요소가 발견되지 않으면, 쿼리에서 오류가 발생하는지 또는 prromise 를 반환하도 다시 시도하는지
필요에 따라 적절한 쿼리를 사용
getBy
쿼리에 대해 일치하는 노드를 반환한다
일치하는 요소가 없거나 둘이상의 일치가 발견되면 설명 오류 발생
-> 둘이상이 예상될 경우에는 getAllBy를 사용
queryBy
쿼리에 대해 일치하는 노드를 반환한다
일치하는 요소가 없으면 null을 반환
존재하지 않는 요소를 검사하는데에 유용
둘 이상의 일치항목이 발견되면 오류
-> 둘이상이 확인될 경우 queryAllBy 사용
findBy (getBy + waitFor)
가져오는 getBy 에 기다리게 하는 waitFor 가 더해진 쿼리
쿼리에 대해 일치하는 요소가 발견되면 Promise 를 반환한다
일치하는 요소가 없거나, 기본 제한시간인 1000ms 후에 둘 이상의 요소가 발견되면 약속이 거부됨
->둘 이상을 찾아야할 경우 findAllBy 사용
출처 : 인프런 John Ahn 님 리액트 테스트 강의내용 중