Cypress E2E Testing

End-to-end testing with Cypress commands and assertions.

Installation & Setup

Install Cypress
npm install --save-dev cypress

Open Cypress
npx cypress open

Run tests headless
npx cypress run

Add to package.json
"scripts": {
  "cypress:open": "cypress open",
  "cypress:run": "cypress run"
}

Basic Commands

Visit page
cy.visit(https://example.com)

Get elements
cy.get(.btn-primary)
cy.get(#username)
cy.get([data-test=submit])

Find elements
cy.get(.list).find(li)
cy.contains(Submit)

Filter elements
cy.get(li).first()
cy.get(li).last()
cy.get(li).eq(2)

Interactions

Click
cy.get(button).click()
cy.get(a).click({ force: true })

Type
cy.get(input).type(Hello World)
cy.get(input).clear().type(New text)

Select
cy.get(select).select(Option 1)

Check/Uncheck
cy.get(checkbox).check()
cy.get(checkbox).uncheck()

Assertions

Should assertions
cy.get(h1).should(be.visible)
cy.get(input).should(have.value, text)
cy.get(.list).should(have.length, 3)

Contains
cy.get(div).should(contain, Success)

Exist/Not exist
cy.get(.modal).should(exist)
cy.get(.error).should(not.exist)

URL assertions
cy.url().should(include, /dashboard)
cy.url().should(eq, https://example.com/)