使用 Jasmine 2 的间谍测试 Angular 指令

Question

我有一个AngularJS指令，我正试图用Jasmine 2测试。下面是我在测试开始时定义的Mock服务。

var Note = {
    getNotes: function (type, id) {
        console.log('I have been called')
    },
    save: function () {}
};

这是我的测试:

beforeEach(function () {
    var html = "<notes id="productId" type="'Product'"></notes>";
    inject(function ($compile, $rootScope, $q, $injector, $templateCache) {
        $templateCache.put('tpl/blocks/notes.html', '<div>notes template</div>');
        $scope = $rootScope.$new();
        q = $q;
        $httpBackend = $injector.get('$httpBackend');
        $scope.productId = "123";
        elm = angular.element(html);
        $compile(elm)($scope);
        $scope.$apply();
        scope = angular.element(elm).isolateScope()
    });
});
it('should call service to get notes', function () {
    //GIVEN
    expect(scope.notes).toBe(undefined);
    spyOn(Note, 'getNotes').and.returnValue(new function () {
        var deferred = q.defer();
        scope.notes = [{'content': 'note1'}, {'content': 'note2'}];
        return deferred.promise;
    });
    //WHEN
    scope.$apply();
    //THEN
    expect(Note.getNotes).toHaveBeenCalled();
    expect(scope.notes.length).toBe(2);
});

如果我删除第一个期望(在它期望的地方注意。getNotes被调用)，测试通过。否则，它将失败。但是，我可以看到服务正在被调用，因为它是用console.log打印的。

INFO [karma]: Karma v0.12.35 server started at http://localhost:9876/
INFO [launcher]: Starting browser PhantomJS
INFO [PhantomJS 1.9.8 (Mac OS X 0.0.0)]: Connected on socket pPpiC59pcRGYeZDkmHH1 with id 30185266
WARN [web-server]: 404: /js/controllers/signin.js
......
LOG: 'I have been called'
PhantomJS 1.9.8 (Mac OS X 0.0.0) Notes directive should call service to get notes FAILED
        Expected spy getNotes to have been called.
            at /Users/mraible/dev/myapp/tests/unit/directives/notes_test.js:68
LOG: 'I have been called'
...
DUMP: 'background-image: initial; background-attachment: initial; background-origin: initial; background-clip: initial; background-color: rgb(153, 255, 0); background-position: initial initial; background-repeat: initial initial; '
.
PhantomJS 1.9.8 (Mac OS X 0.0.0): Executed 11 of 11 (1 FAILED) (0.004 secs / 0.171 secs)
Warning: Task "karma:unit" failed. Use --force to continue.
Aborted due to warnings.

我的直觉是，我的spyOn必须改变，以表明该方法有参数

Answer 1

您需要使用提供来覆盖模块中的Notes服务。

的例子:

 var Note, notesStub = [{'content': 'note1'}, {'content': 'note2'}];
 beforeEach(module('myapp', function($provide){
     Note = jasmine.createSpyObj('Note',['getNotes', 'save']);
     //override the service
     $provide.value('Note', Note);
   }));
   beforeEach(inject(function($q){
     //Set up spy value
     Note.getNotes.and.returnValue($q.when(notesStub));
      //Other inject stuffs
   }));
it('should call service to get notes', function () {
    //GIVEN
    expect(scope.notes).toBe(undefined);
    scope.$apply();
    //Assuming your directive calls the service and chain though the promise and set its scope.
    expect(Note.getNotes).toHaveBeenCalled();
    expect(scope.notes.length).toBe(2);
});