什么是 Cypress Testing?Cypress Automation Testing 指北

简介: 什么是 Cypress Testing?Cypress Automation Testing 指北

Cypress 是一个愈发流行的 Web 测试框架,在 Web 自动化测试方面可以作为老牌自动化测试框架 Selenium 的一个补充。

本文将带你开始使用 Cypress 自动化测试并认识使用 Cypress 进行自动化测试的优势。

什么是 Cypress?

Cypress 是一个基于 JavaScript 的端到端的 Web 测试框架。它支持前端开发和自动化测试工程师使用 JavaScript 来撰写测试脚本,并且 JavaScript 也是 Web 开发的主要语言。使用 JavaScript 使得 Cypress 自动化测试对前端开发人员来说更加便利。

Cypress 可以作为支持多种语言并构建在分布式架构上的 Selenium WebDriver 自动化测试框架的补充,Cypress 的测试执行能力为用户在测试创建阶段带来了很多帮助。

Cypress 的优势

使用 Cypress 的代替其他框架的原因有很多,下面我们来逐一分析:

1. Cypress 是一个更加通用的框架

与其他框架相比 Cypress 是一个更加通用的框架,因为它在 Mocha 和 Chain 的基础上使用 JavaScript 编写,同时也使用了 NodeJS 进行构建。

事实上当 JavaScript 成为 Web 开发的主要原因的时候就愈发显得 Cypress 基于 JavaScript 是多么的重要,Cypress 使用 Web 前端开发者熟悉的语言使得 Cypress 更加容易上手。

使用 Cypress 还可以进行跨浏览器测试,你可以在 FireFox 和以 Chrome 内核为核心的浏览器如 Edge 和 Electron 上执行自动化测试。

2. Cypress 自动化测试环境构建非常简单

使用 Cypress 可以非常简单快速的开始 Web 测试,如果你使用过 Selenium,你就会知道在开始之前需要安装一大堆的依赖,而 Cypress 已经全部将依赖打包好并且无须做任何的配置。

另外,Cypress 与 Chrome 绑定,所以无需任何复杂的环境配置,当然,你也可以使用当前环境中已经安装的其他任意浏览器,相比 Selenium 需要用户下载浏览器相关的 WebDriver 并配置来说效率高出了一大截。

3. Cypress 有强大的调试能力

你可以非常轻松快捷的使用 Cypress 进行 Debug,当测试失败时你会得到一些修复的建议,你可以可以使用 Chrome 的 Devtool 来进行 Debug。Cypress 还支持 Time Travel(查看执行的快照) 和实时加载执行测试用例,因此开发者可以在测试执行前或者执行后查看页面的源代码。

Cypress 还可以访问页面中的每个对象(DOM 对象),并简化了错误分析。Cypress 可以提供错误快照,使得 Debug 更加简单、快速。

Cypress 的特点

  • 时光机(Time Travel):Cypress 可以提供测试运行的快照,可以根据日志或者每行命令来查看应用此时执行的操作。
  • 强大的调试能力(Debuggability):可以在浏览器上直接 Debug,提供了可靠的错误分析以及堆栈信息。
  • 自动等待(Automatic):永远不要在你的测试代码中添加等待后者睡眠时间。Cypress 内置了自动等等待和断言,杜绝了同步问题。
  • Spies,Stubs and Clocks:它可以控制功能,服务响应以及时钟等,这些 unit testing 功能它都涵盖。
  • 网络流量控制:可以轻易的控制网络流量,无需介入服务端
  • 结果一致性:Cypress 的结构中没有涉及到 Selenium 或者 WebDriver,这也就是它更快更可靠的原因
  • 截图和视频:测试失败时会自动截图,或者可以从命令行中获取整个测试套件运行的视频。
  • 更快:Cypress 在浏览器内运行,更快。

4. Cypress 提供了快速执行测试的能力

Cypress 闻名于它的快速执行能力,执行的时间小于 20 MS。Cypress 内置了自动等待,这意味着你不用在代码中添加任何显示或者隐式的等待,它会自动等待如 DOM 加载、事件以及元素...

此外,Cypress 还可以在执行第一个测试后自动运行后续测试。这消除了停机时间和手动触发下一个测试的需要。

5. Cypress 有一个活跃的社区

Cypress 是一个免费的开源的框架,它提供了也提供了付费模式供用户选择。付费模式包括了一些更加强大的特征,如拥有更多组件的 Dashboard、DOM 快照以及视频等一些对 Debug 非常有用的特性。

如果对 Cypress 感兴趣可以关注在 Github、Gitter 以及 StackOverFlow 上关注,另外 Cypress 还提供了丰富的文档。

如何开始使用 Cypress 进行自动化测试

作为在测试领域的领导者,Perfecto 以及全面支持 Cypress 自动化测试框架。Perfecto 使用 Perfecto Cloud 将 Cypress 自动化测试变得更加简单。

使用 Perfecto 和 Cypress 开始自动化测试,执行以下几个步骤即可:

  1. 创建项目文件夹 perfecto-cypress,执行初始化命令,创建 package.json 配置文件
npm init
复制代码

image.png

  1. 安装 Perfecto-Cypress SDK,并在安装完成之后执行初始化命令,生成 perfecto-config.json配置文件

image.png

image.png

除了上面使用到的 init 命令,perfecto-cypress 还支持以下几个命令:

  • Run
  • Pack
  • Upload

image.png

可以通过命令行来查看这几个命令的使用方法:

通过 perfecto-cypress-sdk 你可以在本地命令行中执行你的测试脚本,也通过 artifact key 将测试脚本打包上传到 perfecto cloud 去执行。

下面是 perfecto-cypress run 支持的命令行参数和他们的别名,包括 reporting 的一些命令行参数都是可用的。

image.png

当上传 Cypress 测试套件到 Perfecto Cloud 上时,可以使用以下命令行选项。推荐使用存储在 perfecto-config.json 配置文件中的 Security Token。

image.png

  1. Perfecto 的 Cypress SDK 与 Cypress 完全一样,支持 Chrome、FireFox 以及 Edge 浏览器,在 perfecto 的配置文件中配置运行平台的配置,如下图所示的 perfecto-config.json 配置文件所示:

image.png

plus:以下步骤是在本地执行的测试演示,原文中没有涉及

  1. 执行命令打开 Cypress GUI,命令如下:
npx cypress open
复制代码

进入 Cypress GUI 界面后,进行如下配置:

选择 E2E Testing:

image.png

选择 Cypress 配置文件:

image.png

选择本地的一个浏览器打开 Test Runner 界面:

image.png

创建测试脚本,可以创建示例脚本,也可以创建新的脚本:

image.png

点击 OK 即可。

image.png

接下来双击 todo.cy.js 文件,既可以在 Test Runner 界面运行测试用例了;

image.png

运行结果如下图所示:

image.png

plus:余下内容就是介绍 Perfecto 和 Cypress 的集成,由于 Perfecto Cloud 在国内无法使用,这里不做翻译。


相关文章
|
Java Spring 容器
如何解决spring EL注解@Value获取值为null的问题
本文探讨了在使用Spring框架时,如何避免`@Value("${xxx.xxx}")`注解导致值为null的问题。通过具体示例分析了几种常见错误场景,包括类未交给Spring管理、字段被`static`或`final`修饰以及通过`new`而非依赖注入创建对象等,提出了相应的解决方案,并强调了理解框架原理的重要性。
1001 5
|
API 数据库 开发者
Python微服务框架:Flask与FastAPI的融合创新
在当今高度互联的世界中,构建可扩展、灵活和高效的微服务架构变得至关重要。Python作为一种广泛应用于Web开发的编程语言,其微服务框架Flask和FastAPI的概念与实践日益受到关注。本文将介绍这两个框架的核心概念,并探讨它们在实际应用中的强大功能和优势。
|
30天前
|
人工智能 运维 安全
阿里云GPU服务器全解析:租赁价格、GPU卡规格及问题解答FAQ
阿里云GPU云服务器(EGS)依托高性能GPU芯片与神龙架构,提供弹性灵活、安全稳定的算力支持,广泛适用于AI训练推理、图形渲染、科学仿真等场景。支持多种计费模式与丰富GPU规格,兼顾成本与性能,并集成机密计算、自动运维、生态兼容等核心优势,助力企业高效构建高性能计算环境。
541 1
|
4天前
|
人工智能 弹性计算 安全
2026年一键部署 OpenClaw(原 MoltBot、Clawbot)常见问题与解决方案
OpenClaw(前身为MoltBot、Clawbot)作为2026年爆火的开源AI智能体,凭借本地化部署、多渠道交互及自动化任务处理能力,成为个人与轻量团队的热门工具。然而在实际部署与使用中,用户常因配置操作、权限管理、第三方集成等问题遭遇故障,影响工具正常运行。本文结合阿里云官方指南与实际用户反馈,系统梳理一键部署OpenClaw后的高频问题,提供分场景、可落地的解决方案,同时补充安全风险提示与优化建议,助力用户高效排查故障,保障服务稳定。
1213 3
|
Java 应用服务中间件 Android开发
IDEA 编译时 报 “常量字符串过长” 解决办法
IDEA 编译时 报 “常量字符串过长” 解决办法
4016 0
|
编解码 计算机视觉 索引
OpenCV使用单目标匹配从图像中选择最佳的匹配结果及查找重复图像实战(附Python源码)
OpenCV使用单目标匹配从图像中选择最佳的匹配结果及查找重复图像实战(附Python源码)
1240 0
|
前端开发
css的渐变属性linear-gradient
css的渐变属性linear-gradient
|
11月前
|
人工智能 JavaScript Java
深度测评国产 AI 程序员,在 QwQ 和满血版 DeepSeek 助力下,哪些能力让你眼前一亮?
阿里云发布并开源全新的推理模型通义千问QwQ-32B。通过大规模强化学习,千问QwQ-32B在数学、代码及通用能力上实现质的飞跃,整体性能比肩DeepSeek-R1。在保持强劲性能的同时,千问QwQ-32B还大幅降低了部署使用成本,在消费级显卡上也能实现本地部署。
908 57
|
数据采集 自然语言处理 API
Python反爬案例——验证码的识别
Python反爬案例——验证码的识别
535 2
|
存储 缓存 搜索推荐
深入理解Elasticsearch倒排索引原理与优化策略
总之,Elasticsearch的倒排索引是其高效全文搜索的核心。为了提高性能和可伸缩性,Elasticsearch采用了多种优化策略,包括压缩、分片、合并、位集合和近实时搜索等。这些策略使Elasticsearch成为处理大规模文本数据的强大工具。
1157 0