您的位置：首页 > Web前端 > JavaScript

js工具之QUnit

2016-03-29 15:56 351 查看

　　QUnit是由jQuery团队开发的一套单元测试工具。官网网址：http://qunitjs.com/。

　　用法：1 我们可以直接下载qunit然后在你的HTML文件中引入js资源以及css样式资源

　　

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>QUnit Example</title>
<!--<link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-1.23.0.css">-->
<link rel="stylesheet" type="text/css" href="css/QUnit.css"/>
</head>
<body>
<div id="qunit"></div>
<div id="qunit-fixture"></div>
<!--<script src="https://code.jquery.com/qunit/qunit-1.23.0.js"></script>-->
<script src="js/QUnit.js" type="text/javascript" charset="utf-8"></script>

<script type="text/javascript">
function demo(num){
return num>5 ? true :false;
}

QUnit.test( "Hello test", function( assert ) {
assert.ok( demo(6), "大于5!" );
});

QUnit.test( "test2", function( assert ) {
assert.equal( "djl 箫氏" ,"djl 箫氏", "true和1值相等" );
});

</script>
</body>
</html>

　　2 当然也可以使用CDN静态资源，上述代码中屏蔽的部分。

　　然后既可以开始了，使用最多的就是ok 断言，用来判断是true还是false；

上面代码中demo函数中的值为6大于5会返回true，所以出现的效果如上图。如果我们改为4，则会是下面的结果。

　　当然还有其他情况也会，是上图的现象，例如下面的情况。

QUnit.test( "ok test", function( assert ) {
assert.ok( true, "true succeeds" );
assert.ok( "non-empty", "non-empty string succeeds" );

assert.ok( false, "false fails" );
assert.ok( 0, "0 fails" );
assert.ok( NaN, "NaN fails" );
assert.ok( "", "empty string fails" );
assert.ok( null, "null fails" );
assert.ok( undefined, "undefined fails" );
});

当然还有equal函数，用来比较两个的值是否相等（不会来比较数据类型）。相当于是“==”，所以它不能用于比较数组和对象。

例：

QUnit.test( "equal test", function( assert ) {
assert.equal( 0, 0, "Zero, Zero; equal succeeds" );
assert.equal( "", 0, "Empty, Zero; equal succeeds" );
assert.equal( 1, "1", "Empty, Empty; equal succeeds" );
assert.equal( true, "1", "Empty, Empty; equal succeeds" );
assert.equal( true, 1, "Empty, Empty; equal succeeds" );
assert.equal( "", "", "Empty, Empty; equal succeeds" );

assert.equal( "three", 3, "Three, 3; equal fails" );
assert.equal( null, false, "null, false; equal fails" );
});

当然如果要比较数组和对象，那么就要你用到same()这个函数。

用法也很简单，大家直接看API文档就好了http://api.qunitjs.com/category/all/

在这里还有几篇文章，值得一看：

张大神：http://www.zhangxinxu.com/wordpress/2013/04/qunit-javascript-unit-test-%E5%8D%95%E5%85%83%E6%B5%8B%E8%AF%95/

国外的一篇：http://code.tutsplus.com/tutorials/how-to-test-your-javascript-code-with-qunit--net-9077

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航