테스트 코드 작성과 모바일 환경 개선

테스팅 코드를 작성했다.

라이브러리는 cypress를 사용했는데 꽤나 편리하고 좋다.

Cypress에 대한 사용법은 간략하게 test-code카테고리에 업로드 할 예정이다.

 

테스트는 E2E Test로 진행했으며 여기서 E2E란 완성단계에 있는 프로젝트를 직접 동작하면서 진행하는 test이다.

유닛테스트보다는 더 상위단계에 있는 테스트로 애초에 진행할 때 TDD로 하지 않았기 때문에 E2E로 진행했다.

render Test는 접속이 잘 되느냐에 관한 TEST이다.

페이지에 접속하여 Render가 되면 상단 로고인 SniChat을 찾는 코드를 작성했다.

send a message는 실제로 메세지를 보내는 기능인데 핵심기능이라고 할 수 있다.

접속 후 list에 있는 item 중 첫번째 요소를 클릭하여 This is testing이라는 메세지를 보내도록 코드를 작성했다.

 

둘 다 동작이 잘 되어서 뿌듯했다. 아래는 상세 코드이다.

모바일 환경 개선

모바일 환경에서 인풋과 보내기 버튼이 튀어나오는 현상이 있었는데 이를 개선해줬다.

아래 사진은 크롬 에뮬레이터로 작업했다.

 

이제 이 프로젝트는 여기서 마무리하려고 한다.

최근에 TypeScript 공부를 시작했는데, 자바스크립트보다 훨씬 재밌다.

한동안은 TS에 집중할 예정이고 공부한 내용도 간략히 정리해서 포스팅 할 예정이다.

모두들 빡코딩하세요~!!