如何在Angular js中编写控制器的测试用例

时间:2015-12-23 07:15:16

标签: javascript angularjs mocha karma-jasmine sinon-chai

最近我们开始为我们的应用程序编写测试用例,我们需要帮助编写控制器的测试用例。我们使用Mocha,chai和Snion库来编写测试用例。

这是包含我们控制器代码的plunker链接。谁能帮助我们如何为这个控制器编写测试用例?我们将在此基础上实施其余的工作。我们需要使用此控制器进行初始推送。

http://plnkr.co/edit/oginuqO0afxnWbVMos0f?p=info

以下是代码:

angular.module( 'ngBoilerplate.account', [
    'ui.router','ngAnimate', 'ui.bootstrap','ngBoilerplate.contact','ngResource','jcs-autoValidate','ngCookies','ngTagsInput'
])
.controller('addAccount', function($scope,industryService,$http,$state,LoggedUser){
    $scope.industry = [];
    industryService.query().$promise.then(function(data) {
        $scope.industry = data;
    });

    window.onbeforeunload = function (event) {

        if ($scope.addAccountForm.$dirty) {

            var message = 'If you leave this page you are going to lose all the unsaved changes.';

            if (typeof event == 'undefined') {
                event = window.event;
            }
            if (event) {  
                event.returnValue = message;
            }

            return message;
        }
    };

    $scope.insertAccount = function(){
        $scope.address = {
            'line1':$scope.line1,
            'line2':$scope.line2,
            'city':$scope.city,
            'zipCode':$scope.zipCode,
            'state':$scope.state,
            'country':$scope.country
        };

        console.log($scope.industryId);

        if($scope.industryId!== undefined) {

            $scope.industry = {
                'id' : $scope.industryId
            };
        }

        $http.post('/rest/users/'+LoggedUser.getUserName()+'/accounts',{
            'name' : $scope.name,
            'industryBean': $scope.industry,
            'email' :$scope.email,
            'phone' : $scope.phone,
            'fax' : $scope.fax,
            'website' : $scope.website,
            'headquarters' : $scope.headquarters,
            'dbaName' : $scope.dbaName,
            'numberOfEmployees' : $scope.numberOfEmployees,
            'annualRevenue':$scope.annualRevenue,
            'logo' : $scope.logo,
            'primaryContact': $scope.contact,
            'addressBean':$scope.address
        }).success(function(data){
            $scope.account=data;
            $state.go('main.account', {}, {reload: true});
        });
    };
})
.factory("loggedInUser", function($resource) {
    return $resource("/rest/users/:username");
})
 .factory("industryService", function($resource) {
    return $resource("/rest/accounts/industry");
})

非常感谢任何帮助。

提前致谢,如果您对此有任何疑问,请与我们联系。

1 个答案:

答案 0 :(得分:1)

我爱摩卡柴和诗乃并用它们测试节点代码。从未在Angular中使用它们。

典型的Angular设置是Karma,Jasmine(单元测试)和Protractor(E2E测试)。

查看控制器代码,我会说控制器中有太多逻辑。您需要将一些代码转发给服务。

关于测试$ http,您需要使用ng-mock' $ httpBackend。

您应该在代码中使用Angular Controller As语法。