javascript - 如何 jasmine 测试 jQuery post ajax 属性(例如 url)

标签 javascript jquery ajax jasmine sinon

我有一个基本的 jQuery 帖子到一个 url,我想测试它。我已经做了 Sinon 创建服务器测试,但我也想测试方法中给出的 url 和属性,但我收到错误,因为 jQuery.post(url, data).always(callback) 不能在 undefined object 上调用。

我还应该测试什么?

这是我的 jQuery 代码。

define(['jquery'], function (jQuery) {
    var ProductListingService = function () {
        var self = this;

        self.create = function (sku, quantity, price, callback) {
            var url = '/url';
            var data = { 'sku': sku, 'quantity': quantity, 'price': price };

            jQuery.post(url, data).always(callback);

        };
    };

    return ProductListingService;
});

这是我的测试

define(['service/ProductListingService'], function (ProductListingService) {
    describe('ProductListingService', function () {

        var productListingService, server;

        beforeEach(function () {
            productListingService = new ProductListingService();
            server = sinon.fakeServer.create();

        });

        it('posts and call to /url', function () {
            server.respondWith('POST', '/url',
                                [201, { "Content-Type": "application/json" }, '']
            );

            var callback = sinon.spy();

            productListingService.create('sku', '1', 10.0, callback);
            server.respond();

            expect(callback.calledOnce).toBeTruthy();
        });

        it('posts and call to /url', function () {
            spyOn(jQuery, "post").andCallFake();

            productListingService.create('sku', '1', 10.0, sinon.spy());

            expect(jQuery.post.mostRecentCall.args[0]["url"]).toEqual("/api/listing/create");
        });

    });
});

最佳答案

我认为更简单的解决方案是用 Jasmine 的 ajax.js 替换 sinon (http://jasmine.github.io/2.0/ajax.html):

define(['service/ProductListingService'], function (ProductListingService) {
    describe('ProductListingService', function () {

        var productListingService;

        beforeEach(function () {
            productListingService = new ProductListingService();
            jasmine.Ajax.install();
        });

        afterEach(function() {
            jasmine.Ajax.uninstall();
        });

        it('posts and call to /url', function () {
            var callback = sinon.spy();

            productListingService.create('sku', '1', 10.0, callback);

            var request = jasmine.Ajax.requests.mostRecent();
            request.response({
                "status": 201,
                "contentType": "application/json",
                "responseText": ""
            });

            expect(request.method).toEqual("POST");
            expect(request.url).toEqual("/url");
            expect(callback.calledOnce).toBeTruthy();
        });

        it('posts and call to /url', function () {
            productListingService.create('sku', '1', 10.0, sinon.spy());

            expect(jasmine.Ajax.requests.mostRecent().url).toEqual("/api/listing/create");
        });

    });
});

关于javascript - 如何 jasmine 测试 jQuery post ajax 属性(例如 url),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21614359/

相关文章:

jquery - glDatePicker 以渐进的月份显示多个日历

JQuery 动画滚动到 div 顶部

javascript - 处理从 ajax post 下载的文件

jquery - 如何在每次 ajax 调用之前和之后触发某些操作

javascript - 使用 JS 从外部 PHP 文件动态创建内容

javascript - 如何从 ng2 应用程序获取按键?

jquery - 等待jquery ajax请求完成并返回值

jquery - jQuery XML Ajax 中的 If 语句

javascript - AngularJS 工厂、服务和 HTTP 使用

javascript - 如何在另一个 div 可见时隐藏它?