如何对调用 getJSON 的 javascript 函数进行单元测试答案

【问题标题】：How to unit test javascript function that calls getJSON如何对调用 getJSON 的 javascript 函数进行单元测试
【发布时间】：2015-03-03 08:15:51
【问题描述】：

我已经在单元测试中苦苦挣扎了 2 天，在异步测试方面我无法实现。我是单元测试新手，我不明白为什么这不起作用。

我有一个 login.js 文件，它调用 $.getJSON(url, data, function) 并返回一个带有登录状态（“成功”或“失败”）的字符串。对 $.getJSON 的调用使用 mockjax 来获取数据（它包装了一个 ajax 调用）。

当使用 jQuery click 事件从测试网页调用登录功能时，登录功能正常。但现在我正在尝试使用 Qunit 和 PhantomJS 运行无头测试。

问题似乎在于测试没有等待 $.getJSON 调用来获得结果（即使使用超时）。有什么线索吗？这是代码。

var login = function(user, pass){
    $.getJSON("loginURL", {"user":user, "pass":pass}, function(response){
       if(response.status === "success"){
           //do something
           return "success";
       } 
       else{
           //do something else
           return "fail";
       } 
    });
};

test.js

test("Test login", function(){
    var user = "user1", pass = "pass1";
    var done = assert.async();
    var result = login(user, pass);
    setTimeout(function(){
    assert.equal(result, "success", "expect login succeded");
    done();
    },1000);
});

在我得到的测试结果中：

预期：“成功”

结果：未定义

【问题讨论】：

您的login 函数没有返回任何内容。所以result 总是未定义是正常的。您在login 函数中所做的只是调用$.getJSON，但您没有返回任何结果。在成功回调中，您尝试返回一些结果，但显然这并没有多大作用，因为没有人在阅读此结果。
How to return the response from an asynchronous call? 的可能重复项

标签： javascript unit-testing phantomjs getjson qunit

【解决方案1】：

您的login 函数应该是异步的，因为它的结果取决于服务器的响应。

所以让我们像这样重写函数：

function login(user, pass, done) {
    $.getJSON(..., function (res) {
        done(res.status == 'success')
    })
}

然后你可以像这样测试（假设是 mocha）：

describe('...', function () {
    it('login()', function (done) {
        login('user', 'pw', function (isLoggedIn) {
            assert(isLoggedIn)
            done()
        })
    })
})

【讨论】：

嗨@ayanami！感谢您的快速回复。我没有明白这个调用是如何工作的（res.status == 'success'）然后在 test.js 上，什么是 isLoggedIn ？抱歉，但我不明白如何在 qunit 上进行测试：/

【解决方案2】：

按照@ayanami 的建议重写我的登录功能后，代码运行顺畅，看起来像这样：

var login = function(form, cb){
   $.getJSON("loginURL", {"user":user, "pass":pass}, function(response){
        if(response.status === "success"){
            //do something
        }
        else{
            //do something else
        }
       cb(response.status);
    });
};

test.js (qunit)

test( "Testing login", function( assert ) {
    var done = assert.async();
    var cb = function(param){
                assert.equal(param,"success", "Expect getJSON/login to success");
                done();
            };
    login(user, pass,cb);
});

【讨论】：