Cypress

by mindrally97184105b5daNo license269 starsListed Oct 8, 2026Updated Oct 8, 2026Repository updated 5 weeks ago

Cypress end-to-end testing best practices for web applications, covering test structure, commands, and reliability patterns.

Instructions onlySoftware Development
AI-generated overview

Cypress end-to-end testing best practices covering test structure, selectors, commands, and reliability patterns.

What it does
Provides guidance for writing Cypress end-to-end tests for web applications. It covers test structure, element selection, commands and assertions, custom commands, async handling, test isolation, and anti-patterns. It includes illustrative code snippets for selectors, custom commands, and network interception.
When to use it
Use when writing, reviewing, or improving Cypress end-to-end tests for a web application. Helpful for choosing stable selectors, structuring tests, and avoiding flaky patterns.
Requirements
No scripts or special tooling are required beyond the agent; it is instructions only. The guidance assumes a project using Cypress.

Cypress Testing Best Practices

You are an expert in Cypress end-to-end testing.

Core Principles

Test Structure

  • Use descriptive test names that clearly explain expected behavior
  • Organize tests by feature or user flow
  • Keep tests focused on critical user paths
  • Follow the Given-When-Then pattern for clarity

Selecting Elements

  • Prefer data-testid or data-cy attributes for test selectors
  • Use cy.contains() for text-based selection when appropriate
  • Avoid brittle selectors like CSS classes or tag hierarchies
javascript
// Recommendedcy.get('[data-testid="submit-button"]').click();cy.contains('Submit').click();
// Avoidcy.get('.btn-primary').click();

Commands and Assertions

  • Chain commands fluently for readability
  • Use built-in retry-ability; avoid explicit waits
  • Prefer .should() assertions over .then() for automatic retries
  • Use .within() to scope commands to a specific element

Custom Commands

  • Create custom commands for repeated actions
  • Place custom commands in cypress/support/commands.js
  • Document custom commands with JSDoc comments
javascript
Cypress.Commands.add('login', (email, password) => {  cy.session([email, password], () => {    cy.visit('/login');    cy.get('[data-testid="email"]').type(email);    cy.get('[data-testid="password"]').type(password);    cy.get('[data-testid="submit"]').click();    cy.url().should('include', '/dashboard');  });});

Handling Async Operations

  • Cypress commands are automatically queued; don't mix with async/await
  • Use cy.intercept() to mock or wait for network requests
  • Use cy.wait() with aliases, not arbitrary timeouts
javascript
cy.intercept('GET', '/api/users').as('getUsers');cy.visit('/users');cy.wait('@getUsers');cy.get('[data-testid="user-list"]').should('be.visible');

Test Isolation

  • Each test should be independent and repeatable
  • Use beforeEach hooks for setup
  • Use cy.session() for efficient authentication

Anti-Patterns to Avoid

  • Using cy.wait(5000) with arbitrary timeouts
  • Testing third-party sites you don't control
  • Writing overly long tests that test multiple features
  • Relying on the state from previous tests

Source and attribution

Source:mindrally/skillsincypressat commit9718410

License: No license

Content belongs to its original authors. SourceWeft indexes it from a public repository.

Report or request removal