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. python 删除文件和文件夹

    1.删除文件 '''删除文件 ''' def DeleteFile(strFileName): fileName = unicode(strFileName, "utf8") if ...

  2. Spring中的一个错误:使用Resources时报错(The annotation @Resources is disallowed for this location)

    在学习Spring的过程中遇到一个错误:在使用注解@resources的时候提示:The annotation @Resources is disallowed for this location 后 ...

  3. Ubuntu下Qt编译报错“cannot find -lGL”的解决方案

    转自cannot find -lGL Solved the problem by installing the "libglu1-mesa-dev" package. sudo a ...

  4. php邮件发送 phpmailer

    首先要安装phpmailer开源项目. 将class.phpmailer.php转移到php文件夹下, 编写代码: <?php require("class.phpmailer.php ...

  5. 转--Server “**” has shut down the connection prematurely一例分析

    近几天在性能测试过程中,发现loadrunner Controller经常报 Server “**” has shut down the connection prematurely .概率很高,现象 ...

  6. spin_lock & mutex_lock的区别?

    http://blog.csdn.net/sunnytina/article/details/7615520   为什么需要内核锁? 多核处理器下,会存在多个进程处于内核态的情况,而在内核态下,进程是 ...

  7. 如何用CURL并解释JSON

    CURL *curl; CURLcode res; struct curl_slist *headers=NULL; // init to NULL is important headers = cu ...

  8. 忘记commit的一次教训

    由于业务需求,已经上线的系统新增加了一些需求,其中一个需求是,从一个SQLSERVER数据库导入数据到生产的ORCLE数据库, 由于我的失误导致系统上线后 生产的Oracle数据没有导入成功,但是在本 ...

  9. JS 中Promise 模式

    异步模式在web编程中变得越来越重要,对于web主流语言Javscript来说,这种模式实现起来不是很利索,为此,许多Javascript库(比如 jQuery和Dojo)添加了一种称为promise ...

  10. 《BackboneJS框架的技巧及模式》(4)完结篇

    <BackboneJS框架的技巧及模式>(4)完结篇 本文紧接第二部分:<BackboneJS框架的技巧及模式(3)> 作者:chszs,转载需注明.博客主页:http://b ...