将Angularjs App中的对象暴露给量角器测试

时间:2015-12-07 15:30:28

标签: angularjs unit-testing protractor e2e-testing

我正在使用Protractor为基于AngularJS的应用程序编写端到端测试。有些情况需要使用模拟测试 - 例如,网络连接问题。如果对服务器的AJAX请求失败,则用户必须看到警告消息。

我的模拟作为服务在应用程序中注册。我希望测试可以访问它们来写这样的东西:

var proxy;
beforeEach(function() { proxy = getProxyMock(); });

it("When network is OK, request succeeds", function(done) {
    proxy.networkAvailable = true;

    element(by.id('loginButton')).click().then(function() {
        expect(element(by.id('error')).count()).toEqual(0);
        done();
    });
});

it("When network is faulty, message is displayed", function(done) {
    proxy.networkAvailable = false;

    element(by.id('loginButton')).click().then(function() {
        expect(element(by.id('error')).count()).toEqual(1);
        done();
    });
});

如何实现getProxyMock函数将对象从应用程序传递给测试?我可以将代理存储在应用的window对象中,但仍然不知道如何访问它。

1 个答案:

答案 0 :(得分:0)

经过一些阅读并了解测试过程好一点后,它变得不可能。测试在NodeJS中执行,而浏览器中的前端代码 - Javascript对象实例无法在两个不同的进程之间真正共享。

但是,有一种解决方法:您可以在浏览器中执行脚本。

首先,您的前端代码必须提供某种服务定位器,如下所示:

angular.module('myModule', [])
       .service('proxy', NetworkProxy)
       .run(function(proxy) {
           window.MY_SERVICES = {
               proxy: proxy,
           };
       });

然后,测试结果如下:

it("Testing the script", function(done) {
    browser.executeScript(function() {
        window.MY_SERVICES.proxy.networkAvailable = false;
    });

    element(by.id('loginButton')).click().then(function() {
        expect(element.all(by.id('error')).count()).toEqual(1);
        done();
    });
});

请注意,当您使用executeScript时,该功能将被序列化以发送到浏览器以供执行。这值得记住一些限制:如果您的脚本函数返回一个值,它是来自浏览器的原始对象的克隆。更新返回的值将修改原始值!出于同样的原因,您不能在函数中使用闭包。