javascript - 如何测试调用私有(private)函数的 Controller 函数，该函数又调用 angularjs 中的异步函数

Question

[plunkr][1] http://plnkr.co/edit/Jk1Rp3nEgUQTmDOs3xBl?p=preview

我当前的代码结构如下。

angular.module("app",[])
  .service("dataService",function($http){
    this.get = function (url) {
      return $http.get(url);
    };
  })
  .service("mainService",function(dataService){
    this.getData = function(pattern){
      return dataService.get(pattern+"/abc");
    }
  })
  .controller("mainController",function($scope,mainService){
    $scope.refreshData = function(pattern){
      loadData(pattern);
    }

  function loadData(pattern){
    mainService.getData(pattern)
      .success(function(data){
        console.log(data);
      })
      .error(function(error){
        console.log(error);
      })
  }
})

我一直试图通过阅读博客来了解如何测试它，但每个博客要么有不同的方法，要么博客已有 2-3 年历史。我想知道如何测试 Controller ？

我应该测试每个功能吗？如果是，那么我应该如何测试私有(private)函数？使用私有(private)函数是一个好主意还是应该将私有(private)函数代码添加到作用域函数中？

还有没有更好的方法来编写这个函数？

Answer 1

我们要创建 stub 的最重要部分:

beforeEach(function() {
    var $httpResponse = {
        success: function() {
            return $httpResponse;
        },
        error: function() {
            return $httpResponse;
        }
    };
    var _stubMainService_ = {
        getData: jasmine.createSpy('getData').and.returnValue($httpResponse)
    };

    angular.module('app')
        .value('mainService', _stubMainService_);
});

并使用它进行测试:

it('rereshes data', function() {
    var pattern = 'abcde';
    scope.refreshData(pattern);
    expect(mainService.getData).toHaveBeenCalledWith(pattern);
});

angular.module("app", [])
  .service("dataService", function($http) {
    this.get = function(url) {
      return $http.get(url);
    };
  })
  .service("mainService", function(dataService) {
    this.getData = function(pattern) {
      return dataService.get(pattern + "/abc");
    }
  })
  .controller("mainController", function($scope, mainService) {
    $scope.refreshData = function(pattern) {
      loadData(pattern);
    }

    function loadData(pattern) {
      mainService.getData(pattern)
        .success(function(data) {
          console.log(data);
        }).error(function(error) {
          console.log(error);
        })
    }
  })

describe('mainController()', function() {
  var scope, controller, mainService, $q;

  beforeEach(module('app'));

  beforeEach(function() {
    var $httpResponse = {
        success: function() {
          return $httpResponse;
        },
        error: function() {
          return $httpResponse;
        }
      };
    var _stubMainService_ = {
      getData: jasmine.createSpy('getData').and.returnValue($httpResponse)
    };

    angular.module('app')
      .value('mainService', _stubMainService_);
  });


  beforeEach(inject(function($controller, $rootScope, _mainService_) {
    scope = $rootScope.$new();
    controller = $controller('mainController', {
      $scope: scope
    });
    mainService = _mainService_;
  }));

  it('rereshes data', function() {
    var pattern = 'abcde';
    scope.refreshData(pattern);
    expect(mainService.getData).toHaveBeenCalledWith(pattern);
  });
})

<link href="//safjanowski.github.io/jasmine-jsfiddle-pack/pack/jasmine.css" rel="stylesheet" />
<script src="//safjanowski.github.io/jasmine-jsfiddle-pack/pack/jasmine-2.0.3-concated.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular-mocks.js"></script>