vuetify 2

Cypress 사용해보자 2편

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..

Cypress 2021.02.15

Vuetify 설치

✏️ Vuetify란 무엇일까? Vuetify는 UI Components로 편리하게 UI 셋팅을 할 수 있게 해준다. 원래 예전에는 Element UI를 종종 사용했었는데, UI Components의 장점은 편리하지만 단점은 커스텀하기가 조금 까다로울 수 있다는 것이다. Vuetify는 사용했다하기 민망할 정도로 잠깐 사용했기에, 이번에 사용해보며 경험해보려고 한다. ✏️ 설치 우선 Vue3 버전은 2021 3분기에 릴리즈될 예정이라고 하여, 현재는 Vue3 버전 이하에서 사용할 수 있다. 나는 Vue Cli로 Vue2 버전에서 설치를 진행했다. 문서에 기재된 설치 방법 (링크) vue add vuetify 위 명령어를 통해 설치를 진행하게 되면 프리셋을 선택하라는 게 나온다. 나는 Default로 진행..

Vuetify 2021.02.03