Justinaus Blog

Cypress

Cypress 적용 후기

왜 필요

어떠한 작업 후 상용 배포 전 최소한의 테스트를 반복 해야했다. 동일한 기본 동작 테스트에 대한 반복적인 시간(돈) 사용. 스트레스.. 최소한의 기능에서 정상 동작을 보장.

왜 Cypress

  • 실제 브라우저 환경에서 사용자 관점의 테스트
  • 디버깅 편의성. 실제 화면에서 히스토리 로그 확인/이동 가능
  • 대세..

Cypress 동작

어디까지 써야하는가

모든 상황을 다 작성하는 건 좋지 않다. 시간 투입 대비 효과도 문제지만, 테스트 코드도 결국 유지보수가 필요하다. 테스트를 위한 테스트는 안된다. 이런 저런 특수 상황은 개발자가 직접 수동 테스트하는 게 맞다. 결론적으로, 반복적인 기본 프로세스만을 작성하기로 결정했다.

시작 전

먼저 중요한 게, 프론트 테스트는 프론트 관점으로 봐야한다. 데이터 관점, 개발자 관점으로 보지 않고, 실제 브라우저에서 사용자 행위 관점으로 봐야한다.

지금 이 블로그로 예를 들면,

  1. 유저가 블로그 진입. 카테고리 메뉴 중 'Tech' 클릭.

    • 주소는 'justinaus.ml/tech'로 변경 되어야 한다.
    • 제목 텍스트가 Category: Tech 여야 한다.
  2. 유자가 하위 리스트 중 첫번째 post를 클릭.

    • 주소는 'justinaus.ml/[첫번째 post 제목]'로 변경 되어야 한다.
    • 댓글 인풋이 정상적으로 노출 되어야 한다.

등등 이런 식.

진행

나는 실제로 상용 배포 전, 작업한 부분 외에 기본 전체 프로세스를 한바퀴 테스트를 했었다. 실제로 반복적으로 수동으로 행했던 테스트만 자동화한다. (사용자 행위 관점)

결과/효과

반복적인 테스트 시간(돈) 세이브. 상용 배포 전 최소한의 동작은 안전하다는 안도감.

주의 사항

실제 코드 변경 시, 테스트가 깨지면 안된다. 영향을 최대한 받지 않도록 테스트 코드를 작성하는 게 좋다.

프론트 테스트 참고 글


Justinaus

Written by Justinausgithub.com/justinaus