Close
AlgoliaLogoLight
Close full mode
logo

Cypress

Git RepositoryEdit on Github

Cypress

  • A complete end-to-end testing experience.
  • All-in-one testing framework, assertion library, with mocking and stubbing, all without Selenium.

Why Cypress

  • Cypress does not use Selenium.
  • Cypress focuses on doing end-to-end testing REALLY well.
  • Cypress works on any front-end framework or website.
  • Cypress tests are only written in JavaScript.
  • Cypress is all in one. Writing end-to-end tests takes a lot of different tools to work together.
  • Cypress is for developers and QA engineers.
  • Cypress runs much, much faster. These architectural improvements unlock the ability to do TDD with full end-to-end tests for the very first time.
  • Slack Integration
  • GitHub Integration
  • Cypress is built for scale, No matter how big (or small) your project

How it works

  • Setup to record tests, See how many tests failed or passed - and how healthy they are. Get the entire stack trace of failed tests. View screenshots taken on test failure.
  • Run in CI, Easily integrate Cypress with your current CI provider. Such as Jenkins, Travis CI, Circle CI, Docker
  • Optimize tests

How to use Cypress

Install Cypress

$npm install cypress

or

$yarn add cypress

Run a Cypress project

// shell command

$npx cypress open
$vi package.json

// package.json

"scripts": {
"cypress:open": "cypress open",
"test": "echo \"Error: no test specified\" && exit 1"
}

// shell command

$npm run cypress:open

or

$yarn run cypress open

Example code to visit Cypress website

Create a new file and edit content:

$touch cypress/integration/example.spec.js

// example.spec.js

describe('My First Test', function() {
it('Visits the Kitchen Sink', function()
cy.visit('https://example.cypress.io')
})
})

Run Cypress with command:

$npm run cypress:open

or

$yarn run cypress open

Example code to visit a website and click something

Create a new file and edit content:

$touch cypress/integration/example.spec.js

// example.spec.js

describe('My First Test', function() {
it('Visits the Kitchen Sink', function()
cy.visit('https://example.cypress.io')
cy.contains('type').click()
})
})

Run Cypress with command:

$npm run cypress:open

or

$yarn run cypress open

Example code to visit a website, enter an email and do assertion

$touch cypress/integration/example.spec.js

// example.spec.js

describe('My First Test', function() {
it('Gets, types and asserts', function() {
cy.visit('https://example.cypress.io')
cy.contains('type').click()
// Should be on a new URL which includes '/commands/actions'
cy.url().should('include', '/commands/actions')
// Get an input, type into it and verify that the value has been updated
cy.get('.action-email')
.should('have.value', '[email protected]')
})
})

// shell command

$npm run cypress:open

Support browsers

  • Chrome
  • Firefox
  • Edge
  • Electron
  • Brave

Useful resources and more examples

Loading comments...