如今，软件应用已经变得越来越复杂，最大化测试覆盖率是每个测试团队的关键环节之一。全球的测试人员依靠不同的测试类型，使用测试工具和框架。但是，迫切需要对软件系统（连同其所有子系统）进行从头到尾的测试。
端到端（E2E）测试允许测试团队通过复制关键的真实用户场景来推动整个管道的质量。此外，它使团队能够验证软件系统和其子系统的数据完整性。端到端测试并不容易。
Cypress使设置、编写、运行和调试测试变得容易。我们通常会忽视端到端测试，因为它需要很大一部分精力来实施。使用手工方法执行端到端测试可能是一项乏味和容易出错的任务。
当涉及到端到端测试时，Cypress是其中一个选择。使用Cypress，你不需要安装十个不同的东西来设置你的测试套件。在几分钟内，你可以在Cypress API的帮助下开始编写你的测试案例。Cypress在浏览器内运行测试用例，这使得它与其他框架（如Selenium）不同。Cypress使用Chai，它是一个流行的断言库。它还使用Mocha，一个提供行为驱动开发（BDD）风格的测试语法的框架。
在这个关于端到端测试的Cypress教程中，我们将深入研究在本地Cypress网格和LambdaTest等云Cypress网格上执行Cypress端到端测试。
所以，让我们开始吧!
为什么要进行端到端测试？
大多数端到端应用测试过去都是手工进行的，由QA团队理解需求，制定测试用例，执行测试用例，并记录结果。在现代软件开发中，自动化已经成为测试的基础部分。
软件可以而且必须在许多层级上进行测试。当你设计一个系统时，你从一个小的软件开始，对它来说，单元测试已经足够。然而，在单元层面上测试软件是不够的，它不能保证这些小单元在组合时应该完美地工作。
这就是集成测试的作用。在集成测试中，两个或更多的组件在测试中一起使用，并对结果进行验证。尽管所有这些测试都运行得很好，但集成测试不能保证系统会像预期那样工作。这就是端到端测试的作用。
端到端测试最接近于真正的用户测试。Cypress是E2E测试的最佳自动化测试框架之一，因为Cypress在浏览器中运行应用程序，从而提供如同应用程序在实际浏览器中运行的体验。测试越接近于模仿用户，就越有可能找到用户可能遇到的问题。
为了理解端到端测试，让我们深入了解Mike Cohn介绍的测试自动化金字塔。它使测试变得高效。在这个金字塔中提到的所有级别的测试，我们通常在运行自动化Cypress测试时进行。
在自动化中，我们从低级单元的自动化开始；一旦它们准备好了，我们就编写我们的集成自动化脚本。最后，一旦集成测试完成，我们就做端到端测试，以确保我们的脚本能正确地一起工作，包括第三方代码。
测试金字塔的层数
测试金字塔是Mike Cohn提出的一个经验性概念，在他的书《敏捷估算与规划》中介绍过。测试套件被组织成三个层次--单元、集成和E2E测试。让我们来了解一下它们。
- 单元测试
单元测试是一种技术，对单个模块进行测试以确定它们是否适合使用。单元测试的主要目的包括隔离系统的每个部分，并确保各个组件有效工作。
- 集成测试
集成测试专门研究在测试中一起使用的两个或多个组件之间的互动，并对结果进行验证。它们的运行速度一般较慢，因为它涉及复杂的设置。
如果集成测试失败，查找问题可能会更复杂一些，因为失败范围更大。它们也更难编码和维护，因为它们有更高级的嘲弄和增加的测试范围。你可以参考这个JUnit 5 Mockito教程来了解更多关于嘲弄的知识。
- 端到端测试
端到端测试是一种技术，用于测试一个应用程序从开始到结束的流程是否符合预期。
端到端测试的好处
端到端测试有几个好处。在讨论端到端测试对企业的价值时，这些好处通常被归结为一些关键点。
- 从终端用户的角度进行测试
在单元测试中，你要孤立地验证每个组件，而端到端测试是从最终用户的角度来检查应用程序的。
- 应用程序的健康状况
在端到端测试中，应用程序在所有层面上进行测试--业务、数据、集成和展示。这有助于确保被测试的应用程序没有错误，并能在整个生命周期内无缝工作。
由于端到端测试在每个层面上都验证了你的应用程序的健康状况，所以它能随时保持你的应用程序的健康和良好状态。在单元级而不是在集成级测试应用程序，为软件在不同级别和环境中的整体性能提供了一个非常需要的视角。
- 增加测试覆盖率
端到端测试可以验证一个应用程序的每一个依赖关系是否能正确地一起工作，包括第三方代码。
端到端测试帮助我们从头到尾测试整个应用程序，包括API和UI层。使用自动化的UI测试和手动测试实践有助于最大限度地提高测试覆盖率。你可以通过这篇关于如何从手工测试转向自动化的博客了解更多信息。
- 减少未来的风险
在端到端测试中，应用程序在每次冲刺和迭代后都会被深入测试。这有助于测试人员在生命周期中更快、更早地定位缺陷。在测试（或生产）过程中，应用失败的几率明显减少。
在应用程序开发生命周期中更早地发现错误和问题，使测试工作和成本最小化。每一步的广泛测试确保了系统中更少的bug和更早地发现软件中的故障。这将减少测试的重复性，因此，最终减少相关的努力、时间和成本。
- 增加对产品质量的信心
端到端测试还增加了对应用程序的功能和性能的信心，因为应用程序是在多个设备、浏览器和操作系统上进行全面测试。
端到端网络应用程序测试框架
让我们看看一些流行的端到端测试的网络框架。
赛普拉斯
Cypress是新一代的前端测试框架，采用现代JavaScript框架构建。Cypress带有一捆测试运行器和一个记录和显示测试结果的仪表盘服务。
Cypress最常被拿来与Selenium作比较；然而，Cypress在根本上和架构上都有所不同。Cypress没有像Selenium那样的限制。Cypress允许我们编写几种类型的测试：端到端、集成，甚至是单元测试。你可以通过这个Cypress与Selenium的比较来了解更多的区别。
Cypress在浏览器内运行测试，给出的结果几乎与用户使用应用程序时的体验相同。
GitHub上的Cypress趋势
以下数据收集自Cypress GitHub仓库的官方网站。
- 星级：39.5k
- 叉子: 2.5k
- 使用人数: 490k
- 发布: 273
- 贡献者。368
如果你是一名开发人员或测试人员，Cypress 101认证将使你对Cypress端到端测试的基本原理有清晰的认识，从而为你更快、更自信地编写测试做好准备。
WebdriverIO
WebdriverIO是一个渐进式自动化框架，用于自动化现代Web和移动应用程序。
它简化了与应用程序的交互，并提供了一套插件，帮助你创建一个可扩展的、强大的、稳定的测试套件。
WebdriverIO在GitHub上的趋势
下面的数据收集自WebdriverIO GitHub仓库的官方网站。
- 星级: 7.6k
- 叉子: 2.1k
- 使用人数: 43.1k
- 发布: 209
- 贡献者。424
夜观天象.js
Nightwatch.js是一个集成的、易于使用的网络应用程序和网站端到端测试解决方案，用Node.js编写。它使用W3C WebDriver API来驱动浏览器并对DOM元素执行命令和断言。
GitHub上的Nightwatch.js趋势
以下数据收集自Nightwatch.js GitHub仓库的官方网站。
- 星级: 11.1k
- 叉子。1.1k
- 使用单位: 135k
- 发行量。182
- 贡献者。94
牵引器(Protractor)
Protractor是一个用于Angular和AngularJS应用程序的端到端测试框架。Protractor针对你在真实浏览器中运行的应用程序运行测试，像用户一样与之进行交互。
GitHub上的Protractor趋势
下面的数据来自于Protractor GitHub仓库的官方网站。
- 星级: 8.8k
- 叉子: 2.4k
- 使用人: 1.8m
- 贡献者。260
测试咖啡
TestCafe框架是一个用NodeJS构建的开源自动化框架。它支持JavaScript、TypeScript和CoffeeScript的开箱即用，这意味着需要零配置。TestCafe是在开源的MIT许可下发布的，由DevExpress管理。
TestCafe在GitHub上的趋势
以下数据收集自TestCafe的GitHub仓库的官方网站。
- 星级: 9.4k
- 叉子。655
- 被使用: 10.6k
- 发行量。351
- 贡献者。112
赛普拉斯端到端测试的好处
在我们研究进行赛普拉斯端到端测试的好处之前，让我们看看一个简单的赛普拉斯端到端测试场景。
假设你必须登录到应用程序，并在网站ecommerce-playground.lambdatest.io/ ，搜索一些产品，然后从应用程序中退出。以下是上述场景的步骤，包括从登录到→产品搜索→注销的端到端流程。
测试场景
- 打开网址ecommerce-playground.lambdatest.io/index.php?r…
- 输入电子邮件 "lambdatest@yourmail.com"。
- 输入密码 "lambdatest"。
- 单击 "登录"。
- 搜索产品 "VAIO"。
- 确认搜索到的产品是正确的。
- 点击 "我的账户"。
- 点击 "注销 "链接。
- 用户从应用程序中注销。
现在让我们来看看Cypress端到端测试的好处。Cypress是一个快速、简单、可靠的端到端测试框架。Cypress测试任何在网络浏览器上运行的东西。
传统上，端到端测试的速度较慢，成本较高。随着Cypress 9.2.0版本的推出，端到端测试体验有了很大的改善。现在，我们可以将整个测试过程自动化，从单元级测试到系统测试。使用Cypress的仪表板功能，我们可以轻松地跟踪我们的测试结果。
Cypress的设置非常简单。只需安装并开始编写测试案例。你可以将自定义报告器与Cypress集成，以查看结果。
它有一个用于CI集成的仪表板功能。当从你的CI供应商运行Cypress测试时，你可以在仪表板上记录测试结果。
根据我的经验，以下是Cypress端到端测试的一些很棒的功能。
- 易于设置
你可以使用NPM或其桌面应用程序来安装Cypress。而且，你不需要像Selenium那样安装任何额外的库、依赖性、驱动、服务器等。与其他自动化测试工具（或框架）相比，Cypress的设置非常简单。
- 更快地编写测试案例
Cypress的速度更快，在几分钟内，你就可以开始编写测试案例。Cypress在浏览器内运行测试，给出的结果几乎与用户将经历的相同。它还可以通过应用程序访问网络层，这使我们可以控制所有的网络请求。
- 自动等待
在Cypress中，我们不需要在你的测试中添加等待或睡眠。Cypress会自动等待命令和断言，然后再进入下一个步骤。Cypress不仅等待元素可见或AJAX加载，而且还等待不同的请求被发送或返回。你可以通过这个关于Selenium中Waits类型的教程来了解更多关于Waitits的信息。
- 实时重载
在赛普拉斯，你不需要重新加载测试案例。当你对你的测试用例进行修改时，它足够智能，可以自动触发并运行测试。这节省了我们在其他工具中保存和重新运行测试案例的大量时间。
- 截图和视频
在失败时自动捕获截图，或者在无头运行时自动捕获你的整个测试套件的视频
，这在测试失败时非常有用。因为我们可以观看一系列测试步骤运行时发生的情况，所以当某些测试用例失败时，追踪确切的步骤变得非常容易。
- 信息化的仪表板
使用Cypress仪表板，我们可以在CI/CD供应商中运行我们的测试案例，并记录测试结果。仪表板让你深入了解你的测试运行时发生了什么。仪表板让你看到失败、通过、待定、跳过的测试数量以及失败测试的整个堆栈跟踪。当任何测试案例失败时，屏幕截图会自己捕捉到，通过运行视频，我们可以看到失败的步骤。
- 与云测试平台的集成
我们可以将Cypress与各种云提供的测试平台集成。其中之一是LambdaTest。使用LambdaTest等Cypress自动化工具，你可以在线执行和分析Cypress测试脚本。你可以在速度极快的Cypress测试执行云上运行端到端测试。LambdaTest是一个可靠的、可扩展的、安全的、高性能的测试执行平台，是为规模而建立的。在40多种不同的浏览器和浏览器版本上进行Cypress UI测试，包括无头版本。
在云网格上运行端到端的Cypress测试。现在就试试LambdaTest吧!
开始使用Cypress端到端测试
按照下面提到的步骤，为Cypress自动化测试创建一个新项目。
第1步：创建一个文件夹并生成package.json。
- 创建一个项目，这里将其命名为Cypress_Lambdatest。
- 在终端使用npm init命令来创建package.json文件。
第2步：安装Cypress。
要安装Cypress，在新创建的文件夹中运行此命令。
npm install cypress —save-dev
该命令将在本地安装Cypress，作为你的项目的一个开发依赖。
或者
yarn add cypress --dev
此命令将把Cypress安装在本地，作为你的项目的一个开发依赖项。
一旦安装，Cypress版本9.2.0就会反映出来，如下图所示。Cypress的最新版本是10.3.0
Cypress的默认文件夹结构如下图所示。你可以在 "集成 "文件夹下创建测试案例。
Cypress的项目结构
从截图中可以看出，Cypress在首次打开时已经创建了一个默认的文件夹层次结构。下面是Cypress创建的每个文件夹/文件的详细信息。
- 固定装置。 固定装置是你的测试可以使用的静态数据的外部片段。建议不要在测试案例中使用复杂的代码数据。它应该从外部来源驱动，如CSV、HTML或JSON。
- **集成。**这是存储所有测试的主要文件夹。我们在这里添加Basic, End to End Test, Visual或Cucumber测试。你所有的规格文件都会在这里。
- **插件。**Plugin文件夹包含插件或监听器。Cypress将自动包括插件文件 "cypress/plugins/index.js"。
- **支持。**支持文件夹内有两个文件：commands.js和index.js
- **command.js：**是你添加常用函数和自定义命令的文件。它包括你可能在不同的测试中调用使用的函数，如登录函数。Cypress为你创建了一些函数，如果你愿意，你可以在这里覆盖它们。
- **index.js：**这个文件在每个规格文件之前运行。这个文件是一个很好的地方，可以把全局配置和修改Cypress的行为像之前或之前一样。默认情况下，它只导入 commands.js，但你可以导入或要求其他文件来保持事情的条理性。
- **Node_Modules。**所有的node包将被安装在node_modules目录下，并在所有的测试文件中可用。因此，简而言之，这是NPM安装所有项目依赖项的文件夹。
- **Cypress.json：**它用于存储不同的配置。例如，超时、基本URL、测试文件，或任何其他我们想要覆盖的配置，以调整Cypress的行为。我们还可以管理自定义的文件夹结构，因为它是默认的Cypress配置的一部分。
除了上述四个文件夹外，我们还有一些文件夹，如屏幕截图、下载和视频，以存储不同的相关文件，我们将在后面讨论。
赛普拉斯的基本结构
Cypress采用了Mocha的语法来开发测试案例。以下是Cypress测试开发中主要使用的几个主要结构。
- describe()。它用于对我们的测试进行分组。它需要两个参数，第一个是测试组的名称，第二个是一个回调函数。
- it()。它用于单个测试案例。它需要两个参数，一个解释测试应该做什么的字符串和一个包含我们实际测试的回调函数。
- before(): 它在块中的所有测试之前运行一次。
- after():它在测试块中的所有测试之后运行一次。
- beforeEach():它在测试块中的每个测试之前运行。
- afterEach():它在测试块中的每个测试之后运行。
- .only():它用于运行指定的套件或测试；在.it()块的后面加上".only"。
- .skip():它用于跳过指定的套件或测试；在.it()块的后面加上".skip()"。
示范。赛普拉斯端到端测试
让我们在集成文件夹下创建一个名为 "cypress_lambdatest "的新文件夹，以执行Cypress端到端测试。
Cypress端到端测试。案例示例1
在LambdaTest文件夹下创建第一个规格，名称为login_searchproduct.spec.js。
在login_searchproduct.spec.js文件中编写以下脚本，内容包括登录到应用程序并搜索产品。在搜索之后，验证正确的产品应该被显示出来。
在下面的代码片断中。
- 首先，我们使用cy.visit()打开网站的URL。
- 第二，it()块用于通过输入电子邮件和密码登录到应用程序。
- 第三，it()块用于搜索产品，最后it()块用于搜索产品。
代码演练
一个新的Cypress链总是以**cy.[command]**开始，其中命令产生的内容确定了接下来可以调用的其他命令（链）。
一些方法，如cy.get()或cy.contains()，产生一个DOM元素，允许进一步的命令被链到他们身上（假设他们期望一个DOM主题），如.click()或甚至cy.contains()再次
赛普拉斯端到端测试。案例示例2
在LambdaTest文件夹下创建第二个规格，名称为ScrollAnd_ClickProduct.spec.js 。登录→滚动到底部→点击产品。
在下面的代码片断中。
- 首先，我们使用cy.visit()打开网站的URL。
- 第二，it()块用于通过输入电子邮件和密码登录到应用程序。
- 第三，it()块将点击LambdaTest的标志。
- 第四，it()块将滚动到特定的产品并点击它。
如何在本地赛普拉斯网格上进行赛普拉斯端到端测试？
你可以从命令行或使用Cypress runner来运行测试案例。让我们使用Cypress runner来运行测试案例。要打开Cypress测试运行器，运行以下命令。
yarn run cypress open
上述命令将打开带有现有测试案例的Cypress测试运行器。你可以选择你想运行测试案例的浏览器。
在本地赛普拉斯网格上执行第一个赛普拉斯端到端测试
点击第一个.spec，第一个测试案例开始执行。下面是测试用例成功运行时的屏幕截图。
在本地赛普拉斯网格上执行第二个赛普拉斯端到端测试
点击第二个.spec，第二个测试案例开始执行。在下面的截图中，我们可以看到产品正在加载。
在下面的截图中，测试案例运行成功。
如何在云Cypress网格上执行Cypress端到端测试？
我们已经在本地Cypress网格上进行了Cypress端到端测试。我们可以使用云平台在多个浏览器、版本和操作系统上执行Cypress并行测试。基于云的跨浏览器测试平台，如LambdaTest，允许你在真实浏览器和操作系统的在线浏览器农场上用Cypress自动进行网络测试。我们可以在极快的测试执行云上进行Cypress端到端测试。
LambdaTest提供大规模的并行化，并与CI/CD管道轻松整合。Cypress测试结果将通过lambdatest-Cypress CLI实时出现。一旦所有的测试案例被执行，你可以在LambdaTest仪表板上看到Cypress的测试结果。在LambdaTest上，我们还可以看到所有测试案例的屏幕截图、视频和日志。
为Cypress测试用例的执行加强lambdatest
第1步：安装CLI。
通过npm使用Cypress CLI命令安装LambdaTest。LambdaTest的命令行界面允许我们在LambdaTest上运行你的Cypress测试。
npm install -g lambdatest-cypress-cli
第2步：生成lambdatest-config.json。
在根文件夹下，配置我们要运行测试的浏览器。使用init命令生成一个样本lambdatest-config.json文件或从头开始创建一个。使用下面的命令。
lambdatest-cypress init
在生成的lambdatest-config.json文件中，传递以下信息。
在lambdatest_auth、浏览器和run_settings部分填写所需的值，以运行你的测试。
用Cypress并行测试缩短测试执行时间。现在就试试LambdaTest吧!
如何在云Cypress网格上并行执行Cypress端到端测试？
运行以下命令，在LambdaTest上执行Cypress UI自动化。
lambdatest-cypress run
当我们运行上述命令时，测试案例就会在你的本地和LambdaTest平台上并行地开始执行。
本地环境中的Cypress端到端测试报告
当我们在本地终端运行lambdatest-cypress run 命令时，会生成以下报告。
在下面的报告中，我们可以看到测试案例login_searchproduct.spec.js和ScrollAnd_ClickProduct.spec.js在Firefox和Chrome上成功运行。
LambdaTest上的Cypress端到端测试报告
在下面的屏幕中，你可以看到测试案例开始在Firefox浏览器上运行。
在下面的控制台中，你可以看到Firefox浏览器上的日志测试案例已经通过。
在下面的屏幕中，你可以看到测试用例也开始在Chrome浏览器上运行。
在下面的控制台中，你可以看到Chrome浏览器上的日志测试用例已经通过。
更多细节，你可以阅读这篇关于如何用LambdaTest大规模执行赛普拉斯测试的博客。
总结
每种测试方法都有优点和缺点。赛普拉斯端到端测试最接近真实的用户测试，这是其主要优势之一。测试越接近于模仿用户，就越有可能抓住用户可能遇到的问题。
总的来说，如果你想通过一些端到端测试使你的测试更上一层楼，Cypress是一个可靠的选择。
常见问题解答（FAQ）
Cypress是端对端测试吗？
Cypress是一个端到端的测试解决方案，允许你对任何现代网络应用程序进行自动化测试。新的文件运行器使你更容易执行你的测试，同时确保你总是能够访问你的文件的最新版本。它是用JS和node编写的，打包后即可运行，没有构建步骤或依赖性。
Cypress是端到端还是集成？
Cypress自动运行端到端测试，就像用户通过驱动一个真实的浏览器与你的应用程序进行互动一样。Cypress会访问URL，查看内容，点击链接和按钮，甚至是滚动
Cypress做什么样的测试？
Cypress是一个用于网络自动化的端到端测试框架。Cypress允许前端工程师使用JavaScript编写真实的、高覆盖率的测试，这是突出的网站开发人员使用的唯一语言。
