🌲 Cypress — Modern End-to-End Test Automation

What you can learn on this page

• 🌲 What is Cypress? Architecture and Philosophy — Cypress runs inside the same process as the browser — like a surgeon operating with their own hands rather than giving instructions to a remote team over a phone: every cut is immediate, every reaction in real time, with zero round-trip delay. But if Selenium
• ⚙️ Installation — Cypress is installed via npm and can run in both GUI mode (Test Runner) and CLI mode (headless). Installation is a single package install — unlike Java, there's no separate driver download hassle (ChromeDriver, geckodriver); Cypress downloads its own browser b
• 🖱️ Basic Commands & Selector Strategy — Every command in Cypress starts with cy and returns a Promise-like but "chainable" object. cy.visit() navigates to a page, cy.get() finds an element by CSS selector, and cy.contains() searches by visible text. These commands are WRITTEN as if synchro
• 🧩 Actions, Forms & Drag & Drop — cy.type(), cy.click(), cy.check(), cy.uncheck(), and cy.select() are the core form actions. All of them are retry-able: they automatically wait until the element is visible, enabled (not disabled), and "actionable" (not covered by another element). I
• 🕐 Time Travel & Retry-ability — Cypress's most beloved feature is "time travel debugging": a DOM snapshot is stored in the background after every command. Once a test finishes (or fails), you can click any past entry in the Command Log to see exactly how the app looked AT THAT MOME
• 🌐 Network & cy.intercept() — cy.intercept() (formerly cy.route(), deprecated since v6) is Cypress's API for capturing the network layer. It can be used in three ways: "stub" the real request by replacing it with fake data, "spy" on the request without modifying it, or
• 🗂️ Writing & Organizing Tests — Think of the describe() / it() structure like a legal document hierarchy: describe() is the case heading (defines the scope of the behavior under scrutiny), and it() is a single individual claim — precise and independent, evaluable on its own regardless of whe
• 🏗️ Framework Architecture (SOLID + POM) — In Selenium and Playwright, at this point you would write a "Page Object Model" class — Cypress's official documentation recommends the OPPOSITE: instead of classic POM classes, it recommends "Custom Commands" and "App Actions". W