Cypress를 사용하여 E2E 테스트 코드와 CI/CD를 학습 및 실습해보는 프로젝트 입니다. 프로젝트 실습을 위해 React를 사용하여 간단한 TodoList를 구현하였습니다.
| Broser |
- Chrome - 버전 126.0.6478.127(공식 빌드) (64비트) - Edge - 버전 126(64비트) |
| Test Device | - PC - Web |
| Test URL | - http://localhost:3000/ |
- 할 일 추가
- 사용자는 입력 필드를 통해 새로운 할 일을 추가할 수 있습니다.
- Enter 키를 누르거나 '추가' 버튼을 클릭하여 새로운 할 일을 추가할 수 있습니다.
- 할 일은 최대 100자 입력 가능하며 한글, 영어, 특수문자, 숫자가 모두 입력 가능하다.
- 할 일이 너무 긴경우 ...으로 줄여들며 마우스 오버시 ToolTip으로 보여진다.
- 할 일의 개수가 많아진 경우 스크롤로 표시 된다.
- 할 일 수정
- 사용자는 Edit 버튼을 클릭해 Edit 모달에서 작성한 내용을 변경할 수 있습니다.
- Edit 모달에서는 내용을 수정하고 [저장] 버튼 혹은 [Enter]키를 통해 변경 사항을 저장할 수 있습니다.
- ESC 키를 눌러 편집 모달을 종료할 수 있습니다.
- "[X]" 버튼을 클릭하여 편집 모달을 종료할 수 있습니다.\
- 아무런 데이터를 입력 하지 않고 저장을 했을 경우에는 이전 데이터를 유지합니다.
- 할 일 삭제
- 각 할 일 항목 옆에 있는 삭제 버튼을 클릭하여 해당 항목을 삭제할 수 있습니다.
- 할 일 완료/미완료
- 각 할 일 항목을 클릭하여 완료 상태로 변경할 수 있습니다.
- 완료된 할 일은 취소선이 나타나며, 다시 클릭하여 미완료 상태로 변경할 수 있습니다.
Git Action을 사용해 작성한 E2E테스트 코드를 수행합니다.