无论如何对函数中定义的javascript函数进行单元测试？

Question

我想问一下，我是否可以在 document.ready 中对 ExternalFunction 中的代码进行单元测试？一段时间以来，我尝试了很多东西，但仍然无法弄清楚如何做，我束手无策。

$(document).ready(function () {
    var originalExternalFunction = ExternalFunction;
    ExternalFunction = function(context, param) {
        // trying to unit test the stuff in here!
    }
}

我正在使用 JsTestDriver 进行单元测试。测试声明类似于 TestThisTest.prototype.test_this - function() {};

提前致谢。

Answer 1

由于在您的示例中，ExternalFunction 未在函数范围内声明，因此它是全局的（或至少在ready 外部定义的任何范围内）。因此，您可以通过将其称为全局来对其进行测试。

问题是，为了将函数分配给ExternalFunction，您必须运行ready（如果需要，您可以手动运行）。这意味着如果您将任何其他功能放在ready 中，那么不，它不是可单元测试的。如果您的示例代码准确地反映了现实，那么我想它是可测试的。

这样的结构的重点是隐藏内部功能。如果您不想隐藏它，那么 Anon. 建议在更易于访问的范围内定义 newExternalFunction 就是您所需要的。

如果您的函数需要使用 ready 中的变量作为闭包，您可以这样定义 newExternalFunction：

   var newExternalFunction;
    $(document).ready(function () {
        var originalExternalFunction = ExternalFunction;
        newExternalFunction = function(context, param) {
            // trying to unit test the stuff in here!
        }
        ExternalFunction = newExternalFunction;
    }

在单元测试之前，您仍然需要确保 ready 已运行，但您不必依赖 ExternalFunction 不会被重置为 originalExternalFunction。

Answer 2

你可以这样做：

function newExternalFunction(context, param) {
    //etc.
}

$(document).ready(function () {
    var originalExternalFunction = ExternalFunction;
    ExternalFunction = newExternalFunction;
}

然后在newExternalFunction 上运行单元测试相对简单。

Answer 3

理论上，你可以这样做：

ExternalFunction = function() { }
ExecuteDocumentReady(); // implement a mock on $(document).ready(fn) to store the function, and then execute it here

ExternalFunction(fakeContext, fakeParam);
assert(fakeContext.foo == 12); // or whatever you need it to do

话虽如此，我不确定如何在 javascript 中做到这一点。

Answer 4

您可以使用闭包来生成回调函数：

// create function to make your "extension" function
function createHookFunction(callback) {
  // return a function 
  return function(context, param) {
     var ret;
     // // trying to unit test the stuff in here!


     if (typeof callback == 'function') {
       // if you want to trap the return value from callback, 
       // ret = callback.apply(...);
       callback.apply(this, arguments);
     }
     return ret;
  };
}

// your hook now becomes:
$(document).ready(function() {
  ExternalFunction = createHookFunction(ExternalFunction);
});

// and your unit test becomes:
var funcToTest = createHookFunction();
funcToTest(testContext, testParam);

// And, you could even test that the callback itself gets called

function someTest() {
  var testContext = {}, testParam='test';
  var callbackCalled = false;
  var funcToTest = createHookFunction(function(context, param) {
    callbackCalled = (context === testContext) && (param === testParam);
  });
  return (funcToTest(testContext, testParam) == 'Expected Return') && callbackCalled;
}