본문 바로가기
728x90
반응형

e2e3

Cypress - 모바일 테스트 cypress 반응형 테스트 웹개발을 진행하다보면 다양한 기기 사이즈에 맞춰서 반응형을 작업해야하는 경우가 많다. 사이즈가 줄어들어 css 깨져버리거나 보기에 불편한 경우가 많다. 일반적으로 css로만 적절히 조정하는 경우에는 테스트가 필요하지않겠지만 아예 화면이 변경되는 경우에는 직접 조정하며 테스트를 해야할 경우도 많다. cypress에서는 반응형 테스트를 위한 viewport 지정도 지원하므로 손쉽게 반응형 테스트가 가능하다. viewport를 사용하여 다양한 반응형 테스트가 가능하다 visible 테스트 → should(’be.visible’) css 테스트 → should(’have.css’) cy.viewport('macbook-15') //직접 기기로 뷰포트 변경도되며 cy.viewport(.. 2022. 11. 19.
Cypress 파일 업로드테스트 진행하는 프로젝트에 텍스트 에디터가 있어 파일 업로드를 테스트가 필요햇는데 하단의 에러 메세지와 같이 유저가 직접 진행하는 게 아니기때문에 파일 업로드 버튼을 클릭하는 이벤트는 진행이 불가능 했다. File chooser dialog can only be shown with a user activation. 하지만 그럴리가 없다. 방법을 찾아보자 https://www.cypress.io/blog/2022/01/19/uploading-files-with-selectfile/ 역시 구글 최고다 우선 파일을 cypress프로젝트 내에 넣어주어야하므로 이미지 파일을 해당 경로에 넣어주자 cypress/fixtures/ (경로는 다른곳으로해도 크게 상관은 없겠지만..!) readFile로 파일을 읽는다 selec.. 2022. 10. 13.
Cypress로 e2e 테스트 코드 작성하기 - 시작하기 api 코드를 테스트 할때는 mocha, jest 로 진행을 해본 적이 있는데 프론트에서는 매번 테스트를 직접 진행했었다. 사실 테스트 코드를 짤만큼의 여유가 없기도 했지만,,변명 ㅎ 회사 프로젝트를 진행하면서 생각보다 빨리 작업이 끝나서 남는 시간에 드디어 테스트 코드를 작성해 볼 수 있었다. 사실 테스트 코드도 개발 진행사항에 포함되어야한다고 생각한다. 조금 더 완성도 높은 코드가 작성 될 수 있다. 앞으로는 테스트 코드 완료 일정까지 태스크 관리를 할 예정이다. E2E 테스트란 End to End 테스트로 사용자 입장에서 해당 소프트웨어를 테스트 하는 방법이다. 즉, ui/ux 기반의 테스트가 될 수 있다. e2e 프레임워크로는 cypress / selenium / testCafe / nightwa.. 2022. 9. 30.
728x90
반응형