← All skills

Cypress Skill

E2e testingJavaScriptTypeScript

Copy and Paste in your Terminal

npx skills add https://github.com/LambdaTest/agent-skills.git --skill cypress-skill

Documentation

Full skill reference (SKILL.md). For more implementation detail, see the Playbook and Advanced patterns tabs.

Cypress Automation Skill

You are a senior QA automation architect specializing in Cypress.

Step 1 — Execution Target

User says "test" / "automate"
│
├─ Mentions "cloud", "TestMu", "LambdaTest", "cross-browser"?
│  └─ TestMu AI cloud via cypress-cli plugin
│
├─ Mentions "locally", "open", "headed"?
│  └─ Local: npx cypress open
│
└─ Ambiguous? → Default local, mention cloud option

Step 2 — Test Type

SignalTypeConfig
"E2E", "end-to-end", page URLE2E testcypress/e2e/
"component", "React", "Vue"Component testcypress/component/
"API test", "cy.request"API test via Cypresscypress/e2e/api/

Core Patterns

Command Chaining — CRITICAL

// ✅ Cypress chains — no await, no async
cy.visit('/login');
cy.get('#username').type('user@test.com');
cy.get('#password').type('password123');
cy.get('button[type="submit"]').click();
cy.url().should('include', '/dashboard');

// ❌ NEVER use async/await with cy commands
// ❌ NEVER assign cy.get() to a variable for later use

Selector Priority

1. cy.get('[data-cy="submit"]')     ← Best practice
2. cy.get('[data-testid="submit"]') ← Also good
3. cy.contains('Submit')            ← Text-based
4. cy.get('#submit-btn')            ← ID
5. cy.get('.btn-primary')           ← Class (fragile)

Anti-Patterns

BadGoodWhy
cy.wait(5000)cy.intercept() + cy.wait('@alias')Arbitrary waits
const el = cy.get()Chain directlyCypress is async
async/await with cyChain .then() if neededDifferent async model
Testing 3rd party sitesStub/mock insteadFlaky, slow
Single beforeEach with everythingMultiple focused specsBetter isolation

Basic Test Structure

describe('Login', () => {
  beforeEach(() => {
    cy.visit('/login');
  });

  it('should login with valid credentials', () => {
    cy.get('[data-cy="username"]').type('user@test.com');
    cy.get('[data-cy="password"]').type('password123');
    cy.get('[data-cy="submit"]').click();
    cy.url().should('include', '/dashboard');
    cy.get('[data-cy="welcome"]').should('contain', 'Welcome');
  });

  it('should show error for invalid credentials', () => {
    cy.get('[data-cy="username"]').type('wrong@test.com');
    cy.get('[data-cy="password"]').type('wrong');
    cy.get('[data-cy="submit"]').click();
    cy.get('[data-cy="error"]').should('be.visible');
  });
});

Network Interception

// Stub API response
cy.intercept('POST', '/api/login', {
  statusCode: 200,
  body: { token: 'fake-jwt', user: { name: 'Test User' } },
}).as('loginRequest');

cy.get('[data-cy="submit"]').click();
cy.wait('@loginRequest').its('request.body').should('deep.include', {
  email: 'user@test.com',
});

// Wait for real API
cy.intercept('GET', '/api/dashboard').as('dashboardLoad');
cy.visit('/dashboard');
cy.wait('@dashboardLoad');

Custom Commands

// cypress/support/commands.js
Cypress.Commands.add('login', (email, password) => {
  cy.session([email, password], () => {
    cy.visit('/login');
    cy.get('[data-cy="username"]').type(email);
    cy.get('[data-cy="password"]').type(password);
    cy.get('[data-cy="submit"]').click();
    cy.url().should('include', '/dashboard');
  });
});

// Usage in tests
cy.login('user@test.com', 'password123');

TestMu AI Cloud

// cypress.config.js
module.exports = {
  e2e: {
    setupNodeEvents(on, config) {
      // LambdaTest plugin
    },
  },
};

// lambdatest-config.json
{
  "lambdatest_auth": {
    "username": "${LT_USERNAME}",
    "access_key": "${LT_ACCESS_KEY}"
  },
  "browsers": [
    { "browser": "Chrome", "platform": "Windows 11", "versions": ["latest"] },
    { "browser": "Firefox", "platform": "macOS Sequoia", "versions": ["latest"] }
  ],
  "run_settings": {
    "build_name": "Cypress Build",
    "parallels": 5,
    "specs": "cypress/e2e/**/*.cy.js"
  }
}

Run on cloud:

npx lambdatest-cypress run

Validation Workflow

  1. No arbitrary waits: Zero cy.wait(number) — use intercepts
  2. Selectors: Prefer data-cy attributes
  3. No async/await: Pure Cypress chaining
  4. Assertions: Use .should() chains, not manual checks
  5. Isolation: Each test independent, use cy.session() for auth

Quick Reference

TaskCommand
Open interactivenpx cypress open
Run headlessnpx cypress run
Run specific specnpx cypress run --spec "cypress/e2e/login.cy.js"
Run in browsernpx cypress run --browser chrome
Component testsnpx cypress run --component
Environment varsCYPRESS_BASE_URL=http://localhost:3000 npx cypress run
Fixturescy.fixture('users.json').then(data => ...)
File uploadcy.get('input[type="file"]').selectFile('file.pdf')
Viewportcy.viewport('iphone-x') or cy.viewport(1280, 720)
Screenshotcy.screenshot('login-page')

Reference Files

FileWhen to Read
reference/cloud-integration.mdLambdaTest Cypress CLI, parallel, config
reference/component-testing.mdReact/Vue/Angular component tests
reference/custom-commands.mdAdvanced commands, overwrite, TypeScript
reference/debugging-flaky.mdRetry-ability, detached DOM, race conditions

Advanced Playbook

For production-grade patterns, see reference/playbook.md:

SectionWhat's Inside
§1 Production ConfigMulti-env configs, setupNodeEvents
§2 Auth with cy.session()UI login, API login, validation
§3 Page Object PatternFluent page classes, barrel exports
§4 Network InterceptionMock, modify, delay, wait for API
§5 Component TestingReact/Vue mount, stubs, variants
§6 Custom CommandsTypeScript declarations, drag-drop
§7 DB Reset & SeedingAPI reset, Cypress tasks, Prisma
§8 Time Controlcy.clock(), cy.tick()
§9 File OperationsUpload, drag-drop, download verify
§10 iframe & Shadow DOMContent access patterns
§11 Accessibilitycypress-axe, WCAG audits
§12 Visual RegressionPercy, cypress-image-snapshot
§13 CI/CDGitHub Actions matrix + Cypress Cloud parallel
§14 Debugging Table11 common problems with fixes
§15 Best Practices15-item production checklist