Node.js躬行记（11）——E2E测试

2022-04-27 329

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介： 　　Cypress是为现代网络构建的前端测试工具，解决了开发人员和 QA 工程师在测试应用程序时面临的关键痛点。　　在这个测试框架中包含了E2E测试、集成测试和单元测试（内嵌了Mocha），我们需要的是它的E2E测试的能力。　　官网中包含详尽的API接口文档，以及多个视频教程、实例等，只要有耐心，看完文档，上手是不成问题的。　　之所以要引入E2E测试，主要是为了保证主流程能够不出错，尤其是在后期做修修补补后，有一个可靠的方式告诉我们当前页面是正常的就行。

　　Cypress是为现代网络构建的前端测试工具，解决了开发人员和 QA 工程师在测试应用程序时面临的关键痛点。

　　在这个测试框架中包含了E2E测试、集成测试和单元测试（内嵌了Mocha），我们需要的是它的E2E测试的能力。

　　官网中包含详尽的API接口文档，以及多个视频教程、实例等，只要有耐心，看完文档，上手是不成问题的。

　　之所以要引入E2E测试，主要是为了保证主流程能够不出错，尤其是在后期做修修补补后，有一个可靠的方式告诉我们当前页面是正常的就行。

　　所以，并不会要求E2E的覆盖率要达到怎样的一个数字，只是为了保证代码的健壮性。

一、安装和初始化

　　安装命令如下：

npm install cypress --save-dev

　　下面这个命令会初始化一堆已经写好的用例：

npx cypress open

　　命令执行完后，就会在根目录中新增cypress文件夹，其中 fixtures 文件存放自定义的 json 文件，integration 文件存放测试用例，support可以自定义命令。

|-- fixtures
|-- integration
|----- example.spec.js
|-- plugins
|-- support

　　在 integration 中包含 1-getting-started 和 2-advanced-examples 两个文件夹，这些是内置的用例，可以作为demo查看。

二、启动

　　将 cypress open 命令添加到 scripts 中，就能通过 npm run cypress 命令执行E2E测试了。

{
  "scripts": {
    "cypress": "cypress open"
  }
}

　　运行后会出现下面这个界面：

　　点击某个测试用例文件，就会开启一个浏览器，并显示测试过程，绿色是正常，红色是异常，下图是正常的结果。

三、测试用例

　　下面的用例在模拟登录，首先是通过 visit() 函数请求登录地址。

describe('登录', () => {
  beforeEach(() => {
    cy.visit('http://localhost:8000/login')
  })
  it('账号和密码错误', () => {
    cy.get('#userName').type(userName);             //读取ID为userName的控件，并赋值
    cy.get('#password').type(pwd + '{enter}');      //读取ID为password的控件，赋值后自动按回车
    cy.contains('测试用户').should('exist');         //界面中是否包含测试用户的标签
  });
});