ExtJS 4.2.1 模拟 Ext.Ajax.request

Question

对于使用 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;
}

所以你可以想象根据我的 ProxyType 配置，我得到了 web api 代理或本地代理进行测试。我现在已经涵盖了我的 crud 操作..

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

//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 事情时确实遇到了一些麻烦......我已经在网上搜索过，但没有找到任何好的解决方案。 模拟此请求的最佳做法是什么？我很高兴你能给我的每一个提示和/或想法。请帮忙！

Answer 1

从 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 重新路由请求。

Answer 2

我会检查 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
    }
}