javascript - 无法在 Controller 中测试 .success 函数

Question

我有一个执行 HTTP POST 的简单 Controller 和服务。 Controller 有 .success 和 .error 回调，我正在尝试为其编写一些单元测试:

调用 btnClick:

<button ng-click="btnClick('cart')">Click</button>

Controller :

app.controller('MyController', function($scope, myService, $timeout) {

    $scope.btnClick = function (action) {

        $scope.postData = {"ID": $scope.myId, "user": $scope.myUser};

        $scope.cartRequest = function() {
            $scope.disabled = true;
            $scope.myText = '';

            myService.postAction('cart', $scope.postData)
                .success(function (data, status, headers, config) {
                    $timeout(function(){
                        $scope.disabled = false;
                        $scope.myText = 'Inside Timeout';

                        $timeout(function(){
                            $scope.hideBtn = true;
                        }, 1400);

                    }, 1500);                    
                })                    
                .error(function (data, status, headers, config) {
                   $scope.cartError();
                });
        };

        switch(action) {
            case "cart":
                $scope.cartRequest();
                break;
        }
    };

我的服务:

 app.factory('MyService', function ($http) {

    return {
        postAction: function(uri, postData) {
            return $http({
                method: 'POST',
                url: '/cartInfo/' + uri,
                data: postData,
                headers: {'Content-Type': 'application/json'}
            });
        }
    };
});
});

我的测试:

describe('Cart API: can get cart details', function () {
    var myService, httpBackend;

    var customerInfo = {
            "accountId" : "12345678901",
            "userName" : "MyTestUser",
            "firstName" : "Joe",
            "lastName" : "Bloggs"
    };

    beforeEach(inject(function($rootScope, $controller) {
        scope = $rootScope.$new();        

        ctrl = $controller('MyController', {$scope:scope});

        spyOn(scope, 'btnClick').and.callThrough();

        inject(function ($httpBackend, _MyService_, $timeout) {
            MyService = _MyService_;
            httpBackend = $httpBackend;
            timeout = $timeout;
        });
    }));

    it('should check if a user is already logged in', function () {    
        scope.customer = customerInfo;
        scope.btnClick('cart');

        var returnData = {};
        var result = {};
        var mockData = { "accountId" : scope.customer.accountId, "userName" : scope.customer.userName};

        httpBackend.expectPOST('/cartInfo/cart', mockData, function () {
            return {
                'Content-Type': 'application/json'
            };
        }).respond(200, returnData);        



        myService.postAction('unlock', mockData).success(function (response) {
            console.log("hello");
            timeout.flush(1501);
            scope.$apply();
            expect(scope.disabled).toBeFalsy();
            expect(scope.myText).toEqual('Inside Timeout');
        });

    });
});

似乎我的测试中的 .success block 从未像 2 所期望的那样被调用:

expect(scope.disabled).toBeFalsy();
expect(scope.myText).toEqual('Inside Timeout');

好像跑不动了。

Answer 1

规范中的 promise 假定规范应为 asynchronous .但是 Angular 的 promise 必须经过测试 synchronously :

    myService.postAction('unlock', mockData);
    $rootScope.$digest();
    timeout.flush();
    // can be omitted if scope watchers don't affect the spec
    // scope.$apply();
    expect(scope.disabled).toBeFalsy();
    expect(scope.myText).toEqual('Inside Timeout');