JavaScript重构之JavaScript的测试

　　进行JavaScript重构时，我希望引入易于使用的测试框架来保证重构的顺利进行，未来能持续通过测试代码对JavaScript逻辑的正确性做保障。

　　JsUnit （http://sourceforge.net/projects/jsunit/，http://www.jsunit.net/）

　　JsUnit是一个独立的JavaScript单元测试框架，和JUnit差不多，没有上手难度，包括传统的setUp和tearDown，提供的assert方法也和JUnit类似，多了assertNaN和assertUndefined等等JavaScript特有的方法。测试页面必须在head里面引入jsUnitCore.js这个js文件。

　　测试套件的支持：提供了addTestPage和addTestSuite；

　　测试日志的支持：包括warn、info和debug三种日志级别，前端编码不似后台代码，正式代码中不宜使用过多log，再说log也只有FF下才支持，现在好了，在测试代码里尽情打吧。

　　千言万语不及一个例子：

   
   
   
   

    
    
    
     
    
    
    
    script language
    
    
    
    =
    
    
    
    "
    
    
    
    javascript
    
    
    
    "
    
    
    
     src
    
    
    
    =
    
    
    
    "
    
    
    
    jsUnitCore.js
    
    
    
    "
    
    
    
    /
    
    
    
    script
    
    
    
    

    
    
    
    script language
    
    
    
    =
    
    
    
    "
    
    
    
    javascript
    
    
    
    "
    
    
    
     src
    
    
    
    =
    
    
    
    "
    
    
    
    play.js
    
    
    
    "
    
    
    
    /
    
    
    
    script
    
    
    
     
    
    
    
    //
    
    
    
    模块JS
    
    
    
    

    
    
    
    
    function testWithMainProcess() {
        assertEquals(
    
    
    
    "
    
    
    
    Web play url
    
    
    
    "
    
    
    
    , 
    
    
    
    "
    
    
    
    ##http://...##
    
    
    
    "
    
    
    
    , webOnlinePlay());
    }
   
   
   
   

项目的代码里到处是Ajax调用，要做单元测试，看来打桩是不可避免了。Mock类的工具有许多，比如适合JQuery的QMock：

   
   
   
   

    
    
    
    var
    
    
    
     mockJquery 
    
    
    
    =
    
    
    
     
    
    
    
    new
    
    
    
     Mock();
   mockJquery
      .expects(
    
    
    
    1
    
    
    
    )
      .method(
    
    
    
    '
    
    
    
    ajax
    
    
    
    '
    
    
    
    )
      .withArguments({
         url: 
    
    
    
    '
    
    
    
    http://xxx,
         success: Function,
         dataType: "jsonp"
      })
      .callFunctionWith({ feed : { entry : "data response" }}); 
   
   
   
   

　　这个桩正是mock了一个假的ajax jason返回：[feed:[entry:"data response"]]，看看，使用就和以前接触过的EasyMock差不多嘛。

　　对于JavaScript测试框架感兴趣的同学还可以了解一些其他的测试框架，例如JSpec。

　　单元测试代码建议就放在模块的包内：test.html，即便理想状况下，模块单独发布时，也是伴随着测试用例的可靠的前端代码。

　　从哪些JavaScript代码开始做？

　　1、函数式的代码。这样的代码保证独立性好，也不需要打什么桩，测试成本低。

　　2、复杂的逻辑。

　　是否尝试TDD？不建议在我们团队内部使用，前端TDD需要更高的技巧，对人的因素要求更高。如果有一天，后台Java代码的TDD做好了，那么换成JavaScript的代码，没有本质区别。

　　如果效果得当，为什么不能把JavaScript的UT集成到ICP-CI上作为持续集成的一部分呢？