Sinon.js,QUnit和Jquery。尝试通过FakeXMLHttpRequest验证发布的数据

时间:2014-06-26 05:02:35

标签: javascript ajax json qunit sinon

我有以下QUnit测试用例,它试图验证通过JQuery ajax请求发送的已发布数据:

test("ajax tests", function () {
    var xhr = sinon.useFakeXMLHttpRequest();
    var requests = sinon.requests = [];

    xhr.onCreate = function (request) {
        requests.push(request);
    };

    var callback = sinon.spy();
    var mockData = {mockData: "dummy content"}

    $.ajax('/some/article', { success: callback, data: mockData, method: 'post' });

    equal(sinon.requests.length, 1);
    equal(sinon.requests[0].url, "/some/article");
    equal(JSON.parse(sinon.requests[0].requestBody).mockData, mockData)

});

JSON.parse失败,因为请求正文的格式为:mockdata=dummy+content

由于数据的编码方式(用+符号替换空格),因此对内容进行解码,然后使JSON可解析非常困难。

最终目标是使用伪造的XHR对象动态验证请求数据。我更喜欢这个,而不是模仿jQuery帖子或ajax方法。因为如果我在发送AJAX请求的实现之间切换,我不希望我的单元测试失败。

有没有人对此有任何好运?

参考文献:

演示以上代码:http://jsfiddle.net/ZGrTK/66/

一篇文章,展示了我想要实现的目标:http://philfreo.com/blog/how-to-unit-test-ajax-requests-with-qunit-and-sinon-js/

(代码无法为我工作。我怀疑有什么东西可以处理backbone.js。虽然我没有使用该框架的经验。)

1 个答案:

答案 0 :(得分:2)

对你的考试有几点评论:

  • jQuery ajax()文档说如果data参数不是字符串,它将使用$.param()转换为查询字符串。您可以通过传递字符串来避免转换。
  • 最后一个断言将[Object].mockData与名为mockData的变量进行比较。我猜这只是一个错字。

这是一个稍微修改过的测试(JSFiddle):

test("ajax tests", function () {
    var xhr = sinon.useFakeXMLHttpRequest(),
        requests = [],
        mockURI = '/some/article',
        mockData = {
            someProperty: "dummy content"
        };

    xhr.onCreate = function (request) {
        requests.push(request);
    };

    $.ajax(mockURI, {
        data: JSON.stringify(mockData),
        type: 'POST'
    });

    equal(requests.length, 1);
    equal(requests[0].url, mockURI);
    equal(JSON.parse(requests[0].requestBody).someProperty, mockData.someProperty);

    xhr.restore();
});

至于文章,我并没有真正研究代码,但它似乎有效:JSFiddle