★目 录 Contents
译者序
前言
致谢
●第1章 Vue程序测试介绍 1
1.1 测试的定义 2
1.1.1 手动测试 2
1.1.2 自动化测试 3
1.1.3 测试GitHub的拉取请求 3
1.2 测试概览 4
1.2.1 端到端测试概览 4
1.2.2 单元测试概览 6
1.2.3 快照测试 7
1.2.4 有效地组合测试类型 8
1.2.5 测试驱动开发 9
1.2.6 了解何时不进行自动化测试 9
1.2.7 100%代码覆盖率的谬误 10
1.3 编写Hacker News应用程序 11
1.4 Vue测试概览 12
1.4.1 Vue实例 12
1.4.2 模板和渲染函数 13
1.4.3 了解Vue组件系统 14
1.4.4 单元测试组件 16
●第2章 创建你的第一个测试 18
2.1 了解Vue项目结构 19
2.1.1 了解构建工具 19
2.1.2 使用Vue CLI生成项目 19
2.1.3 了解目录结构 20
2.1.4 了解npm 20
2.1.5 了解package.json文件 22
2.1.6 使用ESLint校验文件 22
2.1.7 编写测试脚本 23
2.1.8 构建项目 24
2.2 Jest简介 24
2.2.1 编写可用性测试 24
2.2.2 了解测试断言 27
2.2.3 避免误报 28
2.2.4 使用describe函数组织测试 29
2.2.5 组件的单元测试 31
2.2.6 使用Jest编译文件 31
2.2.7 挂载组件 32
2.3 Vue Test Utils简介 34
2.3.1 了解API 34
2.3.2 使用shallowMount 35
2.4 使用Chrome Debugger调试测试 36
●第3章 渲染组件输出测试 40
3.1 创建测试规范 40
3.1.1 高级规范 41
3.1.2 创建组件级规范 42
3.2 渲染文本测试 43
3.2.1 向一个组件传递prop 43
3.2.2 组件文本内容测试 44
3.2.3 使用find 45
3.2.4 测试元素的文本内容 46
3.3 测试DOM属性 47
3.4 测试渲染组件的数量 48
3.5 测试prop 51
3.5.1 使用Vue Test Utils props方法 51
3.5.2 避免测试prop过程中的陷阱 52
3.6 测试class 53
3.7 测试样式 54
3.7.1 访问一个包装器元素 55
3.7.2 向一个应用程序添加样式 55
3.8 何时测试渲染的组件输出 56
●第4章 测试组件方法 59
4.1 测试公共组件和私有组件方法 60
4.2 测试定时器函数 64
4.2.1 使用假定时器 65
4.2.2 使用spy测试 67
4.3 向Vue实例添加属性 69
4.4 模拟代码 70
4.4.1 模拟组件中的Vue实例属性 70
4.4.2 了解Jest mock函数 71
4.4.3 使用Vue生命周期钩子 72
4.5 模拟模块依赖 73
4.5.1 使用Jest mock模拟模块依赖 75
4.5.2 测试异步代码 76
4.5.3 适度使用mock 80
●第5章 测试事件 82
5.1 测试原生DOM事件 83
5.2 测试自定义事件 85
5.2.1 测试发射自定义事件的组件 86
5.2.2 测试监听Vue自定义事件的组件 88
5.3 测试输入表单 89
5.3.1 测试文本输入框 90
5.3.2 测试单选按钮 93
5.4 了解jsdom的局限性 95
●第6章 了解Vuex 97
6.1 了解state 98
6.2 Vuex可以解决的问题 99
6.3 了解Vuex store 99
6.3.1 创建一个store 100
6.3.2 了解Vuex mutation 101
6.3.3 了解Vuex action 102
6.3.4 了解Vuex getter 104
●第7章 测试Vuex 107
7.1 了解store设计 108
7.2 向项目中添加Vuex 109
7.3 分别测试Vuex store的组成部分 111
7.3.1 测试mutation 112
7.3.2 测试Vuex getter 113
7.3.3 测试Vuex action 115
7.4 测试一个Vuex store实例 118
7.5 测试组件中的Vuex 123
●第8章 使用工厂函数组织测试 129
8.1 了解工厂函数 129
8.1.1 使代码符合DRY原则 130
8.1.2 通过沿用同一种模式来提升代码质量 131
8.1.3 了解工厂函数的利弊 132
8.2 创建store工厂函数 132
8.3 覆盖工厂函数中的默认选项 133
8.4 创建包装器工厂函数 136
●第9章 了解 Vue Router 141
9.1 了解路由 142
9.1.1 了解服务端路由 142
9.1.2 了解客户端路由 143
9.1.3 了解Vue Router的概念 144
9.1.4 了解动态路由匹配 145
9.1.5 为应用程序添加Vue Router 146
●第10章 测试 Vue Router 150
10.1 测试路由属性 151
10.1.1 测试$route属性 151
10.1.2 测试$router属性 155
10.1.3 避免常见的陷阱 156
10.2 测试 RouterLink 组件 157
10.3 Vuex与Vue Router配合使用 162
10.3.1 把路由添加到store 162
10.3.2 在store中使用路由参数 162
●第11章 测试mixin和过滤器 166
11.1 测试mixin 166
11.1.1 了解mixin 167
11.1.2 为mixin编写测试 168
11.1.3 测试组件中的局部mixin 171
11.1.4 测试组件中的全局mixin 172
11.2 测试过滤器 174
11.2.1 为过滤器编写测试 175
11.2.2 测试使用了Date.now的过滤器 177
11.2.3 测试组件中的过滤器 180
●第12章 编写快照测试 183
12.1 了解快照测试 184
12.1.1 为组件编写快照测试 186
12.1.2 为静态组件编写快照测试 186
12.1.3 为动态组件编写快照测试 187
12.2 将快照测试添加到你的工作流 190
●第13章 测试服务端渲染 192
13.1 了解服务端渲染 193
13.1.1 SSR的优点 193
13.1.2 SSR的缺点 195
13.2 测试服务端渲染的组件 196
13.2.1 使用Vue Server Test Utils 197
13.2.2 使用render遍历服务端渲染的标签 199
13.3 使用SuperTest测试状态码 200
13.4 隐式测试SSR 203
●第14章 编写端到端测试 205
14.1 了解端到端测试 206
14.1.1 高效地使用端到端测试 206
14.1.2 了解Nightwatch和WebDriver 207
14.2 把Nightwatch添加到项目中 208
14.2.1 安装依赖项 208
14.2.2 配置Nightwatch 209
14.2.3 添加一个可用性测试 210
14.2.4 编写一个端到端测试脚本 211
14.3 使用 Nightwatch编写端到端测试 212
14.3.1 选择要编写哪些端到端测试 213
14.3.2 为路由编写端到端测试 213
14.3.3 为动态数据编写端到端测试 215
14.4 在多浏览器运行端到端测试 217
14.5 接下来何去何从 218
附录 A 安装开发环境 220
附录 B 运行生产构建 226
附录 C 练习题答案 228
· · · · · · (
收起)
0 有用 ankh04 2022-11-14 19:15:30 湖北
挺好的书,讲清楚了前端测试到底该做什么,以及该怎么做。现在是2022年,随书代码已经跑不通了(在package里更新下版本还是可以跑的),vue2也更新到vue3了,前端发展确实好快呀...
0 有用 LAERPEEK 2023-12-26 16:38:33 中国台湾
好评,算是很好的Vue.js应用测试入门教程。本书的缺点在于时间上已经太久远了。 这里分享一下我在node16下,通过vuecli创建的项目。项目中包括了完整的1-12章内容。(13章SSR,14章e2e个人还没有能力解决。)希望给大家一个参考作用。 仓库地址:https://github.com/laerpeeK/vue2-hacknews-2023
0 有用 Joseph_L 2023-10-07 10:06:11 北京
作为 Vue.js 的测试第一课还算不错的教程,搭配官网的 hand book,前端单测就算入门了。 注意这本书出版于 2019 年,作者用的环境是 node@8.1.1,npm@5.0.4,记得切换到对应的版本上,否则各种报错,令人头秃
0 有用 Utopia 2020-03-19 21:18:54
超级大佬!Vue之父尤雨溪推荐的书!不得不读
0 有用 qitian7 2021-01-05 11:31:05
对于前端自动化(vue)测试来说,是一本非常好的书,讲的很详细,力荐
0 有用 LAERPEEK 2023-12-26 16:38:33 中国台湾
好评,算是很好的Vue.js应用测试入门教程。本书的缺点在于时间上已经太久远了。 这里分享一下我在node16下,通过vuecli创建的项目。项目中包括了完整的1-12章内容。(13章SSR,14章e2e个人还没有能力解决。)希望给大家一个参考作用。 仓库地址:https://github.com/laerpeeK/vue2-hacknews-2023
0 有用 Joseph_L 2023-10-07 10:06:11 北京
作为 Vue.js 的测试第一课还算不错的教程,搭配官网的 hand book,前端单测就算入门了。 注意这本书出版于 2019 年,作者用的环境是 node@8.1.1,npm@5.0.4,记得切换到对应的版本上,否则各种报错,令人头秃
0 有用 ankh04 2022-11-14 19:15:30 湖北
挺好的书,讲清楚了前端测试到底该做什么,以及该怎么做。现在是2022年,随书代码已经跑不通了(在package里更新下版本还是可以跑的),vue2也更新到vue3了,前端发展确实好快呀...
0 有用 皮蛋周 2021-06-19 20:43:44
作者是vue核心人物 循序渐进的讲解了如何编写vue应用的测试 受益匪浅
0 有用 qitian7 2021-01-05 11:31:05
对于前端自动化(vue)测试来说,是一本非常好的书,讲的很详细,力荐