skills.rest
etylsarin
etylsarinCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

cypress-testing

Configure Cypress E2E and component tests with CI-ready GitHub Actions.

59|12|Updated Feb 26, 2026
Search Tags:#cypress#e2e-testing#ci#selectors#test-automation#component-testing#cypress-config
One-click install
npx skills add https://github.com/etylsarin/opencastle --skill cypress-testing-etylsarin
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: cypress-testing
Source: https://github.com/etylsarin/opencastle/tree/main/src/orchestrator/plugins/cypress
Command: npx skills add https://github.com/etylsarin/opencastle --skill cypress-testing-etylsarin

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides Cypress end-to-end and component testing patterns, commands, selectors, and CI configuration so teams can reliably write, run, and maintain browser tests without brittle selectors or flaky CI runs.

Core Features & Use Cases

  • Commands & Patterns: Examples for interactive runner, headless CI runs, targeted spec execution, and component-only runs.
  • Test Structure & Support: Recommended file layout for e2e specs, fixtures, support files, and custom commands to create reusable test helpers and sessions.
  • Selector Strategy & Best Practices: Guidance to prefer data-testid and accessible attributes, use cy.intercept and cy.session, avoid fixed waits, and keep tests independent.
  • CI Integration & Configuration: GitHub Actions example, cypress.config.ts recommendations for timeouts, retries, viewport settings, video/screenshot options, and component dev server setup.
  • Use Case: Create authentication and dashboard E2E tests, component tests for UI components, and a CI job that runs tests headlessly with retries.

Quick Start

Create Cypress E2E and component tests for the login and dashboard flows and add a GitHub Actions workflow to run them.

Frequently Asked Questions about cypress-testing

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I set up Cypress E2E tests for a React or Next.js application?▼

Setting up Cypress E2E tests involves creating structured spec files, support files for custom commands, and a cypress.config.ts configuration to define test boundaries and reusable authentication sessions.

What is the best selector strategy for Cypress test automation to avoid brittle tests?▼

The best Cypress selector strategy prioritizes data-testid attributes and accessible roles, ensuring tests remain stable and avoid breaking from DOM or CSS class changes.

How do I run Cypress component tests headlessly in GitHub Actions CI?▼

Running Cypress component tests in GitHub Actions CI requires a headless Chrome setup, retry configurations in cypress.config.ts, and a properly configured component dev server in the workflow.

Does Cypress support session management and network interception for E2E testing?▼

Cypress E2E testing supports session management and network interception using cy.session for reusable login states and cy.intercept for stubbing or spying on network requests.

How to configure cypress.config.ts for timeouts, retries, and viewport settings?▼

Configuring cypress.config.ts for timeouts, retries, and viewport settings involves defining properties in the configuration object to stabilize headless CI runs and match application dimensions.

Related Skills

Explore More Software Engineering Skills→
cenjiecenjie

frontend-testing

Implement frontend tests for React and Vue with Jest, Vitest, React Testing Library, and Cypress.

Community
Intermediate
pacaplanpacaplan
30

flokay:wait-ci

Poll GitHub CI check and pull request review statuses for the current branch.

Community
Advanced
CarlosQ96CarlosQ96

test-setup

Scaffold automated testing infrastructure and CI/CD for a project engine.

Community
Advanced
devopstalesdevopstales
1

playwright

Automate Playwright browser tests and capture screenshots and traces.

Community
Intermediate