cypress · mindrally — Claude Code skill: what it does, how to install
Instructs coding agents to generate resilient Cypress end-to-end tests with reliable selectors, network mocks, and proper command queuing.
npx skills add Mindrally/skills --skill cypress -a claude-codeWhat cypress does
The skill configures the model to follow official patterns for browser test suites. It enforces element lookup through data-testid or data-cy attributes and discourages class selectors. Assertions use .should() chains to exploit automatic retries instead of manual polling.
Tests follow the Given-When-Then flow. Reusable actions go into cypress/support/commands.js, using cy.session to cache user credentials between tests. Network calls rely on cy.intercept with aliases rather than fixed time waits.
Mixing async/await with test chains breaks execution because Cypress runs its own internal command queue. Tests must remain fully decoupled.
What it helps with
- replace brittle CSS selectors with
data-testidattributes - isolate test runs using
cy.sessionfor logins - mock and observe HTTP calls via
cy.intercept - eliminate arbitrary sleep timers from test flows
Example prompts for the agent
- Write a Cypress test for user login using
data-testidselectors. - Create a reusable authentication helper in
cypress/support/commands.jsusingcy.session. - Mock the
/api/usersendpoint withcy.interceptand verify the rendered list.
How to install cypress
1Skills CLI (Vercel)
npx skills add Mindrally/skills --skill cypress -a claude-code2Manually: put the files in place
~/.claude/skills/cypress/SKILL.mdCopy the whole skill folder; for one project use .claude/skills/cypress/
1Skills CLI (Vercel)
npx skills add Mindrally/skills --skill cypress -a codex2Manually: put the files in place
.agents/skills/cypress/SKILL.mdFor all projects use ~/.agents/skills/
1Skills CLI (Vercel)
npx skills add Mindrally/skills --skill cypress -a cursor2Manually: put the files in place
.cursor/skills/cypress/SKILL.mdCursor also reads .agents/skills/ and .claude/skills/
1GitHub CLI
gh skill install Mindrally/skills cypress2Manually: put the files in place
.github/skills/cypress/SKILL.md1Skills CLI (Vercel)
npx skills add Mindrally/skills --skill cypress -a gemini-cli2Platform CLI
gemini skills install https://github.com/Mindrally/skills --path cypressManually: put the files in place
.devin/skills/cypress/SKILL.mdThe legacy .windsurf/skills/ path still works
Skills CLI (Vercel)
npx skills add Mindrally/skills --skill cypress -a opencodeClaude.ai
Zip the folder and upload it in Settings → Capabilities → Skills
Step by step, with commands for each platform: How to install skills in Claude Code: five ways
Questions about cypress
How do I install cypress in Claude Code?
Run npx skills add Mindrally/skills --skill cypress -a claude-code in your terminal.
What does the cypress skill do?
It provides end-to-end testing guidelines, favoring stable attributes and preventing anti-patterns like arbitrary sleep timers.
Why does the skill disallow async and await?
Cypress manages an internal execution queue, so combining it with standard JavaScript promises causes sequencing bugs.
Source text
SKILL.md · Apache-2.0
---
name: cypress
description: Cypress end-to-end testing best practices for web applications, covering test structure, commands, and reliability patterns.
metadata:
maintainer: Mindrally
source: https://github.com/Mindrally/skills
---
# 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
// Recommended
cy.get('[data-testid="submit-button"]').click();
cy.contains('Submit').click();
// Avoid
cy.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
© Mindrally · Apache-2.0 · Mindrally/skills
Similar skills
All skills for Testing and QA →cypress by other authors comes first.