前端自动化测试框架Cypress入门

一：Cypress简介

随便着Web应用项目的不断发展，测试也要不断发展，Cypress是为现代网络打造的，基于JavaScript语言的一种前端自动化测试工具，测试也是如此，对浏览器中运行的所有内容进行快速，轻松和可靠的测试。

Cypress是自集成的，它提供了一套完整的端到端的测试体验，正如官网上所说：

安装Cypress很简单,无需依赖项,无需额外下载或更改代码。
轻松，快速地编写测试，并在构建Web应用程序时观察它们的实时执行。
在CI中调试测试就像在本地运行测试一样容易。具有内置的并行化和负载平衡功能。
记录CI测试数据，屏幕截图和视频-并在“ 仪表盘”中查看汇总的下一级见解。

二：Cypress工作原理

Cypress在与应用程序相同的生命周期里执行，当你运行测试时，Cypress首先使用webpack将测试代码中的所有模块bundle到一个js文件中，然后，它会运行浏览器，并且将测试代码注入一个空白的页面里，然后它将在浏览器中运行测试代码。

在每次测试首次加载Cypress时，内部Cypress Web应用程序先把自己托管在本地的一个随机端口上，在识别出测试中发出的第一个cy.visit()命令后，Cypress将会更改其本地的URL以匹配你远程应用程序的Origin，这使得你的测试代码和应用程序可以在一个Run Loop中运行。

因为Cypress测试代码和应用程序均运行在由Cypress全权控制的浏览器中，且它们运行在同一个Domain下的不同iframe内，所以Cypress的测试代码可以直接操作DOM，Windows Objects甚至Local Storages而无须通过网络访问，这就是Cypress可以运行的更快的原因。

Cypress还可以在网络请求层进行即时读取和更改网络流量的操作，Cypress背后是Node.js Process，任何发往浏览器之外的HTTP的请求和响应，均由Cypress生成的，被Node.js Process控制的Proxy进行转发，这使得Cypress不仅可以修改进出浏览器的所有内容，还可以更改可能影响自动化浏览器操作的代码。这便得Cypress相对于其它测试工具来讲不仅能从根本上控制整个自动化测试的流程，还可以提供稳定性更加可靠的结果。