Cypress입문~인스톨부터 기동까지~

시작에 앞서

올해부터 프론트 개발에 입문하게 되었습니다. 지금까지 백엔드 개발을 해 왔습니다만, 필자의 목표는 풀스택 엔지니어라 이번이 좋은 기회가 될 것이라 생각합니다.
프론트 개발에 입문하게 되면서 지금까지 경험하지 않은 툴이나 기술을 접하게 되었습니다만, 그 가운데 흥미가 생긴 것들을 차근히 정리해 나가볼까합니다. 그럼, 그 첫 시작될 테스트 툴인 사이프레스 Cypress를 함께 알아가 보도록 합시다.

Cypress란？

https://www.cypress.io

JavaScript End to End Testing Framework

Cypress는 테스트를 자동화하는 JavaScript의 프레임 워크로, E2E test, 통합 테스트（Integration test）, 단위 테스트（Unit test）에 사용됩니다. 또한 테스트 결과의 영상, 캡쳐등을 자동으로 작성해 주며, 대쉬보드를 통해 테스트 리포트 작성이나 다른 멤버들 과의 공유도 가능케 합니다.

E2E test란？

E2E test란 "End to End Test"의 줄임말로, 엔드유저의 시점에서 테스트하는 방식을 말합니다. E2E test에서는 유저의 실제 사용에 있어서의 work flow를 상정, 그 상정한 결과대로의 움직임이나 결과가 나오는지 확인합니다.

인스톨

Cypress를 이용하고자 하는 디렉토리에 인스톨 합니다. 인스톨에는 npm나 yarn커멘드를 이용하면 됩니다.

npm install cypress 

기동

터미널을 열어, 인스톨이 완료된 디렉토리로 이동해 이하의 커멘드를 실행해 봅시다.

npx cypress open

커멘드를 실행하면 아래와 같은 문구가 표시되며, cypress의 대쉬보드가 열립니다.

It looks like this is your first time using Cypress: 9.7.0

✔  Verified Cypress! /Users/juhyanglee/Library/Caches/Cypress/9.7.0/Cypress.app

Opening Cypress...

이걸로 Cypress의 첫 기동이 성공하였습니다!
다음 포스팅은 테스트의 작성과 테스트 리포트의 확인 방법에 대해 알아보도록 합시다.
여기까지 읽어 주셔서 감사합니다.