주섬주섬 코딩, 소소하지만 꾸준히 쌓아가는 개발 기록...

react-testing-library 를 사용하여 TDD 개발 흐름으로 투두리스트 만들기 비동기적으로 바뀌는 컴포넌트 UI 테스트 비동기적으로 바뀌는 컴포넌트 UI 테스트 Async Utilities 함수를 사용 wait 해당 함수를 사용하여 특정 콜백에서 에러를 발생하지 않을때까지 대기 timeout을 초과하면 테스트 실패(timeout 기본값 4500ms, 커스터마이징가능) 리액트 16.8 버전 버그있음 waitForElement 해당 함수로 특정 엘리먼트의 변화가 생길때까지 대기(show, hide, change..) 프로미스가 끝날때 선택한 엘리먼트 resolve waitForDomChange 해당 함수 특징으로 콜백함수가 아닌 검사하고 싶은 엘리먼트를 넣어주면 해당 엘리먼트 변화가 발생할때까지..

TDD의 소개 TDD(Test Driven Development : 테스트 주도 개발) 테스트가 개발을 이끌어나가는 형태의 개발론 테스트 코드 작성, 후 구현 사이클을 반복적으로 돈다. ->실패->성공->리팩터링- 실패 실패하는 테스트 케이스를 먼저 생성 성공 실패하는 테스트 케이스를 통과시키기 위한 통과 코드를 작성 리팩토링 중복 코드등의 코드 개선 테스트 케이스가 성공하는지 확인하기 위해 첫번째 절차인 실패로 돌아가서 테스트 케이스를 작성 TDD 장점 작은 단위로 테스트 케이스를 만들기 때문에 코드의 모듈화가 자연스럽다. 테스트 커버리지가 높아지면 리팩토링, 유지보수가 쉬워진다. 프로젝트 퀄리티가 좋아진다. 협업에 도움이된다. 버그를 줄일 수 있다. 요구사항 충족을 확인하기 쉽다. 원본 https:/..