前端自动化测试框架——Cypress 从入门到精通

编辑推荐

• Cypress能够让软件开发实现并行测试，持续集成；
• 专有元素定位，框架级别元素自动等待，原生支持Mock；
• 专有TestRunner，命令执行细节全景回放呈现，定位问题更加精准。

越来越多的国际大公司使用Cypress提升测试效率，学习Cypress自动化测试，正是趋势所在。知名测试架构师蔡超老师在软件开发领域摸爬滚打15年，从多家知名外企成长，精心创作的这本书，集知识、经验、案例一书，并配180分钟视频面对面讲授

让你轻松学会：

• 一个工具实现DevOps流水线；
• 一个框架集成API测试和UI自动化测试；
• 创建您自己的自动化测试框架。

内容简介

本书在简要讲解软件测试概述和自动化测试框架之后，教会读者了解测试的基本概念，以及如何设计一个测试框架。之后，在分别介绍了一些流行框架并使读者知晓各自优缺点和适用，使得读者对前端自动化框架有提纲挈领的了解。在此基础上，本书重点介绍当下流行的前端测试框架Cypress ，通过基础知识、进阶知识、高级用法和实战演示几个方面，由浅入深，让读者真正掌握前端测试框架，成为软件测试行业的高手。

作者简介

蔡超

知名测试架构师，自动化测试框架ktest作者，软件测评师，PMP，互联网测试开发社区VIPTEST联合创始人，微信公众号iTesting作者。曾先后服务于世界 500 强企业上海惠普有限公司（ HP）, 在线教育企业英培信息技术有限公司（EF Labs） 等国际公司, 对测试框架，自动化测试有深入研究。业余时间热爱软件测试技术分享并长期致力于软件测试的技术传播工作。技术博客https://www.helloqa.com

目　　录

第一部分 前端自动化测试框架准备篇
第1 章 前端自动化测试概述 2
1.1 前端自动化测试概述 2
1.2 前端自动化测试框架概述 5
1.2.1 应运而生的前端测试框架 5
1.2.2 前端自动化测试框架组成 6
1.2.3 前端自动化测试框架设计原则 8
1.3 前端代码基础 9

第二部分 前端自动化测试工具篇
第2 章 前端测试框架/工具大比拼 14
2.1 前端测试框架/工具简介 14
2.1.1 Selenium/WebDriver 14
2.1.2 Karma 15
2.1.3 Nightwatch 17
2.1.4 Protractor 17
2.1.5 TestCafe 18
2.1.6 Puppeteer 19
2.2 Cypress框架介绍 20
2.2.1 Cypress简介 20
2.2.2 Cypress架构及原理 20
2.2.3 Cypress八大特性 22
2.2.4 一图胜千言 23
2.3 Cypress与Selenium/WebDriver的比较 23
2.3.1 Selenium/WebDriver的原理 23
2.3.2 Cypress与Selenium/WebDriver比较 26
2.4 Cypress与其他主流测试工具比较 29
2.4.1 Cypress与Karma比较 29
2.4.2 Cypress与Nightwatch比较 30
2.4.3 Cypress与Protractor比较 31
2.4.4 Cypress与TestCafe比较 32
2.4.5 Cypress与Puppeteer比较 33
2.5 Cypress的局限 34
2.5.1 长期权衡 34
2.5.2 短期折中 34

第三部分 前端自动化测试框架基础篇
——Cypress基础知识
第3 章 Cypress初体验 36
3.1 Cypress安装 36
3.1.1 系统要求 36
3.1.2 下载 36
3.1.3 安装 37
3.1.4 打开Cypress 39
3.1.5 Cypress设置 40
3.2 搭建测试应用 41
3.2.1 下载测试应用 41
3.2.2 启动测试应用 42
3.3 测试你的应用 44
3.3.1 创建测试 44
3.3.2 编写测试用例 44
3.3.3 运行测试 46

3.3.4 调试测试用例 47

第4 章 Cypress测试框架拆解 53
4.1 Cypress默认文件结构 53
4.1.1 测试夹具（Fixture） 54
4.1.2 测试文件（Test file） 54
4.1.3 插件文件（Plugin file） 55
4.1.4 支持文件（Support file） 55
4.2 自定义Cypress 56
4.3 重试机制 59
4.3.1 命令和断言 59
4.3.2 多重断言 61
4.3.3 重试（Retry-ability）的条件 61
4.4 测试报告 62
4.4.1 内置的测试报告 62
4.4.2 自定义的测试报告 66

4.4.3 生成混合测试报告 69

第5 章 测试用例的组织和编写 72
5.1 Mocha介绍 72
5.2 钩子函数（Hook） 74
5.3 排除或包含测试用例 82
5.3.1 排除测试套件/测试用例 83
5.3.2 包含测试套件/测试用例 86
5.4 动态忽略测试用例 89
5.5 动态生成测试用例 91
5.6 断言 93

5.7 观察测试运行 94

第6 章 Cypress与元素交互 97
6.1 Cypress元素定位选择器 97
6.2 Cypress与页面元素交互 99
6.2.1 查找页面元素的基本方法 99
6.2.2 查找页面元素的辅助方法 100
6.2.3 可操作类型 105

6.2.4 Cypress常见操作 109

第7 章 命令行运行Cypress 117
7.1 cypress open 117
7.1.1 cypress open简介 117
7.1.2 cypress open详解 118
7.2 cypress run 119
7.2.1 cypress run简介 119

7.2.2 cypress run详解 119

第8 章 测试运行器 123
8.1 Test Runner简介 123
8.2 Test Runner如何便捷我们的测试 125
8.2.1 更改浏览器 125
8.2.2 更改元素定位策略 125
8.2.3 实时监控测试用例执行情况 126
8.2.4 时间穿梭功能 126
8.3 Test Runner功能扩展 127
8.3.1 安装 127
8.3.2 配置 127

8.3.3 使用 128

第9 章 重塑你的“测试习惯” 129
9.1 Cypress典型的“坑” 129
9.1.1 Cypress命令是异步的 129
9.1.2 慎用箭头函数 130
9.1.3 async/await不工作 130
9.1.4 赋值“永远”失败 131
9.1.5 躲不过的同源策略 131
9.2 Cypress独特之处 132
9.2.1 闭包（Closure） 132
9.2.2 变量和别名 133

第四部分 前端自动化测试框架进阶篇
——Cypress进阶
第10 章 Cypress最佳实践 138
10.1 设置全局URL 138
10.2 避免访问多个站点 139
10.3 删除等待代码 139
10.4 停用条件测试 140
10.5 实时调试和中断 140
10.6 运行时的截图和录屏 141
10.7 断言最佳实践 143
10.8 改造PageObject模式 146
10.9 使用Custom Commands 153
10.10 数据驱动策略 155
10.10.1 数据保存在前置条件里 155
10.10.2 使用fixtures 156
10.10.3 数据保存在自定义文件中 156
10.11 环境变量设置指南 157
10.11.1 cypress.json设置 157
10.11.2 cypress.env.json 157
10.11.3 运行时动态指定环境变量 158
10.12 测试运行最佳实践 159
10.12.1 动态生成测试用例 159
10.12.2 挑选待运行测试用例 159
10.13 测试运行失败自动重试 162
10.14 全面的测试报告 162

10.15 Cypress连接DB 163

第11 章 使用Cypress做接口测试 165
11.1 发起接口请求 165
11.1.1 发起HTTP请求的方式 165
11.1.2 发起GET请求 166
11.1.3 发起POST请求 167

11.2 实例演示 170

第12 章 Mock Server 172
12.1 自定义Mock Server 172
12.1.1 搭建Mock Server 172
12.1.2 使用Mock Server进行测试 173
12.2 Cypress自带Mock 182
12.2.1 截获接口返回值 184

12.2.2 更改接口返回值 185

第13 章 模块API 187
13.1 cypress.run( ) 187
13.2 cypress.open( ) 188
13.3 Module API实践 188
13.3.1 挑选测试用例运行 188
13.3.2 Module API完整项目实践 191

第五部分 前端自动化测试框架高级篇
——持续集成实践
第14 章 Cypress持续集成实践 202
14.1 持续集成简介 202
14.2 Cypress并行执行测试 203
14.3 Circle CI持续集成实践 204
14.3.1 Circle CI集成Github 204
14.3.2 Circle CI集成Cypress 212

14.4 Jenkins持续集成实践 220

附录A 参考资料 229
A.1 源代码下载 229
A.2 参考资料 229
A.3 联系作者 229