如何在我的js测试中使用mock?

时间:2012-06-06 12:59:23

标签: javascript jquery testing qunit sinon

我尝试使用QUnit来测试我的javascript代码。 我有简单的功能:

function Multiply(a, b) {
    return a * b;

}

function CalculateBodyMassIndex(weight, height) {
    return Math.round(weight / Multiply(height, height));

}

function SummAll(array) {
    var summ = 0;
    $.each(array, function (i, el) {
       summ = summ + el;
    });
    return summ;

}

我有两个问题: 1)如何验证函数CalculateBodyMassIndex将被称为Multiply函数?

2)如何验证函数SummAll将从jQuery库中调用$ .each?

感谢等待答案。

3 个答案:

答案 0 :(得分:2)

这是关于如何将sinon.js与QUnit一起用于模拟http://cjohansen.no/en/javascript/using_sinon_js_with_qunit的优秀文章。

sinon中的间谍和存根允许您非常轻松地验证对现有对象的调用。

修改 的 这里的sinon.js文档http://sinonjs.org/docs/#spies显示了如何使用间谍。浏览完整的API文档,了解存根,模拟等的示例。

答案 1 :(得分:0)

只需粘贴以下html并从浏览器中打开即可。

<html>
  <head>
    <title>test</title>
    <link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-1.11.0.css">
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script src="http://code.jquery.com/qunit/qunit-1.11.0.js"></script>
    <script src="http://sinonjs.org/releases/sinon-1.6.0.js"></script>
    <script src="http://sinonjs.org/releases/sinon-qunit-1.0.0.js"></script>
    <script type="text/javascript">
      function Multiply(a, b) {
        return a * b;
      }

      function CalculateBodyMassIndex(weight, height) {
        return Math.round(weight / Multiply(height, height));
      }

      function SummAll(array) {
        var summ = 0;
        $.each(array, function (i, el) {
          summ = summ + el;
        });
        return summ;
      }
    </script>
  </head>
  <body>
    <div id="qunit"></div>
    <script type="text/javascript">
      $(function(){
        test('Multiply', function(){
          $.each([
            [[0, 2], 0],
            [[3, 3], 9],
            [[7, 9], 63]
          ], function(){
            var t = this.toString();
            equal(
              Multiply.apply(this, this[0]), this[1],
              t + ': Multiply ok'
            );
          });
        });

        test('CalculateBodyMassIndex', function(){
          this.spy(window, 'Multiply');
          $.each([
            [[1, 2], 0],
            [[10, 2], 3],
            [[35, 3], 4]
          ], function(i){
            var t = this.toString();
            equal(
              CalculateBodyMassIndex.apply(this, this[0]), this[1],
              t + ': CalculateBodyMassIndex ok'
            );
            ok(Multiply.calledOnce, t + ': call Multiply ok');
            deepEqual(
              Multiply.args[0], [this[0][1], this[0][1]],
              t + ': Multiply args ok'
            );
            Multiply.reset();
          });
        });

        test('SummAll', function(){
          $.each([
            [[1, 2, 3, 4, 5], 15],
            [[2, 3, 4, 5, 6], 20],
            [[3, 4, 5, 6, 7], 25]
          ], function(){
            var t = this.toString();
            equal(
              SummAll(this[0]), this[1],
              t + ': SummAll ok'
            );
          });
        });
      });
    </script>
  </body>
</html>

答案 2 :(得分:-1)

最容易利用函数作用域,并允许可模拟函数的可选参数:

function CalculateBodyMassIndex(weight, height, using) {
  return Math.round(weight / (using || Multiply)(height, height));
} 

然后在你的测试中:

var MockMultiplyRan = false;
var MockMultiply = function(a,b) {
    MockMultiplyRan = true;
    return Multiply(a,b);
}

CalculateBodyMassIndex(200,200, MockMultiply); // arbitrary figures
ok(MockMultiplyRan);