【译】”Protractor已死，Cypress万岁“4月24日，Angular宣布他们的E2E测试工具protract

4月24日，Angular宣布他们的E2E测试工具protractor将被废弃。目前还不清楚是否会有一个继任者，或者Angular是否将此委托给它的用户。在写这篇文章的时候，WebDriver.IO、TestCafé和Cypress提出了Angular CLI的方案。

在这篇文章中，我将简要介绍各种E2E框架之间的差异，论证为什么你应该使用Cypress，并且--在第二部分--帮助你完成第一个步骤。

如果你喜欢看而不是读，那么这个我的演讲的录音是为你准备的。

E2E测试框架的前景

基于WebDriver的

我们可以将现有的工具大致分为两组。一组是基于WebDriver的，另一组是基于Chrome DevTools协议（CDP）的。

Selenium是在2004年发布的。它与一个叫做WebDriver的类似工具合并了。Selenium仍然是一个主要的角色，而Protractor或多或少是它的一个包装。

有了Selenium/WebDriver，开发者有了一个通用的API来实现浏览器的自动化。每个支持的浏览器都必须提供一个驱动，WebDriver使用该驱动进行通信。这使得这些框架能够跨浏览器。这意味着你可以在Safari、Chrome、移动浏览器等上面运行相同的测试。

随着时间的推移，WebDriver，Selenium的核心技术，成为W3C标准。这为其他供应商在WebDriver的基础上创建自己的框架打开了大门。

不幸的是，基于WebDriver的测试被认为是不稳定的。这意味着，如果他们在相同的情况下多次运行，他们可能会失败或成功。这对一个测试框架来说是非常糟糕的。你花了相当多的时间来构建一个应该保证应用程序稳定性的东西，然后你甚至不能相信它。

Chrome DevTools协议

两个相当流行的替代品是Puppeteer和Playwright。它们不依赖WebDriver，而是通过Chrome DevTools协议（CDP）直接与浏览器对话。这使他们能够更好地控制，从而使测试更加稳定。
CDP与基于Chromium的浏览器（Chrome、Edge）绑定。跨浏览器的测试，就像我们用WebDriver发现的那样，是不可能的。同时，Firefox也支持CDP，因此支持Puppeteer等。

Puppeteer的一些原始开发者也在支持Playwright。因此，人们可以把Playwright看作是Puppeteer的重写。它也使用CDP，但也支持Safari。这是有可能的，因为它的浏览器都打了补丁。

WebdriverIO是一个混合框架。它同时提供对CDP和WebDriver的访问。

Cypress属于哪个类别？Cypress也依赖于CDP。与Puppeteer相比，Cypress只使用CDP来管理测试。测试本身根本不使用CDP，而是直接在浏览器中运行。在测试和浏览器之间不再有任何一层。测试和应用程序代码是一体的。你的测试代码可以直接访问DOM，而不是通过CDP或WebDriver间接访问。

这也是Selenium在与WebDriver合并之前采取的方法。看来历史会重演。

虚弱性与跨浏览器

从一个非常高的水平来看，我们在测试和浏览器之间的抽象程度越高，测试就越容易出现问题。在另一方面，我们可以进行跨浏览器测试。我们越接近浏览器，测试就越稳定。但我们必须接受，我们只能在一个特定的浏览器技术中运行测试，即Chromium。

在未来，所有的浏览器都可能支持CDP，或者即将推出的WebDriver BiDi将为WebDriver世界带来稳定。事情还在不断发展。

E2E框架景观

为什么你应该使用Cypress

首先，Cypress不使用WebDriver，而是直接在浏览器中运行其测试。这些使得测试稳定可靠。这正是我们首先想要的。

第二个原因是开发经验（DX）。Cypress的作者投入了大量的精力，使其尽可能地易于使用。这并不意味着它的API很容易使用。工具化、社区工作，特别是文档，实在是太棒了。

OK，所以Cypress比Protractor好。你为什么要选择Cypress而不是其他的E2E库？

作为Angular开发者，我们一直很欣赏我们得到了一个 "有意见的框架"，它为我们预先选择了各种工具。虽然，看起来Angular在E2E方面的位置是空的，但还有一个大玩家。Nx为Angular应用程序提供最佳工具已经有好几年了。

Nx是一个围绕CLI的封装器。它一开始是MonoRepositories的候选者，但随着时间的推移，越来越成为Angular CLI++。事实上，如果我开始一个新的Angular应用程序，我个人总是会选择Nx。没有锁定，没有开销，我只是得到了更好的工具，并且可以继续使用Angular CLI。

你猜怎么着？Nx一直在用Cypress取代Protractor。所以Nx照顾到了Angular和Cypress的良好合作。

最后一个论点是Cypress在Angular开发者中的使用情况。在公开废止之前，Angular做了一个调查。他们问他们的用户正在使用什么E2E。该调查显示，64%的人支持Cypress。你说这是政治上的压倒性胜利。而且请记住，那是在Protractor是官方工具的时候!Protractor最后只得到了19%。

Screen Shot 2021-03-24 at 6 31 33 PM