cypress

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

When to use this skill

何时使用本技能

Use this skill whenever the user wants to:

Set up Cypress for end-to-end testing
Write Cypress test cases
Configure Cypress for component testing
Integrate Cypress with CI/CD pipelines
Use Cypress commands and assertions
Debug Cypress tests
Optimize Cypress test performance
Migrate from other testing frameworks to Cypress
Use Cypress with different frameworks (React, Vue, Angular, Svelte)
Configure Cypress for different environments

当用户有以下需求时，可使用本技能：

为端到端测试搭建Cypress环境
编写Cypress测试用例
配置Cypress以进行组件测试
将Cypress与CI/CD流水线集成
使用Cypress命令与断言
调试Cypress测试
优化Cypress测试性能
从其他测试框架迁移至Cypress
在不同框架（React、Vue、Angular、Svelte）中使用Cypress
为不同环境配置Cypress

How to use this skill

如何使用本技能

This skill is organized to match the Cypress official documentation structure (https://docs.cypress.io/app/get-started/why-cypress, https://docs.cypress.io/api/table-of-contents). When working with Cypress:

Identify the topic from the user's request:
- Getting Started/快速开始 →
```
examples/get-started/
```
- Core Concepts/核心概念 →
```
examples/core-concepts/
```
- Component Testing/组件测试 →
```
examples/component-testing/
```
- End-to-End Testing/E2E测试 →
```
examples/end-to-end-testing/
```
- Continuous Integration/持续集成 →
```
examples/continuous-integration/
```
- Guides/指南 →
```
examples/guides/
```
- References/参考 →
```
examples/references/
```
- API Reference/API 参考 →
```
api/
```

Load the appropriate example file from the

examples/

directory:

Getting Started (快速开始) -

examples/get-started/

```
examples/get-started/install-cypress.md
```
```
examples/get-started/open-the-app.md
```
```
examples/get-started/why-cypress.md
```

Core Concepts (核心概念) -

examples/core-concepts/

examples/core-concepts/best-practices.md

examples/core-concepts/interacting-with-elements.md

examples/core-concepts/introduction-to-cypress.md

```
examples/core-concepts/open-mode.md
```
```
examples/core-concepts/retry-ability.md
```

examples/core-concepts/test-isolation.md

```
examples/core-concepts/testing-types.md
```

examples/core-concepts/variables-and-aliases.md

examples/core-concepts/writing-and-organizing-tests.md

Component Testing (组件测试) -

examples/component-testing/

examples/component-testing/angular/api.md

examples/component-testing/angular/examples.md

examples/component-testing/angular/overview.md

examples/component-testing/component-framework-configuration.md

examples/component-testing/custom-frameworks.md

examples/component-testing/get-started.md

```
examples/component-testing/react/api.md
```

examples/component-testing/react/examples.md

examples/component-testing/react/overview.md

examples/component-testing/styling-components.md

examples/component-testing/svelte/api.md

examples/component-testing/svelte/examples.md

examples/component-testing/svelte/overview.md

```
examples/component-testing/vue/api.md
```

examples/component-testing/vue/examples.md

examples/component-testing/vue/overview.md

End-to-End Testing (E2E测试) -

examples/end-to-end-testing/

examples/end-to-end-testing/testing-your-app.md

examples/end-to-end-testing/writing-your-first-end-to-end-test.md

Continuous Integration (持续集成) -

examples/continuous-integration/

examples/continuous-integration/aws-codebuild.md

examples/continuous-integration/bitbucket-pipelines.md

examples/continuous-integration/circleci.md

examples/continuous-integration/github-actions.md

examples/continuous-integration/gitlab-ci.md

examples/continuous-integration/overview.md

Guides (指南) -

examples/guides/

examples/guides/accessibility-testing.md

examples/guides/authentication-testing/amazon-cognito-authentication.md

examples/guides/authentication-testing/auth0-authentication.md

examples/guides/authentication-testing/azure-active-directory-authentication.md

examples/guides/authentication-testing/google-authentication.md

examples/guides/authentication-testing/okta-authentication.md

examples/guides/authentication-testing/social-authentication.md

```
examples/guides/conditional-testing.md
```

examples/guides/cross-browser-testing.md

```
examples/guides/cross-origin-testing.md
```
```
examples/guides/cypress-studio.md
```
```
examples/guides/debugging.md
```

examples/guides/migration/protractor-to-cypress.md

examples/guides/migration/selenium-to-cypress.md

```
examples/guides/network-requests.md
```

examples/guides/screenshots-and-videos.md

examples/guides/stubs-spies-and-clocks.md

```
examples/guides/test-retries.md
```

References (参考) -

examples/references/

examples/references/advanced-installation.md

```
examples/references/assertions.md
```

examples/references/bundled-libraries.md

```
examples/references/changelog.md
```

examples/references/client-certificates.md

```
examples/references/command-line.md
```
```
examples/references/configuration.md
```

examples/references/content-security-policy.md

examples/references/environment-variables.md

```
examples/references/error-messages.md
```
```
examples/references/experiments.md
```

examples/references/launching-browsers.md

```
examples/references/migration-guide.md
```
```
examples/references/module-api.md
```

examples/references/proxy-configuration.md

```
examples/references/recipes.md
```
```
examples/references/roadmap.md
```
```
examples/references/trade-offs.md
```
```
examples/references/troubleshooting.md
```

Other Sections:

```
examples/faq.md
```
```
examples/plugins/plugins-guide.md
```
```
examples/plugins/plugins-list.md
```
```
examples/tooling/IDE-integration.md
```
```
examples/tooling/code-coverage.md
```
```
examples/tooling/reporters.md
```
```
examples/tooling/typescript-support.md
```
```
examples/tooling/visual-testing.md
```

Reference API documentation in the

api/

directory when needed:

Commands API -

api/commands/

```
api/commands/and.md
```
```
api/commands/as.md
```
```
api/commands/blur.md
```
```
api/commands/check.md
```
```
api/commands/children.md
```
```
api/commands/clear.md
```
```
api/commands/clearallcookies.md
```
```
api/commands/clearalllocalstorage.md
```
```
api/commands/clearallsessionstorage.md
```
```
api/commands/clearcookie.md
```
```
api/commands/clearcookies.md
```
```
api/commands/clearlocalstorage.md
```
```
api/commands/click.md
```
```
api/commands/clock.md
```
```
api/commands/closest.md
```
```
api/commands/contains.md
```
```
api/commands/dblclick.md
```
```
api/commands/debug.md
```
```
api/commands/document.md
```
```
api/commands/each.md
```
```
api/commands/end.md
```
```
api/commands/eq.md
```
```
api/commands/exec.md
```
```
api/commands/filter.md
```
```
api/commands/find.md
```
```
api/commands/first.md
```
```
api/commands/fixture.md
```
```
api/commands/focus.md
```
```
api/commands/focused.md
```
```
api/commands/get.md
```
```
api/commands/getallcookies.md
```
```
api/commands/getalllocalstorage.md
```
```
api/commands/getallsessionstorage.md
```
```
api/commands/getcookie.md
```
```
api/commands/getcookies.md
```
```
api/commands/go.md
```
```
api/commands/hash.md
```
```
api/commands/hover.md
```
```
api/commands/intercept.md
```
```
api/commands/invoke.md
```
```
api/commands/its.md
```
```
api/commands/last.md
```
```
api/commands/location.md
```
```
api/commands/log.md
```
```
api/commands/mount.md
```
```
api/commands/next.md
```
```
api/commands/nextall.md
```
```
api/commands/nextuntil.md
```
```
api/commands/not.md
```
```
api/commands/origin.md
```
... and 43 more command files

Cypress API -

api/cypress-api/

```
api/cypress-api/arch.md
```
```
api/cypress-api/browser.md
```
```
api/cypress-api/catalog-of-events.md
```
```
api/cypress-api/config.md
```
```
api/cypress-api/cookies.md
```
```
api/cypress-api/currentretry.md
```
```
api/cypress-api/currenttest.md
```
```
api/cypress-api/custom-commands.md
```
```
api/cypress-api/custom-queries.md
```
```
api/cypress-api/cypress-log.md
```
```
api/cypress-api/dom.md
```
```
api/cypress-api/element-selector-api.md
```
```
api/cypress-api/ensure.md
```
```
api/cypress-api/env.md
```
```
api/cypress-api/isbrowser.md
```
```
api/cypress-api/iscy.md
```
```
api/cypress-api/keyboard-api.md
```
```
api/cypress-api/platform.md
```
```
api/cypress-api/require.md
```
```
api/cypress-api/screenshot-api.md
```
```
api/cypress-api/session.md
```
```
api/cypress-api/spec.md
```
```
api/cypress-api/stop.md
```
```
api/cypress-api/testing-type.md
```
```
api/cypress-api/version.md
```

Node Events API -

api/node-events/

```
api/node-events/after-run-api.md
```
```
api/node-events/after-screenshot-api.md
```
```
api/node-events/after-spec-api.md
```
```
api/node-events/before-run-api.md
```
```
api/node-events/before-spec-api.md
```
```
api/node-events/browser-launch-api.md
```
```
api/node-events/configuration-api.md
```
```
api/node-events/overview.md
```
```
api/node-events/preprocessors-api.md
```

Utilities API -

api/utilities/

```
api/utilities/$.md
```
```
api/utilities/_.md
```
```
api/utilities/blob.md
```
```
api/utilities/buffer.md
```
```
api/utilities/minimatch.md
```
```
api/utilities/promise.md
```
```
api/utilities/sinon.md
```

Table of Contents -

api/table-of-contents/

Follow the specific instructions in that example file for syntax, structure, and best practices

Important Notes:
- All examples follow Cypress best practices
- Examples include both JavaScript and TypeScript versions where applicable
- Each example file includes parameters, returns, common errors, best practices, and scenarios
- Always check the example file for best practices and common patterns
Reference the official documentation when needed:
- Getting Started: https://docs.cypress.io/app/get-started/why-cypress
- API Reference: https://docs.cypress.io/api/table-of-contents

本技能的组织结构与Cypress官方文档结构一致（https://docs.cypress.io/app/get-started/why-cypress, https://docs.cypress.io/api/table-of-contents）。使用Cypress时：

从用户需求中确定主题：

快速开始 →
```
examples/get-started/
```
核心概念 →
```
examples/core-concepts/
```
组件测试 →
```
examples/component-testing/
```
端到端测试（E2E测试） →
```
examples/end-to-end-testing/
```
持续集成 →
```
examples/continuous-integration/
```
指南 →
```
examples/guides/
```
参考 →
```
examples/references/
```
API参考 →
```
api/
```

从
examples/
目录中加载对应的示例文件：

快速开始 -

examples/get-started/

```
examples/get-started/install-cypress.md
```
```
examples/get-started/open-the-app.md
```
```
examples/get-started/why-cypress.md
```

核心概念 -

examples/core-concepts/

examples/core-concepts/best-practices.md

examples/core-concepts/interacting-with-elements.md

examples/core-concepts/introduction-to-cypress.md

```
examples/core-concepts/open-mode.md
```
```
examples/core-concepts/retry-ability.md
```

examples/core-concepts/test-isolation.md

```
examples/core-concepts/testing-types.md
```

examples/core-concepts/variables-and-aliases.md

examples/core-concepts/writing-and-organizing-tests.md

组件测试 -

examples/component-testing/

examples/component-testing/angular/api.md

examples/component-testing/angular/examples.md

examples/component-testing/angular/overview.md

examples/component-testing/component-framework-configuration.md

examples/component-testing/custom-frameworks.md

examples/component-testing/get-started.md

```
examples/component-testing/react/api.md
```

examples/component-testing/react/examples.md

examples/component-testing/react/overview.md

examples/component-testing/styling-components.md

examples/component-testing/svelte/api.md

examples/component-testing/svelte/examples.md

examples/component-testing/svelte/overview.md

```
examples/component-testing/vue/api.md
```

examples/component-testing/vue/examples.md

examples/component-testing/vue/overview.md

端到端测试（E2E测试） -

examples/end-to-end-testing/

examples/end-to-end-testing/testing-your-app.md

examples/end-to-end-testing/writing-your-first-end-to-end-test.md

持续集成 -

examples/continuous-integration/

examples/continuous-integration/aws-codebuild.md

examples/continuous-integration/bitbucket-pipelines.md

examples/continuous-integration/circleci.md

examples/continuous-integration/github-actions.md

examples/continuous-integration/gitlab-ci.md

examples/continuous-integration/overview.md

指南 -

examples/guides/

examples/guides/accessibility-testing.md

examples/guides/authentication-testing/amazon-cognito-authentication.md

examples/guides/authentication-testing/auth0-authentication.md

examples/guides/authentication-testing/azure-active-directory-authentication.md

examples/guides/authentication-testing/google-authentication.md

examples/guides/authentication-testing/okta-authentication.md

examples/guides/authentication-testing/social-authentication.md

```
examples/guides/conditional-testing.md
```

examples/guides/cross-browser-testing.md

```
examples/guides/cross-origin-testing.md
```
```
examples/guides/cypress-studio.md
```
```
examples/guides/debugging.md
```

examples/guides/migration/protractor-to-cypress.md

examples/guides/migration/selenium-to-cypress.md

```
examples/guides/network-requests.md
```

examples/guides/screenshots-and-videos.md

examples/guides/stubs-spies-and-clocks.md

```
examples/guides/test-retries.md
```

参考 -

examples/references/

examples/references/advanced-installation.md

```
examples/references/assertions.md
```

examples/references/bundled-libraries.md

```
examples/references/changelog.md
```

examples/references/client-certificates.md

```
examples/references/command-line.md
```
```
examples/references/configuration.md
```

examples/references/content-security-policy.md

examples/references/environment-variables.md

```
examples/references/error-messages.md
```
```
examples/references/experiments.md
```

examples/references/launching-browsers.md

```
examples/references/migration-guide.md
```
```
examples/references/module-api.md
```

examples/references/proxy-configuration.md

```
examples/references/recipes.md
```
```
examples/references/roadmap.md
```
```
examples/references/trade-offs.md
```
```
examples/references/troubleshooting.md
```

其他章节:

```
examples/faq.md
```
```
examples/plugins/plugins-guide.md
```
```
examples/plugins/plugins-list.md
```
```
examples/tooling/IDE-integration.md
```
```
examples/tooling/code-coverage.md
```
```
examples/tooling/reporters.md
```
```
examples/tooling/typescript-support.md
```
```
examples/tooling/visual-testing.md
```

必要时参考
api/
目录中的API文档:

命令API -

api/commands/

```
api/commands/and.md
```
```
api/commands/as.md
```
```
api/commands/blur.md
```
```
api/commands/check.md
```
```
api/commands/children.md
```
```
api/commands/clear.md
```
```
api/commands/clearallcookies.md
```
```
api/commands/clearalllocalstorage.md
```
```
api/commands/clearallsessionstorage.md
```
```
api/commands/clearcookie.md
```
```
api/commands/clearcookies.md
```
```
api/commands/clearlocalstorage.md
```
```
api/commands/click.md
```
```
api/commands/clock.md
```
```
api/commands/closest.md
```
```
api/commands/contains.md
```
```
api/commands/dblclick.md
```
```
api/commands/debug.md
```
```
api/commands/document.md
```
```
api/commands/each.md
```
```
api/commands/end.md
```
```
api/commands/eq.md
```
```
api/commands/exec.md
```
```
api/commands/filter.md
```
```
api/commands/find.md
```
```
api/commands/first.md
```
```
api/commands/fixture.md
```
```
api/commands/focus.md
```
```
api/commands/focused.md
```
```
api/commands/get.md
```
```
api/commands/getallcookies.md
```
```
api/commands/getalllocalstorage.md
```
```
api/commands/getallsessionstorage.md
```
```
api/commands/getcookie.md
```
```
api/commands/getcookies.md
```
```
api/commands/go.md
```
```
api/commands/hash.md
```
```
api/commands/hover.md
```
```
api/commands/intercept.md
```
```
api/commands/invoke.md
```
```
api/commands/its.md
```
```
api/commands/last.md
```
```
api/commands/location.md
```
```
api/commands/log.md
```
```
api/commands/mount.md
```
```
api/commands/next.md
```
```
api/commands/nextall.md
```
```
api/commands/nextuntil.md
```
```
api/commands/not.md
```
```
api/commands/origin.md
```
... 以及另外43个命令文件

Cypress API -

api/cypress-api/

```
api/cypress-api/arch.md
```
```
api/cypress-api/browser.md
```
```
api/cypress-api/catalog-of-events.md
```
```
api/cypress-api/config.md
```
```
api/cypress-api/cookies.md
```
```
api/cypress-api/currentretry.md
```
```
api/cypress-api/currenttest.md
```
```
api/cypress-api/custom-commands.md
```
```
api/cypress-api/custom-queries.md
```
```
api/cypress-api/cypress-log.md
```
```
api/cypress-api/dom.md
```
```
api/cypress-api/element-selector-api.md
```
```
api/cypress-api/ensure.md
```
```
api/cypress-api/env.md
```
```
api/cypress-api/isbrowser.md
```
```
api/cypress-api/iscy.md
```
```
api/cypress-api/keyboard-api.md
```
```
api/cypress-api/platform.md
```
```
api/cypress-api/require.md
```
```
api/cypress-api/screenshot-api.md
```
```
api/cypress-api/session.md
```
```
api/cypress-api/spec.md
```
```
api/cypress-api/stop.md
```
```
api/cypress-api/testing-type.md
```
```
api/cypress-api/version.md
```

Node事件API -

api/node-events/

```
api/node-events/after-run-api.md
```
```
api/node-events/after-screenshot-api.md
```
```
api/node-events/after-spec-api.md
```
```
api/node-events/before-run-api.md
```
```
api/node-events/before-spec-api.md
```
```
api/node-events/browser-launch-api.md
```
```
api/node-events/configuration-api.md
```
```
api/node-events/overview.md
```
```
api/node-events/preprocessors-api.md
```

工具API -

api/utilities/

```
api/utilities/$.md
```
```
api/utilities/_.md
```
```
api/utilities/blob.md
```
```
api/utilities/buffer.md
```
```
api/utilities/minimatch.md
```
```
api/utilities/promise.md
```
```
api/utilities/sinon.md
```

目录 -

api/table-of-contents/

遵循示例文件中的具体指令，包括语法、结构与最佳实践

重要说明:
- 所有示例均遵循Cypress最佳实践
- 适用时，示例包含JavaScript与TypeScript两种版本
- 每个示例文件均包含参数、返回值、常见错误、最佳实践与应用场景
- 请务必查看示例文件中的最佳实践与通用模式
必要时参考官方文档:
- 快速开始：https://docs.cypress.io/app/get-started/why-cypress
- API参考：https://docs.cypress.io/api/table-of-contents

Best Practices

最佳实践

Use data-cy attributes: Use data-cy attributes for stable, test-friendly selectors
Avoid hard-coded waits: Leverage Cypress's built-in retry-ability instead of cy.wait()
Keep tests isolated: Each test should be independent and not rely on other tests
Use custom commands: Create custom commands for reusable test logic
Follow assertion patterns: Use Cypress's built-in assertions for better error messages
Configure properly: Set up cypress.config.js correctly for your project
Use fixtures: Use fixtures for test data instead of hard-coding values
Component testing: Use component testing for isolated component testing
CI/CD integration: Configure Cypress properly for CI/CD environments
Debug effectively: Use Cypress's debugging tools and commands

使用data-cy属性：使用data-cy属性创建稳定、适合测试的选择器
避免硬编码等待：利用Cypress内置的重试机制，而非使用cy.wait()
保持测试独立性：每个测试应独立运行，不依赖其他测试
使用自定义命令：为可复用的测试逻辑创建自定义命令
遵循断言模式：使用Cypress内置断言以获得更清晰的错误信息
正确配置：为项目正确设置cypress.config.js
使用fixtures：使用fixtures存储测试数据，而非硬编码值
组件测试：使用组件测试进行独立的组件测试
CI/CD集成：为CI/CD环境正确配置Cypress
高效调试：使用Cypress的调试工具与命令

Resources

资源

Official Documentation: https://docs.cypress.io/
Getting Started: https://docs.cypress.io/app/get-started/why-cypress
API Reference: https://docs.cypress.io/api/table-of-contents
GitHub Repository: https://github.com/cypress-io/cypress

官方文档：https://docs.cypress.io/
快速开始：https://docs.cypress.io/app/get-started/why-cypress
API参考：https://docs.cypress.io/api/table-of-contents
GitHub仓库：https://github.com/cypress-io/cypress

Keywords

关键词

Cypress, end-to-end testing, E2E testing, component testing, test automation, browser testing, test framework, assertions, commands, fixtures, CI/CD, continuous integration, test runner, 端到端测试, E2E测试, 组件测试, 测试自动化, 浏览器测试, 测试框架, 断言, 命令, 固定数据, 持续集成, 测试运行器

Cypress、端到端测试、E2E测试、组件测试、测试自动化、浏览器测试、测试框架、断言、命令、fixtures、CI/CD、持续集成、测试运行器