ajaxサービスでAngular JSコントローラの単体テストを実装する方法は？

Question

以下のコードの単体テストを作成しようとしましたが、実現できません。

サービスコード：

angular.module('ActivityApp').service('PersonService', [ 
    '$http', 
    function ($http) { 

     var person = function() { 
      return $http({ 
       method: 'GET', 
       url: '/apis/person' 
      }); 
     }; 

     return { 
      Person: person 
     } 
    }]); 

コントローラコード

angular.module('ActivityApp').controller('PersonController', [ 
    '$scope', 
    'PersonService', 
    function ($scope, PersonService) { 
     'use strict'; 

     $scope.person = PersonService.Person().then(function(res) { alert(res.data) }); 


     $scope.save = function() { 
      PersonService.Person().then(function (res) { alert(res.data) }); 
     }; 
    }]); 

ユニットテストコード：

describe("EDI controller", function() { 
    var $httpBackend, $rootScope, mycontroller, personService, $http, $httpBackend, $scope, deferred, $controller; 

    beforeEach(module('ediapp')); 

    beforeEach(function() { 
     filesAjaxService = jasmine.createSpyObj('personService', [ 
      'Person' 
     ]); 

     module(function ($provide) { 
      $provide.value('personService', personService); 
     }); 
    }); 

    beforeEach(inject(function (_$controller_, _$rootScope_, _personService_, _$http_, _$httpBackend_) { 
     // The injector unwraps the underscores (_) from around the parameter names when matching 
     $controller = _$controller_; 
     $scope = _$rootScope_.$new(); 
     $rootScope = _$rootScope_; 
     personService = _personService_; 
     $http = _$http_; 
     $httpBackend = _$httpBackend_; 
     mycontroller = $controller("filesCtrl", { 
      $scope: $scope, 
      PersonService: personService 
     }); 

    })); 

    it("Called", function() { 
     // expect(fileController).toBeDefined(); 
     // expect(filesAjaxService.GetAllFiles).toHaveBeenCalled(); 
    }); 

    afterEach(function() { 
     // $httpBackend.verifyNoOutstandingExpectation(); 
     // $httpBackend.verifyNoOutstandingRequest(); 
    }); 

}); 

上記のテストケースを実行するとエラーが発生する

TypeError: undefined is not an object (evaluating 'PersonService.Person().then(')

誰でもこの問題を解決するソリューションを提供できますか？

Answer 1

この質問は私が以前にそれをしていなかったので私が解決策を探していたことに興味があり、それは私にとって非常に良いことでした。

i search after answer like you, and I was able to merge them together.

希望はあなた助け[あなたはここでそれをテストすることができます]

var app = angular.module('app', []); 
 

 
app.controller('ctrl', function($scope, httpService) { 
 

 
    $scope.url = "https://jsonplaceholder.typicode.com/users"; 
 

 
    httpService.getUsers().then(function(data) { 
 
    $scope.users = data; 
 
    }) 
 

 
}); 
 

 
app.service("httpService", function($http) { 
 
    this.getUsers = function() { 
 
    return $http.get("https://jsonplaceholder.typicode.com/users") 
 
     .then(function(response) { 
 
     return response.data; 
 
     }); 
 
    } 
 

 
}) 
 

 
describe('unitTest', function() { 
 

 
    beforeEach(module('app')); 
 

 
    var $controller, $httpService; 
 

 
    beforeEach(inject(function($injector, _$controller_, _httpService_) { 
 
    $httpBackend = $injector.get('$httpBackend'); 
 
    $controller = _$controller_; 
 
    $httpService = _httpService_; 
 
    })); 
 

 

 
    describe('getUsers', function() { 
 
    it('get users from httpService.getUsers()', inject(function() { 
 
     var $scope = {}; 
 
     var controller = $controller('ctrl', { 
 
     $scope: $scope 
 
     }); 
 

 
     $httpService.getUsers().then(function(data) { 
 
     $scope.valid = true; 
 
     $scope.response = data; 
 
     }) 
 

 
     $httpBackend.when('GET', $scope.url).respond(200, { 
 
     foo: 'bar' 
 
     }); 
 

 
     $httpBackend.flush(); 
 

 
     expect($scope.valid).toBe(true); 
 
     expect($scope.response).toEqual({ 
 
     foo: 'bar' 
 
     }); 
 
    })); 
 
    }); 
 
});

<!-- Jasmine References --> 
 
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.3.3/jasmine.min.css"> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.3.3/jasmine.min.js"></script> 
 
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.3.3/jasmine-html.min.js"></script> 
 
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.3.3/boot.min.js"></script> 
 

 
<!-- Angular and Angular Mock references --> 
 
<script type="text/javascript" src="https://code.angularjs.org/1.4.0-rc.2/angular.min.js"></script> 
 
<script type="text/javascript" src="https://code.angularjs.org/1.4.0-rc.2/angular-mocks.js"></script> 
 

 
<div ng-app="app" ng-controller="ctrl"> 
 
    <ul> 
 
    <li ng-repeat="user in users"> 
 
     {{user.name}} 
 
    </li> 
 
    </ul> 
 
</div>