karma+phantomjs+mocha+chai使用心得
来源:互联网 发布:linux怎么设置用户密码 编辑:程序博客网 时间:2024/06/05 16:05
前言
作为一名被逼着开发转测试,后台转前台的苦逼来说,分享一下前端js单元测试的一些使用心得。按照网上的教程来走虽然大部分能够运行,但是部分教程不适用于实际测试环境,所以我来发布一个简单的教程,方便后面的哥们能够尽快地一口吃成胖子,并且让高手来填一些奇怪的坑。
目录
1.测试组件的介绍
2.测试环境的搭建
3.测试案例
4.测试覆盖
5.坑
1.测试组件的介绍
测试组件选取karma为测试管理工具,mocha为测试库,chai为断言库,phantomjs为测试浏览器。
karma:Karma是一个基于Node.js的JavaScript测试执行过程管理工具(Test Runner)。该工具可用于测试所有主流Web浏览器,也可集成到CI(Continuous integration)工具,也可和其他代码编辑器一起使用。这个测试工具的一个强大特性就是,它可以监控(Watch)文件的变化,然后自行执行,通过console.log显示测试结果。
mocha:mocha是一个基于nodejs和浏览器集合的各种特性的JavaScript测试库,并且让异步测试变得简单,支持TDD(测试驱动开发)和BDD(行为驱动开发),在测试中捕获到异常时,会给出灵活准确的报告。
chai:chai是一个基于nodejs的断言库,并且完美支持各种主流的JavaScript测试框架。
phantomjs:phantomjs是一个无页面的浏览器,由于不需要渲染页面,网页的运行时间会大大缩短,该浏览器适合用于测试。
2.测试环境搭建
首先,想要玩js测试请下载nodejs,找自己系统的对应版本,下载安装完成后windows系统下请打开cmd输入node --version,这样nodejs就会配置到环境变量中,可以直接使用。linux系统请自行将nodejs添加到自启动中。如果还不知道我在说什么或者安装完无法使用,请打开这个教程。
安装完成后,windows系统下建立一个文件夹作为测试文件夹,具体的看个人喜好。文件的结构如图
node_modules是当前项目所依赖的nodejs库,spec为测试代码,src为被测试的文件,karma.conf.js和test-main.js是karma测试管理工具自动生成的文件,package.json是依赖js库的信息。
package.json内容:
json格式的数据想必大家都懂,也就不多做介绍。nodejs使用的时候会根据package.json来安装所需要的文件,如果不写版本信息则安装该文件的默认版本。
这一步做完了,请在控制台下进入到这个文件夹,输入npm install即可,全部组件安装完成后,输入karma init,karma会自动生成一些配置信息,放到karma.conf.js,如果在init的时候选择使用requirejs,并且同意创建test-main.js作为引导文件,则会在文件夹下面生成test-main.js。karma init生成的config文件只是一个简略通用的东西,我们可以修改一下完成我们所需要的东西。
3.测试案例
首先,编写一个需要被测试的文件:下面的打印请无视,这是楼主以后要写的一些BDD的坑,等待被填满。从控制台的打印结果可以看出,测试框架加载所需的东西,然后运行,如果通过则不报错,不通过的话嘛
显而易见的错误。
4.测试覆盖
5.坑
结束语
- karma+phantomjs+mocha+chai使用心得
- 前端新手使用karma+mocha+chai+sinon 进行angularjs 单元测试
- Mocha、chai、phantomjs应用小结
- 浏览器端测试:mocha,chai,phantomjs
- mocha + chai
- 使用karma + mocha + sinon 测试 Ajax 请求
- WebStorm集成Mocha + Chai进行js单元测试
- phantomjs使用的一些心得
- 用mocha和chai进行自动化测试(含实例)
- mocha、chai、sinon和istanbul实现100%单元测试覆盖率
- AngularJS单元测试——karma+mocha配置及实例
- Karma的第一次使用
- Mocha 使用教程
- Mocha 使用实例
- 使用 PhantomJS
- karma
- karma
- Vue.js学习系列六——Vue单元测试Karma+Mocha学习笔记
- jsonp和CORS跨域实现
- Problem 033——UVa 540 - Team Queue
- C#串口协议
- 黄聪:Scrapy 轻松定制网络爬虫
- 在Swift中应用Grand Central Dispatch(下)
- karma+phantomjs+mocha+chai使用心得
- 1005. Spell It Right (20)
- 【Linux网络】Linux Socket编程 TCP协议
- 磁盘分区
- 魔方动态壁纸android源码下载
- 改善javascript 性能
- 第一讲:iOS概述
- C语言变长数组 struct中char data[0]的用法
- 智能家居开发-android 蓝牙4.0 开发经验分享