ExtJS 4.2.1 mocking Ext.Ajax.request

ExtJS 4.2.1 mocking Ext.Ajax.request

本文关键字：Ext Ajax request mocking ExtJS      更新时间：2023-09-26

对于Jasmine的前端单元测试，我想在我的应用程序中模拟我的所有请求。

我已经实现了一种模拟我所有代理的方法。

proxy: appname.classes.proxy.ProxyNegotiator.getModelProxy("User")

此方法执行以下操作：

getModelProxy: function(config) {
    var url = this.getUrl(config);
    if (this.getProxyType() == 'api') {
        return appname.classes.proxy.WebApiProxy.getModelProxy(url);
    } else if (this.getProxyType() == 'test') {
        return appname.classes.proxy.LocalTestProxy.getModelProxy(url);
    }
    return undefined;
}

所以你可以想象，根据我的代理类型配置，我得到 Web API 代理或本地代理进行测试。我现在确实已经涵盖了我的原油操作。

不过，我确实还有另一个问题要处理。我的应用程序中确实有一些其他请求，例如（用户名验证）：

//check if Username is Valid
Ext.Ajax.request({
    url: '/api/User',
    method: 'GET',
    async: false,
    params: { id: user.get('Id'), username: user.get('UserName') },
    failure: function(response, opts) {
        myErrors.push({
            field: 'UserName',
            message: appname.locale.ErrorInvalidUsername
        });
    }
});

我确实有一些麻烦来嘲笑这个 Ext.Ajax.request 的东西......我已经在网上搜索过，但没有找到任何好的解决方案。模拟此请求的最佳做法是什么？我很高兴你能给我的每一个提示和/或想法。请帮忙！

所有从 4.0.7 开始的 Ext JS 版本都附带 Ext.ux.ajax.SimManager 类。它不包含在基本库构建中，但未缩小的源代码位于 Ext JS 文件夹的examples/ux/ajax下。

要使用它，您需要使用 Simlet 配置注册一个 URL，该配置定义您的返回数据。

Ext.onReady(function () {
    Ext.ux.ajax.SimManager.init({
        delay: 500  // Simulates network latency/server processing time
    }).register({
        '/api/User': {
            stype: 'json',  // stype is what kind of Simlet you want to use
            data:  [
                // JSON response data, if needed
            ]
        }
    });
});

然后，您像往常一样发出 Ajax 请求，SimManager 将通过注册的 Simlet 重新路由请求。

我会看看sinon js来做你的ajax模拟。 我们目前正在使用它在我们的 Ext 重型应用程序中编写单元测试。 http://sinonjs.org/docs/#fakeServer

您应该能够使用如下方法测试您的 ajax 请求：

{
    setUp: function () {
        this.server = sinon.fakeServer.create();
    },
    tearDown: function () {
        this.server.restore();
    },
    "test user" : function () {
        this.server.respondWith("GET", "/api/User,
                                [500, { "Content-Type": "application/json" },
                                 '[{ "id": 12, "comment": "Hey there" }]']);
        Ext.Ajax.request({
            url: '/api/User',
            method: 'GET',
            async: false,
            params: { id: user.get('Id'), username: user.get('UserName') },
            failure: function(response, opts) {
                myErrors.push({
                    field: 'UserName',
                    message: appname.locale.ErrorInvalidUsername
                });
            }
        });
        this.server.respond();
        //assert myErrors
    }
}
相关文章：