这个博客已经过去了很久……

不过,你可以通过以下方式找到我

现在的位置: 首页 > 谈前端 > JavaScript > 正文
单元测试框架
2014年02月13日 JavaScript ⁄ 共 1261字 等你评论

简介

单元测试是一种测试手段,由开发人员或白盒测试人员编写,针对某个程序单元(如:类、接口、方法),用于检验程序逻辑是否能产生预期的结果。

本单元测试框架基于YUI Test开发,支持通过URL参数引入单元测试模块文件,方便开发人员编写测试用例,在页面上运行测试、查看测试结果。同时,也将单元测试代码与生产代码分离。

运行环境

  • 支持的浏览器:IE 6-9、FireFox、Chrome、Safari、Opera
  • JS框架:YUI 3.3.0+

使用手册

单元测试框架对象为静态对象:C.UnitTester,基于YUITest开发。

  1. 被测试页面需要引入单元测试框架Loader脚本,以解析URL参数,装载指定单元测试模块,如下:

    <script src="http://a.tbcdn.cn/apps/lottery/common/js/base/unit-test-stub.js" type="text/javascript"></script>
  2. 创建单元测试模块:模块名与文件名需要保持一致,否则,该模块无法正确加载(例如,模块3d-test应保存为3d-test.js)。每个测试模块中可包含多个测试用例。示例代码:

    YUI.add("3d-test", function(Y)  // 模块名与文件名要保持一致(该模块文件名应为3d-test.js)
    {
      ...
    }
  3. 开发测试用例:使用断言对程序单元进行检验,例如:

    var testCase = new Y.Test.Case(  // 创建测试用例
    {
      name: "--- XXX测试用例 ---",  // 测试结果(Console)中显示的测试名称
    
      setUp: function()  // 测试准备
      {
        ...
      },
      tearDown: function()  // 结束清理
      {
        ...
      },
    
      testSomething: function()
      {
        Y.Assert.areEqual(...);
      },
      testSomethingElse: function()
      {
        Y.Assert.areEqual(...);
      }
    });
    // 向框架注册单元测试用例,参数:测试用例唯一名称(String),用例显示名称(String),测试用例对象(Y.Test.Case)
    C.UnitTester.addTest("testName", "显示名称", testCase);  // 可添加多个测试用例
  4. 运行测试:打开被测试页面,在URL中添加参数_unitTestModule,参数值为测试模块文件名(包含路径,多个文件以“,”分隔),例如:http://a.tbcdn.cn/.../xxx.shtml?_unitTestModule=....../js/3d-test.js,testXXX.js
  5. 查看结果:系统自动加载指定的单元测试模块,并显示在页面右上角。其中,每个测试用例显示为链接形式,单击后即运行该测试用例,并显示在YUI Console中。

参考资料

  • YUITest:http://yuilibrary.com/yui/docs/test/
  • 淘宝开源的简单易用的前端单元测试工具:totoro 

友荐云推荐
×