单元测试在后台开发中非常流行和普及,在前端开发中则使用的非常少;在前端JavaScript单元测试在类库中的应用还是非常普及,但在真实项目中应用还是不太广泛;就算能在项目中应用到,覆盖率也不是特别高。 Javascript单元测试现状 根据一些论坛的调查数据,我们可以看到超过半数以上的开发人员是不写单元测试的,我们下面看看这些数据,以及一些前端测试框架的市场占有额吧。
2011年报告: 58%的人不写测试;Jasmine (44%);QUnit (41%);Vows(13%);Express/Mocha(11%);Nodeunit(8%)。 2012年报告:51%的人不写测试;Jasmine (45%); Mocha(41%);QUnit (31%);Vows(8%)。 来自:http://dailyjs.com/2012/12/24/javascript-survey-results/
如下图: 2013061838885165 2013061838885601 不难看出连续两年,Jasmine的市场占用额是比较多的,这也是我们之所以选Jasmine作为单元测试框架的原因之一。 Javascript单元测试难点 高耦合的JavaScript代码 高耦合的JavaScript代码很难找到单元测试的切入点,也很难写出高效的测试代码。 DOM的交互 与DOM交互测试难处在于:你需要准备测试对应的HTML代码片段,然后让你想测试的JavaScript在HTML上执行,最后在验证DOM上面元素的变化。 Ajax和异步响应方法 涉及到Ajax的部分比较不太好进行单元测试, 难点有几个:
    1.        异步响应, 必须有stop() 方法才可能进行;
    2.        数据在传递过程中容易出错。
Javascript单元测试解决方案 对于高耦合的JavaScript代码,我们需要的不是从如何写单元测试下手。而是需要从本身代码下手,对我们原来的代码进行解耦,使其可测试。我们可以利用一些框架来强化我们的JavaScript框架和标准(JavaScriptMVC, Backbone.js, Knockout.js, RequireJS和CommonJS等)。 如果我们第一点做好了,那么我们第二个难点就好解决了。将我们的脚本涉及的DOM最小化,然后我们在测试的前插入到body中,当监测完它的变化并测试完后再将这个DOM删除。这里的复杂度和性能的高低,取决与你JavaScript的设计。当然这里你也可以将这些必须的HTML代码直接写在Reporter页面,这里不推荐这种方法。 Ajax的JavaScript单元测试方法有三种: 1. 测试发送数据; 2. 测试接收数据; 3. 测试页面响应(例如刷新页面的变化) 这里推荐使用第一种方法。 具体如何用Jasmine来实现这些测试,后面再分享。
  来自:http://www.monring.com/front_end/javascript-unit-test-case.html