使用Jasmine和karma对传统js进行单元测试
当你拿到十五年前的一堆javascript的代码,你如何对这堆javascript代码写单元测试呢?于是就有了这篇文章。
注意:不需要装任何现代化js框架,包括angular,react,vue之类的,都不需要装!!!
先要安装nodejs
直接cmd进入js所在的目录
通过 npm 安装karma:
npm install --save-dev karma
通过如下命令确认karma安装成功
node ./node_modules/karma/bin/karma --version
global安装karma-cli来直接执行karma命令
npm i -g karma-cli
通过如下命令确认安装成功
karma --version
通过如下命令安装jasmine
npm i -D jasmine-core karma-jasmine karma-chrome-launcher
通过如下命令创建 karma.conf.js 配置文件
karma init
配置karma.conf.js
browsers: ['ChromeHeadless'],
customLaunchers: {
ChromeHeadlessCI: {
base: 'ChromeHeadless',
flags: ['--no-sandbox']
}
}
配置karma.conf.js以让karma能够找到你的测试文件:
files: [
'*.js',
'*.spec.js'
],
exclude: ['karma.conf.js'],
添加test_if_karma_works.js,并ctrl+v以下内容
function add(a, b){
return a + b;
}
添加test_if_karma_works.spec.js,并ctrl+v以下内容
describe('add function unit test.', function(){
it('2 + 3 = 5', function(){
var result = add( 2, 3 );
expect( result ).toBe( 5 );
}); it('2 + 3 = 6, this should faild.', function(){
var result = add( 2, 3 );
expect(result).toBe( 6 );
})
});
通过如下命令开始测试
karma start
或者
node ./node_modules/karma/bin/karma start
通过如下命令安装karma代码覆盖率
npm install --save-dev karma-coverage
修改karma.conf.js
// preprocess matching files before serving them to the browser
// available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
/* 覆盖源文件 不包括测试库文件*/
preprocessors: {
'src/**/*.js': ['coverage']
}, // test results reporter to use
// possible values: 'dots', 'progress'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
reporters: ['progress', 'coverage'], /* 新增的配置项 */
coverageReporter: {
type: 'html',
dir: 'coverage/'
},通过如下命令改为spec模式
npm install karma-spec-reporter --save-dev
修改karma.conf.js
reporters: ['spec'],
git check in (不要签入coverage目录,但是要把node_modules目前签入,因为时过境迁,旧的package会被删掉,只能靠这里的git库来还原了。)
使用Jasmine和karma对传统js进行单元测试的更多相关文章
- Lodop获取全部JS代码,传统JS模版的生成
Lodop模版有两种方法,一种是传统的JS语句,可以用JS方法里的eval来执行,一种是文档式模版,是特殊格式的base64码,此篇博文介绍传统JS模版的生成方法.两种模版都可以存入一下地方进行调用, ...
- Karma +Jasmine+ require JS进行单元测试并生成测试报告、代码覆盖率报告
1. 关于Karma Karma是一个基于Node.js的JavaScript测试执行过程管理工具(Test Runner). 该工具可用于测试所有主流Web浏览器,也可集成到CI(Continuou ...
- 使用jasmine来对js进行单元测试
互联网的快速发展,给web开发人员带来了前所未有的挑战.对于前端开发,前端开发er所需要编写的js早已不是那些寥寥几行的视觉效果代码.代码量的大增,多人协同,人员素质悬殊不齐,这都需要一个标准,来对代 ...
- 传统js和jsx与ts和tsx的区别
一.从定义文件格式方面说 1.传统的开发模式可以定义js文件或者jsx文件2.利用ts开发定义的文件格式tsx二.定义state的状态来说 1.传统的方式直接在构造函数中使用 constructor( ...
- 使用Karma、Mocha实现vue单元测试
Karma Karma是一个基于Node.js的JavaScript测试执行过程管理工具(Test Runner).该工具在Vue中的主要作用是将项目运行在各种主流Web浏览器进行测试.换句话说,它是 ...
- Vue Cli 中使用 Karma / Chrome 执行样式相关单元测试
在 GearCase 开源项目 中,我使用了 Vue Cli 的默认测试框架.因此和样式相关的东西,都无法进行测试.因为它并不类似于无头浏览器,而是存在于虚拟内存之中. 现状 在如下 button.s ...
- Node.js的单元测试框架初体验
Mocha是一个功能丰富的JavaScript测试框架,运行在node.js平台和浏览器端,使异步测试变得简单和有趣.Mocha测试是串行的,允许灵活和准确的报告,同时将未捕获的异常映射到相应的测试用 ...
- 一步步构建自己的AngularJS(1)——项目初始化
Angular1距离2009年发布已经好多年了,Angular2也已经出了Beta版,估计今年就能正式发布.大多数人对于Angular1.X的认识仅限于能够在项目中使用,对于其中的深层原理知道的并不多 ...
- JS相关环境搭建:Nodejs、karma测试框架、jsDuck、Express
第一章:压缩js(nodejs,uglify) 第一步:安装nodejs环境 直接下载http://www.nodejs.org/download/ 下载完成后直接下一步下一步即可,完了我们就具有no ...
随机推荐
- python字典的增删改查
字典dict 知识点: {}括起来,以键值对形式存储的容器性数据类型: 键-必须是不可变数据类型,且是唯一的: -值可以是任意数据类型.对象. 优点:关联性强,查询速度快. 缺点:以空间换时间. 字典 ...
- PythonCrashCourse 第六章习题
使用一个字典来存储一个熟人的信息,包括名.姓.年龄和居住的城市.该字典应包含键first_name .last_name .age 和city .将存储在该字典中 的每项信息都打印出来 person ...
- bluetoothctl命令提示No default controller available
在学习bluetoothctl命令时,执行bluetoothctl,然后执行show,提示No default controller available. 1. 执行hciconfig,发现有hci0 ...
- 构造 IPv6 报文
#!/usr/bin/python from scapy.all import * a=IPv6(nh=58, src='fe80::214:f2ff:fe07:af0', dst='ff02::1' ...
- Linux调用Kaggle API下载数据
1. 登录Kaggle账户,点击My Account 2. Create New API Token得到kaggle.json 3. pip install kaggle 4. 执行kaggle会报错 ...
- 高并发&性能优化(二)------系统监控工具使用
上一篇主要从总体介绍了高并发&性能优化的相关思路和方法,本篇主要介绍系统监控工具. [CPU查看工具] ------top命令(性能) 进入top命令后,按1即可看到每核CPU的运行指标与详细 ...
- Python输入input、输出print
1.输入input input是用于输入数据给变量.通过键盘输入的是字符串,如果需要其他格式,需要做转换.比如int.float类型数据,int() 如下是一个例子: 如果a不进行int转换,那么输入 ...
- virtualenv最佳实战
一 系统环境 windows 10 64-bit 安装python 2.7.18 和python 3.8两个版本 二 安装 默认会把virtualenv安装到系统默认python版本中 pip ins ...
- pymssql 介绍
pymssql包是Python语言用于连接SQL Server数据库的驱动程序(或者称作DB API),它是最终和数据库进行交互的工具.SQLAlchemy包就是利用pymssql包实现和SQL Se ...
- idea vue文件设置tab为四个空格
1.找到vue项目中有个叫.editorconfig的文件,打开可以发现有以下配置项: 2.ctrl+alt+i看看效果(单文件) 3.IDEA中对整个项目进行代码格式化 在项目的左侧树结构中,右 ...