使用 QUnit 和 Sinon 发出事件调用的模拟函数答案

【问题标题】：Issue Mocking Function Invoked by Event with QUnit and Sinon使用 QUnit 和 Sinon 发出事件调用的模拟函数
【发布时间】：2013-08-15 08:11:08
【问题描述】：

我的目标是模拟 runProcedure 函数并检查它是否在用户点击后被调用。但是，即使可以清楚地看到一旦用户单击页面并且 miniWindowShowing 变量为false（即页面加载时）调用了 runProcedure 函数，测试仍继续失败。谁能解释如何使用带有 sinon 的 QUnit 来实现这个目标？下面是我正在使用的代码。

QUnit HTML 页面

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Function Testing</title>
  <link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-1.12.0.css">
</head>
<body>
  <div id="qunit"></div>
  <div id="qunit-fixture"></div>
  <script src="http://code.jquery.com/qunit/qunit-1.12.0.js"></script>
  <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
  <script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
  <script type="text/javascript" src="http://sinonjs.org/releases/sinon-1.7.3.js"></script>
  <script type="text/javascript" src="http://sinonjs.org/releases/sinon-qunit-0.8.0.js"></script>

  <script type="text/javascript" src="Function Source.js"></script>
  <script type="text/javascript" src="TestSuite.js"></script>
  <script>
    test( "Test Click Calls Function", testClickCallsFunction);
  </script>
</body>
</html>

JavaScript 测试文件

// Test that when user clicks on the page, a function is called
function testClickCallsFunction(){

    var event = $.Event("click");   
    var funcSpy = sinon.spy(runProcedure);
    $(document).trigger(event);

    ok(funcSpy.called);
}

要测试的 JavaScript 函数

var miniWindowShowing = false;

$(document).ready(function () {

    $(this).click(function (e) {
        //Ignore input events if the mini window is showing
        if(!miniWindowShowing)
        {
            runProcedure();         
        }
    });

})

function runProcedure() {

}

【问题讨论】：

标签： jquery mocking qunit sinon

【解决方案1】：

您创建间谍的方式存在一个小问题。 sinon.spy(runProcedure) 使用传递的函数创建一个新的 spy，但它不会用该 spy 替换原始函数。因此，当您调用 runProcedure 时，它仍然是原始功能。要使用 spy 覆盖函数，您必须使用以下语法：sinon.spy(window, 'runProcedure')，它将用 spy 替换全局命名空间中的函数 runProcedure。

【讨论】：

感谢您的回复，但是当我这样做时，我收到以下错误：Attempted to wrap undefined property function runProcedure(){} as function。 var funcSpy = sinon.spy( window, runProcedure) 是新行；
您想念runProcedure 周围的'' 吗？还是这只是在错误消息中？