单元测试使用承诺的角度控制器和服务？

Question

我无法让测试结果通过我正在使用一个非常基本的实现来更深入地了解测试。

我有一个工厂，它返回一个承诺，从我的控制器访问。我想测试调用是否成功并将响应分配给repos var。以下是代码：

'use strict';

angular.module('app')
  .factory('searchServ', function ($timeout, $q, $http) {
    return {
      fetch: function(user) {
        var deferred = $q.defer();

        $timeout(function(){
          $http({method: 'GET', url: 'https://api.github.com/users/' + user + '/repos'}).then(function(repos) {
            deferred.resolve(repos.data);
          }, function(reason){
            deferred.reject(reason.status);
            console.log(reason);
          });
        }, 30);

        return deferred.promise;
      }
    };
  })
  .controller('MainCtrl', function ($scope, searchServ) {
    $scope.results = function(user) {
      $scope.message = '';
      searchServ.fetch(user).then(function (repos) {
        if(repos.length){
          $scope.message = '';
          $scope.repos = repos;
        }
        else{
          $scope.message = 'not found'
        }
      }, function (){
        $scope.message = 'not found';
      });
    };
  });

//Test

'use strict';

describe('MainCtrl', function () {
  var scope, searchServ, controller, deferred, repos = [{name: 'test'}];
  // load the controller's module
  beforeEach(module('app'));

  beforeEach(inject(function($controller, $rootScope, $q) {
    searchServ = {
      fetch: function () {
        deferred = $q.defer();
        return deferred.promise;
      }
    };
    spyOn(searchServ, 'fetch').andCallThrough();
    scope = $rootScope.$new();
    controller = $controller('MainCtrl', {
      $scope: scope,
      fetchGithub: fetchGithub
    });


  }));
  it('should test', function () {
    expect(scope.test).toEqual('ha');
  });

  it('should bind to scope', function () {
    scope.results();
    scope.$digest();
    expect(scope.message).toEqual('');
    //expect(scope.repos).not.toBe(undefined);
  });
});

运行测试给我以下错误：

TypeError: undefined is not a function (evaluating 'spyOn(searchServ, 'fetch').andCallThrough()') in test/spec/controllers/main.js (line 15)

知道如何测试它以测试范围绑定以及异步调用吗？

Answer 1

你的代码有很多问题。

我为此创建了 this Plunkr。 index.js 是包含您的代码和测试用例的文件。我根据约定和最佳实践编辑了大部分部分。

我想给你一些建议：

• 由于$http 返回一个promise，您应该使用它，而不是解决promise 并从您的方法创建另一个promise。不知道为什么使用超时。所以我从searchServ 的依赖项中删除了$q 和$timeout。
• 我在测试用例中做了同样的事情，删除了您使用的 deferred 变量。
• 您应该使用angular-mocks.js 来模拟您的服务和其他依赖项，而不是在您的测试用例中定义一个服务（就像您所做的那样。）
• 您应该创建单独的 describe 块来测试代码的不同部分（在本例中为 controller）。

希望这会有所帮助！