测试JS API Lib的好方法

Question

实际上，我正在编写一个小型JS，以封装对外部Webservice的一些GET和POST调用。是否有一个好的方法/最佳实践如何测试这样的语言？我应该针对GET函数的API编写测试吗？我应该将示例响应放在测试目录中吗？

P.S.：我不能向API发送POST请求，因为它是“实时”系统。

Answer 1

您可能需要使用某种单元测试框架，如@BrianDriscoll所述。外面有很多。

我也遇到了这个问题，我没有为JavaScript找到一个很好的AJAX模拟框架。最后，我创建了嘲弄鸟。

用模拟请求的优点

• 它为您提供了对URL、HTTP方法、状态、请求头、响应头和响应体的细粒度控制
• 很容易禁用所有本机XMLHttpRequest调用并插入支持相同接口的模拟对象，而无需更改测试中的代码
• 很容易使本机XMLHttpRequest启用，但是创建模拟请求并将其注入测试方法
• AJAX变得同步，使单元测试更容易。
• MockingBird可以与任何单元测试框架一起使用
• MockingBird没有外部依赖关系。

Disadvantages

• AJAX变得同步。测试中的代码有可能表现出不同的行为。
• 目前无法测试连接超时。
• 目前无法测试块HTTP响应
• 实际上，您并不是在使用Web服务进行端到端测试，这将需要额外的集成测试(无论如何，您都应该这样做)。
• 当使用MockingBird禁用网络连接时，AJAX请求将不起作用。
• 它不强制执行相同的域策略。您可以模拟通过单元测试但在集成测试中抛出错误的跨域AJAX调用。

一个快速而肮脏的例子：

var request = new MockingBird.XMLHttpRequest()
    .returnsStatus(200)
    .returnsBody('{"message":"I am a teapot"}')
    .returnsHeaders({
        "Content-Type": "text/json"
    });

callSomeFunctionThatUsesAjax(request);

function callSomeFunctionThatUsesAjax(xhr) {
    xhr.onreadystatechange = function() {
        ...
    };

    xhr.open("POST", "/foo");
    xhr.send(null);
}

当无法提供自己的AJAX对象时，还可以为情况设置模拟调用：

MockingBird.XMLHttpRequest.disableNetworkConnections()
    .mock("/posts/123", "GET", {
        status: 404,
        body: "Page not found"
    })
    .mock("/posts/321/comments", "POST", {
        status: 201,
        responseHeaders: {
            "Content-Type": "text/json"
        },
        body: {
            post: {
                id: 321,
                comment: {
                    id: 1234
                }
            }
        }
    });

现在，直接实例化XMLHttpRequest对象的代码甚至不需要知道MockingBird是否存在：

function createComment(postId, text) {
    var xhr = new XMLHttpRequest();

    xhr.onreadystatechange = function() {
        if (this.readyState !== 4) return;

        if (this.status === 201) {
            var data = JSON.parse(this.responseText);

            alert("Created comment: " + data.post.comment.id);
        }
        else if (this.status === 404) {
            alert("Post " + postId + " not found!");
        }
    };

    xhr.open("POST", "/posts/" + postId);
    xhr.send("post[id]=" + postId + "&post[comment][text]=" + escape(text));
}

createComment(123, "Test Test"); // alert's "Post 123 not found!"
createComment(321, "Test Test"); // alert's "Created comment: 1234"