JS单元测试,我工作时主要以mocha + chai 下面时具体的文档:

mocha:

  https://mochajs.org/#asynchronous-code

Chai:

  http://chaijs.com/api/bdd/#method_ownproperty

还是比较简单的所以可以自己查看文档:

例子基于requirejs,并且配置需基于你自己文件目录,红色代码请留意下

要测试的一个排序函数,对对象数组进行升、降序排序

define(['underscore'], function(_) {
function util() {};
//对象数组,根据item中某字段排序
util.sortBy = function () {
var obj = arguments[0], key = arguments[1];
if(!_.isArray(obj) || !key) {
return obj;
}
var sort = arguments[2], j = 1, temp = {};
//交换函数
function swap (obj, index) {
temp = obj[index];
obj[index] = obj[index+1];
obj[index+1] = temp;
}
//sort 默认从小到大 (采用冒泡)
obj.forEach(function() {
for(var i = 0, length = obj.length-j; i < length; i++) {
if (sort && sort.toLowerCase() ==="desc") { //降序
if (!obj[i][key]) {
if (obj[i+1][key]) {
swap(obj, i);
}
} else if (obj[i+1][key] && obj[i+1][key] > obj[i][key]) {
swap(obj, i);
}
} else { //默认升序
if (obj[i][key]) {
if (obj[i+1][key]) {
if(obj[i][key] > obj[i+1][key]){
swap(obj, i);
}
} else {
swap(obj, i);
}
}
}
}
j++;
});
return obj;
} return util;
})

测试页面代码,具体的配置需要根据你自己的环境去配置

<!DOCTYPE html>
<html>
<head>
<title>H5 test</title>
<link rel="stylesheet" type="text/css" href="../../node_modules/mocha/mocha.css">
<script src="../asset/src/h5/vendor/require.js">
</script>
</head>
<body>
<div id="mocha"></div>
</body>
<script type="text/javascript">
(function(){
function nodePath(path) {
return '../../node_modules/' + path + '/' + path;
}; function modulePath(path) {
return './lib/' + path;
};
function vendorPath(path) {
return '../asset/src/h5/vendor/' +path;
};
function widgetPath(path) {
return '../asset/src/widget/' + path;
}; requirejs.config({
urlArgs: Date.now(),
baseUrl: './',
shim: {
mocha: {
exports: 'mocha'
}
},
paths: {
'underscore': vendorPath('underscore'),
'mocha': nodePath('mocha'),
'chai': nodePath('chai'),
'testUtil': modulePath('testUtil'),
'util': widgetPath('util')
}
}); requirejs(['mocha', 'chai'], function(mocha, chai) {
mocha.setup('bdd'); window.expect = chai.expect; //加载测试模块
require(['testUtil'], function() { if(window.mochaPhantomJS) {
window.mochaPhantomJS.run();
} else {
mocha.run();
}
})
});
})();
</script>
</html>

具体的测试代码:

describe('util', function(util) {
var util;
before(function(done){
require(['util'], function(one) {
util = one;
done();
});
}) describe('#sortBy', function() {
it('obj类型数组asc排序', function() {
//expect(util.sortBy([{a:1, b: 1}, {a:4, b:5}, {a:3}, {a:2}, {b:2}, {a:5}], 'a') == [{b:2}, {a:1, b:1}, {a:2}, {a:3}, {a:4, b:5}, {a:5}]).to.be.true;;
var str='';
util.sortBy([{a:1, b: 1}, {a:4, b:5}, {a:3}, {a:2}, {b:2}, {a:5}], 'a').forEach(function(item) {
str = str + item.a +",";
}) expect(str === "undefined,1,2,3,4,5,").to.be.true;
}) it('obj类型数组desc排序', function() {
var str='';
util.sortBy([{a:1, b: 1}, {a:4, b:5}, {a:3}, {a:2}, {b:2}, {a:5}], 'a', 'desc').forEach(function(item) {
str = str + item.a +",";
}) expect(str ==="5,4,3,2,1,undefined,").to.true;
}); it('ddd', function() {
expect(1==2).to.true;
})
});
});

运行结果图

JS 单元测试的更多相关文章

  1. 啥时候js单元测试变的重要起来?

    作为一个菜鸟,开这个专栏其实不合适,但又突然发现这个比以往任何时候都重要,所以还是写写我的感受 首先,在传统的pc上也有大量的web站点和各种项目都有复杂的js,但是基本不做单元测试,为啥呢?因为传统 ...

  2. 玩转Node.js单元测试

    代码部署之前,进行一定的单元测试是十分必要的,这样能够有效并且持续保证代码质量.而实践表明,高质量的单元测试还可以帮助我们完善自己的代码.这篇博客将通过一些简单的测试案例,介绍几款Node.js测试模 ...

  3. 前端测试框架对比(js单元测试框架对比)

    前端测试框架对比(js单元测试框架对比) 本文主要目的在于横评业界主流的几款前端框架,顺带说下相关的一些内容. 测试分类 通常应用会有 单元测试(Unit tests) 和 功能测试(Function ...

  4. 【JS单元测试】Qunit 和 jsCoverage使用方法

          近日在网上浏览过很多有关js单元测试相关的文档,工具,但是,针对Qunit 和 jsCoverage使用方法,缺少详细说明,对于初入前端的人来说,很难明白其中的意思,特此整理这篇文章,希望 ...

  5. js单元测试框架

    js单元测试框架 前端测试框架对比(js单元测试框架对比) 本文主要目的在于横评业界主流的几款前端框架,顺带说下相关的一些内容. 测试分类 通常应用会有 单元测试(Unit tests) 和 功能测试 ...

  6. Qunit 和 jsCoverage使用方法(js单元测试)

    Qunit 和 jsCoverage使用方法(js单元测试) 近日在网上浏览过很多有关js单元测试相关的文档,工具,但是,针对Qunit 和 jsCoverage使用方法,缺少详细说明,对于初入前端的 ...

  7. JS单元测试框架:QUnit

    QUnit:jQuery的单元测试框架,但不仅限于jQuery(从这个工具不需要引用jquery.js可以看出) index.html <!-- 官网 http://qunitjs.com/ - ...

  8. js单元测试

    最近研究了js的单元测试,分享一下心得. 说起单元测试以前还真是不太了解,这次索性了解一番,测试有很多包含单元测试,性能测试,安全测试和功能测试等几方面,本次只介绍一下单元测试. 前端进行单元测试主要 ...

  9. Vue.js—单元测试

    Vue.js--测试 这里采用的是Vue官方工具(Vue-CLI)搭建出来的项目,在这个搭建工具中推荐的两种测试分别是 端到端的测试 E2E 单元测试 Unit Test 端到端的测试(E2E) E2 ...

随机推荐

  1. homework-Agile Software Development

    对敏捷开发的一些思考 这周的作业是对敏捷开发的相关阅读和思考. 在阅读的过程中,可以看到作者是一位具有丰富编程经验的大师.在开发的经历中,作者经历了极限编程等开发过程,但是在作者的多年经验中,作者还是 ...

  2. Grails默认首页的修改

    有些人使用IDEA开发Grails,开发阶段使用Grails自带的默认首页可以方便我们开发,但是开发结束后想要修改默认的首页,如何修改呢? 1.打开grails-app 文件下conf下的UrlMap ...

  3. 野指针、NULL指针和void*

    一.野指针 “野指针”不是NULL指针,是指向“垃圾”内存的指针. “野指针”的成因主要有三种: (1)指针变量没有被初始化.任何指针变量刚被创建时不会自动成为NULL指针,它的缺省值是随机的,它会乱 ...

  4. Python属性、方法和类管理系列之----__slots__属性

    一句话说明 __slots__是用来限制实例的属性的,__slots__可以规定实例是否应该有__dict__属性:__slots__不能限制类的属性. 只有__slots__列表内的这些变量名可赋值 ...

  5. matlab vs python

    (参考)从下图可以清晰看到matlab和python之间的区别 Python是一种编程语言,但与其他变成语言的不同在于:python具有许多的扩展库(通过import引入) Matlab是集合计算环境 ...

  6. iOS 页面间传值 之 单例传值 , block 传值

    ios 页面间传值有许多,前边已经分享过属性传值和代理传值,今天主要说一下单例传值和 block 传值 单例传值:单例模式一种常用的开发的模式,单例因为在整个程序中无论在何时初始化对象,获取到的都是同 ...

  7. Excel技巧收录

    帮老婆弄Excel,自己也把学到的东西记录下,免得以后被问到又给忘了 数据透视,需先在数据透视区域加上表头,如公司名称.销量等,Excel数据透视默认将选择区域的第一行作为表头 VLOOKUP,VLO ...

  8. [JavaScript] 怎么使用JS禁止复制粘贴

    1. 将彻底屏蔽鼠标右键,其实是禁止快捷菜单,因为不光右键可以弹出这个菜单,键盘上空格键右边的windows键也可以激活这个快捷菜单 <table border oncontextmenu=re ...

  9. POJ 3308 Paratroopers(最小割EK)

    题目链接 题意 : 有一个n*m的矩阵,L个伞兵可能落在某些点上,这些点的坐标已知,需要在某些位置安上一些枪,然后每个枪可以将一行或者一列的伞兵击毙.把这种枪安装到不同行的行首.或者不同列的列首,费用 ...

  10. dropdownlist无刷新传值

    既然局部刷新,其实没有必要用服务器控件,即便用了服务器控件,也不应该将AutoPostBack="true" ,这将导致页面回发并刷新,因此去掉下拉框的该属性 至于局部改变div的 ...