Cypress 기본적인 사용 방법, 주로 사용하는 함수 등 정리 Cypress 설치 시 기본 폴더 구조 (v10.6.0 기준) downloads 테스트 실행 중에 다운로드되는 파일이 보관됨. e2e e2e 테스트 파일들을 보관. fixtures 테스트에 사용할 정적 데이터 파일들을 보관. support 공용으로 사용할 함수를 정의하거나, 테스트 전 사전에 실행할 코드를 작성한 파일들을 보관하는 폴더 E2E 테스트에서 주로 사용하는 cy 함수들 1. get login cy.get('[data-cy="login-button"]') Cypress에서 data-cy를 통해 요소를 가져오는 것을 권장하고 있음. 2. visit cy.visit('/home') 해당하는 url로 이동 3. intercept cy...
Cypress를 이용한 회원가입 폼 테스트 이전 1탄에서는 설치 후 간단한 테스트를 통해 Cypress를 살짝 맛보았다. 이번 2탄에서는 Cypress를 이용해 간단한 회원가입 폼을 테스트해보려고 한다. // Form.vue submit {{ email }} {{ password }} 디자인 프레임워크인 Vuetify를 사용중이며, Cypress에서 쉽게 가져오기 위해 data-cy 속성을 지정했다. 해당 속성을 통해 cy.get()으로 해당 요소를 가져올 수 있다. // form.spec.js describe('Form Test', () => { beforeEach(() => { cy.visit('/signup'); }); it('회원가입 폼 작성', () => { cy.get('[data-cy=ema..
- Total
- Today
- Yesterday
- backend
- 포트폴리오
- pinia
- 호이스팅
- JS
- 타입스크립트
- react-query
- react native
- Core Components
- typescript
- Front
- Redux
- CORS
- vue
- e2e
- 자바스크립트
- pagination
- vuex
- composition
- Store
- react
- 퍼블리셔
- Cypress
- react query
- three.js
- vuetify
- vue3
- NUXT
- vue.js
- frontend
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 | 31 |