Cypress
Cypress란 E2E (End To End) 테스트를 위한 오픈 소스 도구로, 사용자의 입장에서 사용자에게 직접 노출되는 부분을 점검한다. E2E 테스트뿐만 아니라, 단위 테스트와 통합 테스트까지 가능하다. Chrome과 Electron만 지원한다. Multi-tab을 지원하지 않기 때문에, 테스트 페이지가 새로운 탭으로 리다이렉트 되는 경우에는 테스트를 진행할 수 없다는 단점이 있다.
설치
// npm
npm install cypress --save-dev
// yarn
yarn add cypress --dev
cypress 파일 생성 및 실행
cypress open
테스트 파일 작성
//cypress/integration/test.js // cypress/integration 폴더 안에 생성
describe('My First Test', () => { // 'My First Test' = 테스트 이름
it('Does not do much!', () => { // 'Does not do much!' = 함수 이름
expect(true).to.equal(true) // expect(A).to.equal(B) = A와 B가 같으면 테스트 통과
})
})
테스트 파일 작성: 요소 클릭하기
describe('My First Test', () => {
it('clicks the link "type"', () => {
cy.visit('https://example.cypress.io')
cy.contains('type').click()
})
})
테스트 실행
cypress run --browser chrome
공식 문서
Why Cypress? | Cypress Documentation
What you'll learn What Cypress is and why you should use it Our mission, and what we believe in Key Cypress features Types of tests Cypress is designed
docs.cypress.io
https://github.com/cypress-io/cypress
GitHub - cypress-io/cypress: Fast, easy and reliable testing for anything that runs in a browser.
Fast, easy and reliable testing for anything that runs in a browser. - GitHub - cypress-io/cypress: Fast, easy and reliable testing for anything that runs in a browser.
github.com
'웹_프론트엔드 > 로드맵 챌린지' 카테고리의 다른 글
타입 검사 - TypeScript (타입스크립트) (0) | 2022.03.17 |
---|---|
테스트 프레임워크 - Enzyme (0) | 2022.03.16 |
테스트 프레임워크 - react-testing-library (0) | 2022.03.14 |
테스트 프레임워크 - Jest (0) | 2022.03.11 |
CSS 프레임워크 - Bulma (0) | 2022.03.10 |