javascript测试框架 Qunit

   大家知道java有个测试框架叫Junit,可以用简单的代码完成单元测试,最近jquery也出了一个测试javascript框架,叫Qunit。下面是jquery官网的关于QUnit的的介绍,希望对大家有帮助。

原文链接:junitcookbook

介绍

   在软件开发中使用自动化的软件测试工具是非常基本的。单元测试是自动测试中的基本内容:针对你的功能的单元测试,最好是你只写一次,每个用到你功能的人都能运行你的测试,而测试的人之间不需要进行任何交流和额外的工作。


   测试的另一个好处是,测试可以驱动软件的开发,也就是“测试驱动开发”,先写好简单的测试,然后针对这个测试写实现代码,知道这个测试通过,然后增加测试内容,在实现它,通过一步步的重复这个过程写出的代码,往往比直接实现写出来的代码更好。


js的单元测试跟其他语言没有什么不同,尽需要一个测试框架来写一个真实的测试。


自动化单元测试

 

问题

    因为你从TDD中收益过,因此你想自动化测试你的应用程序,写一个自己的测试程序也许很吸引人,但包含了很多工作(其中包括兼容不同的浏览器)

 

方案

    在一些js的单元测试框架中,你决定选择了QUnitQunitjquery实现的单元测试框架并且被广泛的应用。

 

    为了用Qunit,你仅仅需要引入两个Qunit文件在你的Html页,Qunit包含qunit.js,执行测试的核心文件,和qunit.css,用于显示测试结果

  

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>QUnit basic example</title>
  <link rel="stylesheet" href="/resources/qunit.css">
</head>
<body>
  <div id="qunit"></div>
  <div id="qunit-fixture"></div>
  <script src="/resources/qunit.js"></script>
  <script>
    test( "a basic test example", function() {
      var value = "hello";
      equal( value, "hello", "We expect value to be hello" );
    });
  </script>
</body>
</html>


在浏览器中打开,结果如下

javascript测试框架 Qunit_第1张图片

 

    在html中,最重要的标签是<body>元素中的<divid="qunit-fixtrue">Qunit的测试结果添加到这个标签中。Test方法来自qunit.js文件,包含两个参数,第一个是字串,表示测试的名字,用来显示在测试结果中,以便区分是哪个测试的结果,后一个是一个functionfunction中包含了测试实际要执行的代码,其中包括一个或多个断言(assertion)这里是equal方法,用于显示测试结果。


    如果想在自己浏览器看一下效果的话,可以下载这个demo。

    

你可能感兴趣的:(QUnit)