嵌套控制器的单元测试

Question

我正在尝试为嵌套的控制器编写单元测试,但无法弄清楚如何在我的测试中模拟相同的行为.

我有2个控制器:

function FirstController ($scope) {
    $scope.childs = [{
         title : 'Hello, earth!'
    }];
};

function SecondController ($scope) {
    $scope.child.title = $scope.child.title + $scope.$index;
};

在我的HTML中:

<div data-ng-controller="FirstController">
    <div data-ng-repeat="child in childs" data-ng-controller="SecondController">
        {{ child.title }}
    </div>
</div>

这按预期工作(http://jsfiddle.net/tcayp/1/)

单元测试:

// FirstController
it('Should have childs', function () {
    scope = {};
    ctrl = new FirstController(scope);
    expect(scope.childs.length).toBeGreaterThan(0);
});
// SecondController
it('Should have inherited a child', function () {
    scope = {};
    ctrl = new SecondController(scope);
    expect(scope.child.title).toEqual('Hello, earth!0');
});

在SecondController测试中,我无法弄清楚如何从ng-repeat模拟继承链.

Answer 1

理想情况下,通过单元测试,我们希望单独测试类(单元).在一次测试中测试2个控制器可能太多了:测试会变得更复杂,更脆弱.

仔细查看提供的示例,可能会注意到它实际上不是测试2个控制器,而是确保数据在父作用域中可用.因此,只关注一个控制器only(SecondController)和继承的数据,就可以编写如下测试:

describe('Testing the SecondController controller', function() {

    var $parentScope, $scope, ctrl;
    it('should prepare title', inject(function($rootScope, $controller) {

        //setup hierarchy of scopes with data             
        $rootScope.childs = [{
            title : 'Hello, earth!'
        }];
        $scope = $rootScope.$new();
        $scope.$index = 1;

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

        expect($scope.childs[0].title).toEqual('Hello, earth!1');        
    }));
});

这是完整的jsFiddle:http://jsfiddle.net/pkozlowski_opensource/h8xry/13/

我真的建议不要一起测试2个控制器,但只是为了回答问题,它也是可能的:

describe('Testing the SecondController controller', function() {

    it('should prepare title', inject(function($rootScope, $controller) {

        $controller('FirstController', {
            $scope: $rootScope
        });

        var $scope = $rootScope.$new();
        $scope.$index = 1;

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

        expect($scope.childs[0].title).toEqual('Hello, earth!1');        
    }));
});

和jsFiddle:http://jsfiddle.net/pkozlowski_opensource/4Qy6b/1/