如何测试单元测试基于jQuery的代码?

时间:2015-07-01 23:11:17

标签: javascript jquery unit-testing

我在名为index.js的文件中有以下代码。我想测试其中的一些函数addprint是主要函数。

(function($){
  "use strict";

  $(function(){

    var add = function(a, b){
    // ...
      },
    print = function(str){
    // ...
      },
      setup = function(){
    // ...
      },
      init = function(){
    // ...
      };

      setup();
      init();
  });
})(jQuery);

我该怎么办? 这种编码方式是否会在客户端添加任何安全性?我所拥有的只是在客户端运行的代码。没有服务器参与任何事情。

我试过了:

var outerObj = (function(greet){
    var innerObj = (function(){
        return {test: function(){ console.log(greet); }}
    })();
    return innerObj;
})("hi");

outerObj.test();

但是,在我的情况下,innerObj行在等号的右侧有一个$,使控制台叫喊错误,喊出 $(...)不是函数< / strong>即可。 我同意,这是一个单个文档对象的数组。

在任何启用了jquery的网页控制台中查看var a = (function(){ var val = $(function(){return 10;})(); })();以查找错误。

即使我抛弃外壳并将$(function() {});带出来。我该怎么测试呢?

它仍然是一个对象,仍然是一个错误。

我可以执行什么样的测试,单位,bdd等以及如何进行?

1 个答案:

答案 0 :(得分:0)

我不太清楚你在这里使用的是什么模式 - 它看起来像是一种反模式。它不可测试,并且不会暴露任何实际使用行为。我强烈推荐Addy Osmani阅读(或至少略读)Javascript Design Patterns,免费提供。

对于单元测试,我总是在简单的构造函数模式和最容易使用的显示模块模式之间找到一个快乐的中点。

var x = function($){
"use strict";

  var add = function(a, b){
     alert('add');
    },
    print = function(str){
     return 1;
    },
    setup = function(){
      alert('setup');
    },
    init = function(){
      alert('init');
    };

  init();
  setup();

  return {
      add: add,
      print: print
  };
};

var y = new x(jQuery);

在上面的示例中,y将提供addprint方法。查看this fiddle上的示例测试。

作为旁注,我最近一直在使用优秀的QUnit framework来设置和运行我的JS单元测试。这是由jQuery团队,所以你知道它会很好;)。 我还建议您查看BlanketJS报告覆盖率,并qunit-parameterize设置多个测试用例。

对于它的价值,BDD不是一种“测试类型”,而是一种工作方式。对于您应该进行的测试 - 单元测试和集成测试是最重要的2,IMO。我使用QUnit进行单元测试,使用Selenium进行NUnit进行集成测试。