Cypress Introduction

Cypress is a testing tool for web applications. It runs directly inside a browser and checks whether your website works the way you expect. Developers and testers use it to catch bugs before real users see them. The tool writes tests in JavaScript, a language most web developers already know.

What Cypress Does

Cypress opens a real browser and controls it like a user would. It clicks buttons, fills forms, and reads text from the page. It then compares what it sees against what you told it to expect. If the page matches your expectation, the test passes. If not, Cypress shows you exactly where the mismatch happened.

Why Teams Use Cypress

Manual testing takes time and misses edge cases. A tester can forget to check a button after a code change. Cypress runs the same checks every time without getting tired. Teams add Cypress tests to their build process, so every code change gets tested automatically.

A Simple Analogy

Think of Cypress as a robot inspector on a factory line. The robot picks up each product, checks its shape, checks its color, and checks its weight. It flags any product that fails the check. Cypress does the same job for a website: it checks buttons, checks text, and checks page behavior.

How Cypress Fits Into Testing

Your Website
     |
     v
Cypress opens the browser
     |
     v
Cypress clicks, types, and reads the page
     |
     v
Cypress compares results with your expectations
     |
     v
Pass or Fail report

This flow repeats for every test case in your project. A large project may contain hundreds of these flows, each checking a different part of the application.

Where Cypress Runs

Cypress runs on your computer during development. It also runs on build servers during automated pipelines. Some teams run it before every release. Others run it every night to catch problems early.

Key Building Blocks

Commands

Commands tell Cypress what action to perform, such as clicking a button or typing text into a field.

Assertions

Assertions check a condition, such as confirming a message appears after a form submission.

Test Files

Test files group related commands and assertions into a single script that Cypress executes.

A Basic Example

The following script opens a page and checks its title:

describe('Homepage Test', () => {
  it('loads the homepage', () => {
    cy.visit('https://example.com')
    cy.title().should('include', 'Example')
  })
})

This short script performs three actions. It groups the test under a description. It visits a web address. It checks that the page title contains a specific word.

What Makes Cypress Different

Older testing tools controlled the browser from outside. Cypress runs inside the browser alongside your application. This gives it direct access to page elements and network activity. The result is faster and more reliable tests compared to older approaches.

Common Use Cases

Teams use Cypress to test login forms, shopping carts, search bars, and navigation menus. Any feature that a user interacts with can become a Cypress test case.

Key Points

Cypress checks web applications by acting like a real user.
It writes tests in JavaScript inside test files.
Commands perform actions, and assertions check results.
Cypress runs inside the browser for faster and more direct testing.
Teams use it to catch bugs before users find them.

Back to course

Next lesson