What is Cypress and why is it used for test automation?

Q: What is Cypress and why is it used for test automation?

What is Cypress? Cypress is a modern, JavaScript-based end-to-end testing framework that runs directly inside the browser — unlike Selenium which communicates via WebDriver from outside the browser. Key Features ┌─────────────────────────────────────────────────────┐ │ Cypress Architecture │ │ │ │ Test Code (JS/TS) ←→ Node.js Process │ │ ↕ ↕ │ │ Browser Engine ←→ Cypress Runner │ │ (Chrome/Firefox/Edge) (same origin) │ └─────────────────────────────────────────────────────┘ - No WebDriver — runs directly in the browser (same run loop as your app) - Automatic Waiting — no explicit waits/sleeps

Answer

What is Cypress?

Cypress is a modern, JavaScript-based end-to-end testing framework that runs directly inside the browser — unlike Selenium which communicates via WebDriver from outside the browser.

Key Features

CODE

┌─────────────────────────────────────────────────────┐
│                   Cypress Architecture               │
│                                                     │
│   Test Code (JS/TS)  ←→  Node.js Process           │
│          ↕                      ↕                   │
│      Browser Engine  ←→  Cypress Runner             │
│   (Chrome/Firefox/Edge)   (same origin)             │
└─────────────────────────────────────────────────────┘

✓No WebDriver — runs directly in the browser (same run loop as your app)
✓Automatic Waiting — no explicit waits/sleeps needed; Cypress retries until elements are ready
✓Real-time Reloading — tests reload automatically on save
✓Time Travel — hover over each step in the Cypress GUI to see exactly what happened
✓Network Control — intercept and stub API calls with cy.intercept()
✓Screenshots & Videos — automatic on failure
✓Built-in Assertions — Chai, Sinon, jQuery matchers included

Installation

Bash

# Install via npm
npm install cypress --save-dev

# Open Cypress Test Runner (GUI)
npx cypress open

# Run headlessly (CI/CD)
npx cypress run

Basic Test Structure

JavaScript

// cypress/e2e/login.cy.js

describe('Login Page', () => {

  beforeEach(() => {
    cy.visit('https://automateqa.online/login');
  });

  it('should login with valid credentials', () => {
    cy.get('#email').type('test@example.com');
    cy.get('#password').type('Password123');
    cy.get('[data-testid="login-btn"]').click();
    cy.url().should('include', '/dashboard');
    cy.get('h1').should('contain', 'Welcome');
  });

  it('should show error for invalid credentials', () => {
    cy.get('#email').type('wrong@email.com');
    cy.get('#password').type('wrongpass');
    cy.get('[data-testid="login-btn"]').click();
    cy.get('.error-message').should('be.visible').and('contain', 'Invalid credentials');
  });
});

Cypress vs Selenium — Quick Comparison

Feature	Cypress	Selenium
Language	JavaScript/TypeScript only	Java, Python, C#, JS...
Architecture	In-browser	WebDriver (external)
Auto-wait	Yes	No (explicit waits needed)
Speed	Fast	Slower
iframes / tabs	Limited	Full support
Mobile testing	No	Yes (Appium)
API testing	Yes (cy.request)	No

Supported Browsers

▸Chrome, Firefox, Edge, Electron (default), and Webkit (Safari-like via Playwright bridge)