整合jsTestDriver和Qunit
由于jsTestDriver和Qunit各有优势,因此我们可以考虑对其进行整合。比如,我们可以将jsTestDriver编写的脚本移植到Qunit中去,由于它们的断言参数顺序有不同,因此可以修改一下,编写名为jsTestDriverInQunit.js的脚本如下:
function TestCase(name, tests){
if(tests != null)
module(name);
for(var key in tests){
if(tests[key] instanceof Function && key.indexOf("test") == 0){
test(key,tests[key]);
}
}
return function(){};
}
function assertEquals(arg0,arg1){
equals(arg1,arg0);
}
function fail(msg){
ok(false,msg);
}
if(tests != null)
module(name);
for(var key in tests){
if(tests[key] instanceof Function && key.indexOf("test") == 0){
test(key,tests[key]);
}
}
return function(){};
}
function assertEquals(arg0,arg1){
equals(arg1,arg0);
}
function fail(msg){
ok(false,msg);
}
并且将testrunner.html修改如下:
<DOCTYPE html>
2. <html>
3. <head>
4. <script src="http://code.jquery.com/jquery-1.6.4.min.js" type="text/javascript"></script>
5. <script src="qunit.js" type="text/javascript"></script>
6. <script src="jsTestDriverInQunit.js" type="text/javascript"></script>
7. <link rel="stylesheet" media="all" href="qunit.css" />
8.
9. <script src="src/mystuff.js" type="text/javascript"></script>
10. <script src="src-test/mystuff.js" type="text/javascript"></script>
11. </head>
12. <body>
13. <h1 id="qunit-header">MyStuff</h1>
14. <h2 id="qunit-banner"></h2>
15. <h2 id="qunit-userAgent"></h2>
16. <ol id="qunit-tests"></ol>
17. </body>
18. </html>
2. <html>
3. <head>
4. <script src="http://code.jquery.com/jquery-1.6.4.min.js" type="text/javascript"></script>
5. <script src="qunit.js" type="text/javascript"></script>
6. <script src="jsTestDriverInQunit.js" type="text/javascript"></script>
7. <link rel="stylesheet" media="all" href="qunit.css" />
8.
9. <script src="src/mystuff.js" type="text/javascript"></script>
10. <script src="src-test/mystuff.js" type="text/javascript"></script>
11. </head>
12. <body>
13. <h1 id="qunit-header">MyStuff</h1>
14. <h2 id="qunit-banner"></h2>
15. <h2 id="qunit-userAgent"></h2>
16. <ol id="qunit-tests"></ol>
17. </body>
18. </html>
这样一来,我们无论是使用jsTestDriver还是使用Qunit,都可以都使用同一套测试用例了。
此外,还有一个开源项目提供了将Qunit转化为jsTestDriver的功能,项目地址为:
http://code.google.com/p/js-test-driver/wiki/QUnitAdapter。
小结
本文简单介绍了如何使用两款Javascript单元测试工具进行前端的开发单元测试,前端的单元测试在复杂的前端Javascript开发中,能够保证前端开发的质量,值得前端开发者仔细研究学习。