javascript - 我不知道如何用 Qunit 测试这个？

Question

我想测试这个功能:/js/lib/front.js

var Front = function(){
  this.onSignUp = function(){
    if (!Form.assertInput("email")) {
        $("input[name=email]").focus();

        this.showHiddenMessage("Email not set.");

        return false;
    }
 }

我有:/js/lib/form.js

function Form() {
     this.assertInput = function (name, defaultValue) {
    var text = $("input[name=" + name + "]").val();

    if (defaultValue != null) {
        if (defaultValue && text == defaultValue) 
            return false;
    }


    if(this.trim(text)) return true;

    return false;
}
}

这个简单的测试通过了:

test("Front", function() {
    var front = new Front()
    ok(front);

 });

但是如果我这样写:

test("On Sign Up ", function() {
    var front = new Front()

    equal(front.onSignUp(),false,"passing test");

 });

我有错误:在测试 #1 中死亡:Form.assertInput 不是函数

我不明白，我需要在这样的函数中测试什么以及如何将函数包含在另一个函数中？

Answer 1

我保存了一个可用的 fiddle here .作为旁注，您可能想查看有关使用 qUnit 的教程，here .您需要注意的一件事是在声明函数时。它说 Form.assertInput 不是一个函数，因为你不能那样访问它。您需要使用 this 关键字，它指的是当前上下文。代码应该是这样的:

var Form = function () {
    //good to have assertInput first if you're using it in a later function
    this.assertInput = function (name, defaultValue) {
        var text = $("input[name=" + name + "]").val();

        if (defaultValue != null) {
            //safer to explicitly close your if statements with {}
            if (defaultValue && text == defaultValue) {
               return false;
            }
        }

        if ($.trim(text)) { return true; }

        return false;
    };

    this.showHiddenMessage = function (message) {
        alert(message);
    };

    this.onSignUp = function() {
        //this will point to the current context, in this case it will be Form class
        if (!this.assertInput("email")) {
            $("input[name=email]").focus();

            this.showHiddenMessage("Email not set.");

            return false;
        }
    };
};

此外，在您提供的示例代码中，您还缺少 Front 类。所以我像这样在我的 fiddle 中创建了一个虚拟的:

var Front = function() {};

以下是运行的测试:

$(document).ready(function() {
    test("Front", function() {
        var front = new Front();
        ok(front);

    });
    test("On Sign Up ", function() {
       var form = new Form();
       equal(form.onSignUp(), false, "passing test");
    });
});