What it is
Cypress is a next-generation front-end testing tool built for the modern web. It allows developers to write end-to-end, integration, and unit tests for web applications with fast, reliable, and easy-to-debug tests.
Cypress allows you to write tests in JavaScript using a simple, readable syntax. It provides automatic waiting for commands, real-time reloads, time-travel debugging, and screenshots or video recording of test runs.
- Licence
- MIT
- Watch for
- Runs inside the browser, which is why cross-origin and tab handling are limited
When to use it
The question documentation cannot answer for you — because it cannot recommend something else.
Reach for it when
- You value the interactive runner — watching tests execute and stepping through them is genuinely excellent
- Testing a single-origin application where its constraints do not bite
Look elsewhere when
- You need multiple tabs, multiple origins or true cross-browser coverage — Playwright handles these better
- Test suite runtime matters at scale
Installation
npm install cypress --save-devGetting started
The smallest useful thing you can do with it, and what each part means.
describe('My First Test', () => {
it('Visits the Kitchen Sink', () => {
cy.visit('https://example.cypress.io')
cy.contains('type').click()
cy.url().should('include', '/commands/actions')
})
})describe('Input Test', () => {
it('Types into an input', () => {
cy.visit('https://example.cypress.io/commands/actions')
cy.get('.action-email').type('hello@example.com').should('have.value', 'hello@example.com')
})
})Advanced usage
Where the library earns its place over a simpler alternative.
cy.intercept('GET', '/users', { fixture: 'users.json' }).as('getUsers')
cy.visit('/users')
cy.wait('@getUsers')Cypress.Commands.add('login', (email, password) => {
cy.get('#email').type(email)
cy.get('#password').type(password)
cy.get('button[type=submit]').click()
})
// usage in a test
cy.login('user@example.com', 'password123')cy.get('input[type=file]').attachFile('example.json')cy.get('.todo-list li').should('have.length', 3).and('contain', 'Buy milk')Errors and fixes
The failures you are most likely to hit, and what actually resolves them.
- Timed out retrying
- Ensure the element exists before interacting. Use `cy.get()` with `{ timeout: <ms> }` if needed.
- Element is detached from DOM
- Ensure the element is stable before asserting or interacting. Cypress automatically retries, but sometimes waiting for network or animations helps.
- Failed to load resource
- Check network availability, server response, or use `cy.intercept()` to mock the request.
Best practices
- Use `.as()` and `cy.wait()` to manage network requests reliably.
- Leverage custom commands for reusable actions to simplify tests.
- Keep tests isolated and independent for consistent results.
- Use fixtures for consistent test data.
- Run Cypress in CI environments using headless mode for automated pipelines.
Alternatives
Comparable options, and the reason you would pick one over the other.
Background
Why it exists, and what it was reacting to.
Cypress was created to improve the developer experience for testing web applications. Unlike traditional Selenium-based tools, Cypress runs in the same run-loop as the application, providing faster execution, automatic waiting, and real-time reloads. It is particularly popular for testing React, Vue, Angular, and other modern frontend frameworks.
