使用QUnit测试JS代码

当我们需要对javascript代码进行unit test的时候,qunit是个非常好的工具来方便我们的测试。qunit是一个非常简单的框架。

首先,在官网(http://qunitjs.com/)下载qunit-x.y.z.js 和qunit-x.y.z.css。

可以把这两个文件放在同一个目录下(比如我放在qunit文件夹下)

如果进行一个功能(函数)的ut,我们需要一个这样子的js文件(比如我的是ut1.js)

test( "hello test", function(){
var result1 = plus(1,2);
var result2 = plus("Hello"," World");
ok (result1 === 3, "Test passed(plus(1,2) equals 3)");
ok (result2 === "Hello World", "Test passed(plus(\"Hello\",\" World\") equals \"Hello World\")");
}); 

(这里我想要测试最简单的plus函数能不能work)

 

同时,需要建一个用于测试的html文件,(比如test.html,内容如下)

 

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>QUnit Test Result</title>
<link rel="stylesheet" href="../qunit/qunit-1.12.0.css">

<script>
function plus(a,b)
{
return a+b;
}
</script>
</head>
<body>
<div id="qunit">
</div>
<div id="qunit-fixture">
</div>

<script type="text/javascript" src="../qunit/qunit-1.12.0.js"></script>
<script type="text/javascript" src="ut1.js"></script>

</body>
</html>

其中,需要加入<link rel="stylesheet" href="../qunit/qunit-1.12.0.css">和<script type="text/javascript" src="../qunit/qunit-1.12.0.js"></script>

最后,打开test.html,则显示测试结果。

 

 

 

 

 

 

posted @ 2014-02-15 10:58  Rambot  阅读(436)  评论(1编辑  收藏  举报