2016-09-22 42 views
0

寫測試用例在angularJS控制器我有一個角模塊在一個單獨的文件 userModule.js如何使用茉莉

'use strict'; 
angular.module('users', ['ngRoute','angular-growl','textAngular','ngMaterial','ngMessages','ngImgCrop','ngFileUpload']) 
.run(function ($rootScope, $location, $http) { 
    $http.get('/token') 
     .success(function (user, status) { 
     if (user) { 
      $rootScope.user = user; 
     } 
    }); 
}) 

我有一個控制器在一個單獨的其中使用該另一個文件模塊:

userController.js

'use strict'; 
var usersApp = angular.module('users'); 

usersApp.controller('usersControllerMain', ['$scope', '$http', '$routeParams','$location', 'growl','$rootScope','$mdDialog','API', 
    function($scope, $http, $routeParams, $location,growl,$rootScope,$mdDialog,API) { 
    $scope.action = "none"; 
    $scope.password = '', 
    $scope.grade = function() { 
     var size = $scope.password.length; 
     if (size > 8) { 
     $scope.strength = 'strong'; 
     } else if (size > 3) { 
     $scope.strength = 'medium'; 
     } else { 
     $scope.strength = 'weak'; 
     } 
    }; 

我有一些在我的控制器中定義的其他用途的依賴項。

現在我需要測試這個控制器。所以我寫了一個spec文件,我將直接在瀏覽器中運行。我不想使用測試運行像因果報應: jasmine.html

<html> 
<head> 
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/jasmine.css"> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/jasmine.js"></script> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/jasmine-html.js"></script> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/boot.js"></script> 
    <script type="text/javascript" src="https://code.angularjs.org/1.4.8/angular.js"></script> 
    <script type="text/javascript" src="https://code.angularjs.org/1.4.8/angular-mocks.js"></script> 
    <script type="text/javascript"> 
    describe('userControllerMain testing', function(){ 

     beforeEach(angular.mock.module('users')); 

     var $controller; 

     beforeEach(angular.mock.inject(function(_$controller_){ 
      $controller = _$controller_; 
     })); 
      describe('$scope.grade', function() { 
      it('sets the strength to "strong" if the password length is >8 chars', function() { 
       var $scope = {}; 
       var controller = $controller('usersControllerMain', { $scope: $scope }); 
       $scope.password = 'longerthaneightchars'; 
       $scope.grade(); 
       expect($scope.strength).toEqual('strong'); 
      }); 
      }); 
     }); 
    </script> 
</head> 
<body> 
</body> 
</html> 

我從angular docs這個例子。 但當我在瀏覽器中運行我的jasmine.html時,它拋出一個噴油器模塊錯誤,如下所示: enter image description here 。我在這裏做錯了什麼.. ??

回答

0

您在此處遵循的方法存在嚴重問題。您應該模擬beforeEach塊內的控制器而不是it塊。

因此,這是你的測試文件應該如何:

describe('userControllerMain testing', function(){ 
    beforeEach(module('users')); 

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

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

    describe('$scope.grade', function() { 
     it('sets the strength to "strong" if the password length is >8 chars', function() { 
      $scope.password = 'longerthaneightchars'; 
      $scope.grade(); 
      expect($scope.strength).toEqual('strong'); 
     }); 
    }); 
}); 

希望這有助於。