【问题标题】:how to create unit tests for controllers in AngularJS如何在 AngularJS 中为控制器创建单元测试
【发布时间】:2017-03-07 23:57:14
【问题描述】:

如何为我的 AngularJS 控制器 LoginController 创建单元测试?如何为这个例子模拟 AuthenticationService? 我的控制器是否为单元测试和使用模型正确构建?

控制器登录控制器代码:

layoutControllers.controller('LoginController',
    ['$scope', '$rootScope', '$location', 'AuthenticationService',
    function ($scope, $rootScope, $location, AuthenticationService) {

        AuthenticationService.ClearCredentials();

        $scope.login = function () {
            $scope.dataLoading = true;
            AuthenticationService.Login($scope.email, $scope.password, function (response) {
                AuthenticationService.SetCredentials($scope.email, $scope.password, response.UserId);
                $scope._showValidationErrors(null, null);
                $location.path('/');

            }, function (response) {
                $scope._showValidationErrors(response.Errors, response.OtherErrors);
            });
            $scope.dataLoading = false;
        };

        $scope._showValidationErrors = function (errors, otherErrors) {
            $scope.validationErrors = [];
            $scope.errors = {};
            $scope.errors.form = {};

            if (errors && angular.isArray(errors)) {
                for (var errorCounter in errors) {
                    $scope.validationErrors.push(errors[errorCounter].Message);
                    $scope.errors.form[errors[errorCounter].Key] = errors[errorCounter].Message;
                }
                // debugger;
            }

            if (otherErrors && angular.isArray(otherErrors)) {
                for (var errorCounter2 in otherErrors) {
                    $scope.validationErrors.push(otherErrors[errorCounter2]);
                }
            }
        }

    }]);

【问题讨论】:

    标签: angularjs unit-testing mockups


    【解决方案1】:

    试试https://docs.angularjs.org/guide/unit-testing

    结帐测试控制器部分

    引用:-

    因为控制器在全局范围内不可用,我们需要先使用 angular.mock.inject 来注入我们的控制器。

        describe('LoginController', function() {
          beforeEach(module('app'));
    
          var $controller;
    
          beforeEach(inject(function(_$controller_){
            // The injector unwraps the underscores (_) from around the parameter names when matching
            $controller = _$controller_;
          }));
    
          describe('My auth test', function() {
            it('success login will not display validation erreors', function() {
              var $scope = {};
              var controller = $controller('LoginController', { $scope: $scope });
    
              $scope.login();
              //test for $scope.validationErrors
              expect($scope.validationErrors).toBeUndefined();
            });
    
          it('failure login will has validation errors', function() {
              var $scope = {};
              var controller = $controller('LoginController', { $scope: $scope });
    
              $scope.login();
              //test for $scope.validationErrors
              expect($scope.validationErrors).not.toBeUndefined();
              expect($scope.validationErrors.length).not.toBeGreaterThan(0);
            });
          });
        });
    

    【讨论】:

    • 据我所知:),它不是运行测试:)。模拟身份验证服务怎么样?没有设置 cerdentails。它不会工作:)
    • 这将测试您的“login()”函数,这是您的实际代码。您可以捕获它对 $scope 或其他对象(例如 $location 等)的影响。您能描述一下您正在考虑的被测单元的具体内容吗?
    • 认证服务怎么样?这是依赖。我认为应该模拟它来仅测试控制器。但我可能错了。
    • 在测试 login() 时,你应该模拟其他东西。因此它被称为单元测试。您可以在单独的单元测试中测试身份验证服务。或者使用 $httpBackend,您可以模拟身份验证 svc 的实际 http/resource 调用,而不必费心模拟它。但是单元测试应该是不同的。
    猜你喜欢
    • 1970-01-01
    • 2015-11-29
    • 1970-01-01
    • 2014-04-12
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多