在e2e测试中从httpBackend访问POST数据

时间:2014-04-02 16:19:40

标签: angularjs angular-mock

在这个例子中,我有一个e2e测试做一个按钮点击,它执行一个POST的功能

我希望能够在我的e2e场景代码中访问testDev httpBackend回调中的“data”对象进行验证。

这是否可以在e2e测试中使用?如果是这样,你能指出我正确的方向吗?

感谢

scenerio代码

describe('test2 app', function() {
    beforeEach(function() {
        browser().navigateTo('/testbed/e2e/app/index2.html');
    });
    it('should run a POST',function() {
        element('#myButton2').click();
    });
});

测试模块

var test2Dev = angular.module('test2Dev', ['test2App', 'ngMockE2E'])
.run(function($httpBackend) {
    $httpBackend.whenPOST(/testpost/)
    .respond(function(method, url, data, headers){
        console.log(data);
        return [200, data, {}];
    });
});

标记

<html lang="en" ng-app="test2Dev" ng-controller="test2Ctrl">
<head>
    <meta charset="utf-8">
    <title>Test click </title>
    <link rel="stylesheet" href="css/app.css">
    <link rel="stylesheet" href="css/bootstrap.css">
    <script src="lib/angular/angular.js"></script>
    <script src="lib/angular/angular-mocks.js"></script>
    <script src="/testbed/e2e/test/e2e/test2Dev.js"></script>
    <script src="js/controllers2.js"></script>
</head>
<body>
    <button id="myButton2" ng-click="runPost()">run post</button>
</body>
</html>

控制器

var test2App = angular.module('test2App', []);
test2App.controller('test2Ctrl', function($scope,$http) {
    $scope.runPost = function() {
        $http.post('/testpost',{
            data1 : 'chevy',
            data2 : 'ford'
        });
    }
});

转轮

<!doctype html>
<html lang="en">
  <head>
    <title>End2end Test Runner</title>
    <meta charset="utf-8">
    <base href="../..">
    <script src="app/lib/angular/angular-scenario.js" ng-autotest></script>
    <script src="app/lib/angular/angular-mocks.js" ng-autotest></script>
    <script src="/testbed/e2e/test/e2e/test2Dev.js"></script>
    <script src="/testbed/e2e/test/e2e/scenarios2.js"></script>
  </head>
  <body>
  </body>
</html>

1 个答案:

答案 0 :(得分:2)

不是很漂亮,但我删除了我的测试模块,并使用了更改版本的“mockApi”here-&gt;     https://github.com/blabno/ngMockE2E-sample (谢谢Bernard Labno)

更改了e2e.mocks.js以将数据对象添加到其配置对象&gt;

    function setup(method, url, config)
    {
        $httpBackend.when(method, url).respond(function (requestMethod, requestUrl, data, headers) {
            config.triggered = true;
            config.data      = data;
            var response = config.response || {};
            if (config.serverLogic) {
                response = config.serverLogic(requestMethod, requestUrl, data, headers);
            }
            return [response.code || 200, response.data];
        });
    }

    setup(POST, /testpost/, mocks.api.post_test);

....并添加了此方法来访问它....

    chain.getData = function() {
        return this.addFuture("get data object for " + itemName, function(done) {
            done(null,JSON.parse(api[itemName].data));
        });
    };

...现在是我的场景......

it('should run a POST',function() {
    element('#myButton2').click();
    expect(mockApi("post_test").getData()).toEqual({
        data1 : 'chevy',
        data2 : 'ford'
    });
});

有更好的方法吗?

相关问题