Cypress - 简介

Cypress - 简介

Cypress 是一款现代的、开源的测试自动化工具，专为当今的 Web 开发构建。它主要用于前端应用的 端到端测试（end-to-end） 和 组件测试（component testing）。Cypress 的开发旨在解决测试自动化中常见的痛点，提供快速、简单、可靠的测试体验。

Cypress 帮助开发团队做到：

• 快速轻松地设置测试。
• 使用 JavaScript 或 TypeScript 编写测试。
• 使用可视化的 Test Runner 交互式地执行测试，或在 CI 中以无头模式（headless）运行。
• 通过详细的错误消息、堆栈跟踪和时间旅行快照（time-traveling snapshots）有效地调试失败。

Cypress 通常与 Selenium 进行比较，但其架构差异很大。它直接在浏览器内部以及与您的应用程序相同的运行循环中执行测试，提供了更大的控制和可见性。

Cypress 功能多样，可用于各种类型的测试：

• 端到端测试（End-to-End / E2E）：模拟跨多个页面的真实用户场景。
• 组件测试（Component tests）：隔离测试单个 UI 组件。
• 集成测试（Integration tests）：验证应用程序不同部分（例如 UI 和 API）之间的交互。
• API 测试（API testing）：直接发出 HTTP 请求测试后端服务。

主要特性

Cypress 提供了一系列丰富的功能，旨在改进测试工作流程：

• 时间旅行调试（Time Travel Debugging）：在 Test Runner 中逐步回溯命令快照，查看应用程序在每个时间点的状态。
• 自动等待（Automatic Waiting）：Cypress 在继续执行之前会自动等待命令和断言，从而消除了大多数由于时序问题导致的 Flaky Test（不稳定测试）。
• 实时重载（Real-time Reloads）：当您保存 spec 文件中的更改时，测试会自动重新运行。
• 网络流量控制（Network Traffic Control）：使用 cy.intercept() 轻松地 Stub、Spy 和修改网络请求和响应。
• 截图和视频（Screenshots and Videos）：失败时自动截图，并提供测试运行视频，便于调试。
• 跨浏览器测试（Cross-browser Testing）：支持 Chrome 系列浏览器（Chrome、Edge、Electron）、Firefox 和 WebKit（实验性）。
• Cypress Dashboard 服务：一项付费服务，提供高级报告、测试并行化、运行分析和 CI 集成。
• 组件测试（Component Testing）：隔离地挂载（mount）和测试您的 Web 组件（React、Vue、Angular 等）。
• 开发者工具调试（Developer Tool Debugging）：直接从浏览器开发者工具调试您的测试。
• 结果一致：由于其架构设计，可实现无 Flake（不稳定）测试。
• 视口尺寸调整（Viewport Sizing）：使用 cy.viewport() 设置视口大小，测试响应式设计。
• 丰富的文档和社区（Documentation and Community）：维护良好的文档和庞大活跃的社区。

注意事项和限制

尽管功能强大，但 Cypress 也有一些需要注意的特点和限制：

• JavaScript/TypeScript 生态系统：测试使用 JavaScript 或 TypeScript 编写，这对于 Web 开发者来说是一个优势，但对于其他人可能需要学习。
• 每个测试一个 Tab 页：每个测试都在单个浏览器 Tab 页中运行。真正的多 Tab 页测试（例如，使用 window.open 打开一个新 Tab 页并控制它）虽然有变通方法，但不如其他一些工具那样原生支持。通常通过移除 target="_blank" 属性来处理打开新 Tab 页的链接。
• 不支持原生移动应用测试：Cypress 用于 Web 应用程序（通过响应式视口支持桌面和移动 Web）。它不支持测试原生 iOS 或 Android 应用；Appium 等工具用于此目的。
• iFrame 支持有限：虽然可以通过插件或自定义命令进行基本的 iFrame 交互，但这比其他一些工具更复杂。
• 服务器端渲染（SSR）的细微差别：测试大量使用 SSR 的应用程序可能需要特定的断言和等待策略。

尽管存在这些限制，Cypress 凭借其开发者友好的体验和强大的功能集，已成为现代 Web 应用程序测试的首选工具。