单元测试控制器，angularJS 和 jasmine答案

【问题标题】：Unit test controller, angularJS and jasmine单元测试控制器，angularJS 和 jasmine
【发布时间】：2017-03-30 22:15:05
【问题描述】：

您好，我一直在尝试在我的控制器中对基本功能进行单元测试，但是在设置单元测试时我似乎无法连接。

错误：[$injector:modulerr] 无法实例化模块 myApp 由于： [$injector:nomod] 模块“myApp”不可用！您要么拼错了模块名称，要么忘记加载它。如果注册模块，请确保将依赖项指定为第二个参数。

这是我的控制器：

    var myApp = angular.module("myApp", []);
myApp.controller('studentController', function($scope,$route,$routeParams,$http,$location){


//Get all students
    $scope.getStudents = function(){
        $http.get('/api/student/').then(function(response){
            $scope.students = response.data;
        });
    };

和我的测试：

describe("studentController", function () {
    beforeEach(module('myApp'));

    var $controller;
    beforeEach(inject(function (_$controller_){
        $controller = _$controller_;
    }))

    describe("studentController", function(){
        it("should get student data", function (){
            var $scope = {};
            $scope.getStudents();
            expect($scope.students.length).toBe(15)
        })
    })

    });

我已将这两个文件与 angular-mocks.js 一起包含在 jasmine html 文件中

任何帮助将不胜感激

【问题讨论】：

标签： javascript angularjs function unit-testing

【解决方案1】：

您正在注入 $route，但您没有加载 ngRoute 模块。加载文件 angular-route.js 并声明依赖：

var myApp = angular.module("myApp", ['ngRoute']);

【讨论】：

【解决方案2】：

您必须在每个之前使用以下方法创建控制器，并且当您调用 getStudents 时，应该在单元测试中使用 HttpBackend 服务进行模拟。

控制器

    var myApp = angular.module("myApp", []);

    myApp.controller('studentController', function($scope, $route, $routeParams, $http, $location) {
      //Get all students
      $scope.getStudents = function() {
        $http.get('/api/student/').then(function(response) {
          $scope.students = response.data;
        });
      };
    });

测试文件

    describe("studentController", function() {
      beforeEach(module('myApp'));

      var $controller, scope, route;
      beforeEach(inject(function(_$controller_, $rootScope, $route, $routeParams, $http, $location) {
        $controller = _$controller_;
        scope = $rootScope.$new();
        $controller('studentController', {
          '$scope': scope,
          '$route': $route,
          '$routeParams': $routeParams,
          '$http': $http,
          '$location': $location

        });

      }))

      describe("studentController", function() {
        it("should get student data", function() {
          // for this you have to use httpBackend
          // you have to mock the response of api
          $scope.getStudents();
          // then you are able to verify the result in student
          expect($scope.students.length).toBe(15)
        })
      })

    });

更多信息可以参考unit testing和Httpbackend

【讨论】：