React App Test
1.React App Test(1) : 개념과 종류, tools
작성한 코드를 '테스트'하는 코드를 작성하자!React 앱과 컴포넌트에 초점을 맞춰 자동화된 테스팅의 세계로 뛰어들어 보자..테스팅(Testing)이란 정확히 무엇일까? 왜 하는 것일까?Unit Test를 이해해보자리액트 컴포넌트를 테스트하고 build해보자
2.React App Test(2) : 코드 작성과 실행
두근두근.. 첫 번째 테스트를 실행해보자React App 작업이 완료되었다면, create-react-app으로 프로젝트 생성시 함께 만들어진 setupTests.js와 App.test.js 파일에 주목해보자.파일 이름이 의미하듯, 몇 가지 setup 작업을 수행하는
3.React App Test(3) : 테스트 그룹화(Suite)
Test Suite에 대해 알아보도록 하자.App의 규모가 커질수록 적게는 수십 개에서 수백 개의 test 파일이 생길 수 있다. 이런 여러 테스트 파일을 Test Suite로 묶어 정리할 수 있다. 예를 들어 feature나 관련 component를 기준으로 하여 해
4.React App Test(4) : UI, State 테스트하기
React App을 테스트 할 때, state 값과 UI(User Interaction)에 관련된 내용은 어떻게 처리가 가능할까?이 내용을 알아보기 위해 Greeting이라는 컴포넌트를 아래와 같이 작성해보도록 하자.state값에 따라 처음 화면에는 It's good
5.React App Test(5-1) : 비동기 작업
비동기 코드 테스트를 위해 Async.js와 Async.test.js를 만들어 보도록 하자. fetch 해 온 posts data를 setPost로 담는다. return되는 부분은 아래와 같다. state에 저장한 data 값을 li로 렌더링해주고 있다. 먼저 Asy
6.React App Test(5-2) : 비동기 작업 개선
이전 포스트의 내용을 통해 비동기 코드의 테스트를 위해서 findAllByRole 퀴리를 사용하는 방법을 알아보았다. findAllByRole로 Async.js가 리렌더링 되기를 기다려 결과적으로 listitem에 접근할 수 있다. 딱히 문제는 없었지만, 최선의 코드는