Làm cách nào để tôi chế nhạo một dịch vụ trả lại lời hứa trong bài kiểm tra đơn vị AngularJS Jasmine?

Tôi có cách myServicesử dụng myOtherServiceđó, thực hiện cuộc gọi từ xa, trả lại lời hứa:

angular.module('app.myService', ['app.myOtherService'])
  .factory('myService', [
    myOtherService,
    function(myOtherService) {
      function makeRemoteCall() {
        return myOtherService.makeRemoteCallReturningPromise();
      }

      return {
        makeRemoteCall: makeRemoteCall
      };      
    }
  ])

Để thực hiện một bài kiểm tra đơn vị cho myServicetôi cần phải chế giễu myOtherService, sao cho makeRemoteCallReturningPromisephương thức của nó trả về một lời hứa. Đây là cách tôi làm điều đó:

describe('Testing remote call returning promise', function() {
  var myService;
  var myOtherServiceMock = {};

  beforeEach(module('app.myService'));

  // I have to inject mock when calling module(),
  // and module() should come before any inject()
  beforeEach(module(function ($provide) {
    $provide.value('myOtherService', myOtherServiceMock);
  }));

  // However, in order to properly construct my mock
  // I need $q, which can give me a promise
  beforeEach(inject(function(_myService_, $q){
    myService = _myService_;
    myOtherServiceMock = {
      makeRemoteCallReturningPromise: function() {
        var deferred = $q.defer();

        deferred.resolve('Remote call result');

        return deferred.promise;
      }    
    };
  }

  // Here the value of myOtherServiceMock is not
  // updated, and it is still {}
  it('can do remote call', inject(function() {
    myService.makeRemoteCall() // Error: makeRemoteCall() is not defined on {}
      .then(function() {
        console.log('Success');
      });    
  }));  

Như bạn có thể thấy ở trên, định nghĩa về giả của tôi phụ thuộc vào $q, mà tôi phải tải bằng cách sử dụng inject(). Hơn nữa, việc tiêm thuốc giả sẽ xảy ra module(), điều này sẽ đến trước inject(). Tuy nhiên, giá trị cho giả không được cập nhật khi tôi thay đổi.

Cách thích hợp để làm điều này là gì?

Tôi không chắc tại sao cách bạn làm nó không hoạt động, nhưng tôi thường làm điều đó với spyOnchức năng. Một cái gì đó như thế này:

describe('Testing remote call returning promise', function() {
  var myService;

  beforeEach(module('app.myService'));

  beforeEach(inject( function(_myService_, myOtherService, $q){
    myService = _myService_;
    spyOn(myOtherService, "makeRemoteCallReturningPromise").and.callFake(function() {
        var deferred = $q.defer();
        deferred.resolve('Remote call result');
        return deferred.promise;
    });
  }

  it('can do remote call', inject(function() {
    myService.makeRemoteCall()
      .then(function() {
        console.log('Success');
      });    
  }));

Cũng nhớ rằng bạn sẽ cần thực hiện một $digestcuộc gọi cho thenchức năng được gọi. Xem phần Kiểm tra của tài liệu $ q .

------BIÊN TẬP------

Sau khi xem xét kỹ hơn những gì bạn đang làm, tôi nghĩ rằng tôi thấy vấn đề trong mã của bạn. Trong beforeEach, bạn đang thiết lập myOtherServiceMockmột đối tượng hoàn toàn mới. Các $providesẽ không bao giờ nhìn thấy thông tin này. Bạn chỉ cần cập nhật các tài liệu tham khảo hiện có:

beforeEach(inject( function(_myService_, $q){
    myService = _myService_;
    myOtherServiceMock.makeRemoteCallReturningPromise = function() {
        var deferred = $q.defer();
        deferred.resolve('Remote call result');
        return deferred.promise;   
    };
  }

Chúng ta cũng có thể viết việc thực hiện lời hứa trở lại của hoa nhài bằng cách gián điệp.

spyOn(myOtherService, "makeRemoteCallReturningPromise").andReturn($q.when({}));

Đối với hoa nhài 2:

spyOn(myOtherService, "makeRemoteCallReturningPromise").and.returnValue($q.when({}));

(được sao chép từ các bình luận, nhờ ccnokes)

describe('testing a method() on a service', function () {    

    var mock, service

    function init(){
         return angular.mock.inject(function ($injector,, _serviceUnderTest_) {
                mock = $injector.get('service_that_is_being_mocked');;                    
                service = __serviceUnderTest_;
            });
    }

    beforeEach(module('yourApp'));
    beforeEach(init());

    it('that has a then', function () {
       //arrange                   
        var spy= spyOn(mock, 'actionBeingCalled').and.callFake(function () {
            return {
                then: function (callback) {
                    return callback({'foo' : "bar"});
                }
            };
        });

        //act                
        var result = service.actionUnderTest(); // does cleverness

        //assert 
        expect(spy).toHaveBeenCalled();  
    });
});

Bạn có thể sử dụng một thư viện gốc như sinon để chế nhạo dịch vụ của bạn. Sau đó, bạn có thể trả lại $ q.when () như lời hứa của mình. Nếu giá trị của đối tượng phạm vi của bạn xuất phát từ kết quả lời hứa, bạn sẽ cần gọi scope. $ Root. $ Digest ().

var scope, controller, datacontextMock, customer;
  beforeEach(function () {
        module('app');
        inject(function ($rootScope, $controller,common, datacontext) {
            scope = $rootScope.$new();
            var $q = common.$q;
            datacontextMock = sinon.stub(datacontext);
            customer = {id:1};
           datacontextMock.customer.returns($q.when(customer));

            controller = $controller('Index', { $scope: scope });

        })
    });


    it('customer id to be 1.', function () {


            scope.$root.$digest();
            expect(controller.customer.id).toBe(1);


    });

sử dụng sinon:

const mockAction = sinon.stub(MyService.prototype,'actionBeingCalled')
                     .returns(httpPromise(200));

Được biết, httpPromisecó thể là:

const httpPromise = (code) => new Promise((resolve, reject) =>
  (code >= 200 && code <= 299) ? resolve({ code }) : reject({ code, error:true })
);

Thành thật mà nói .. bạn đang đi sai hướng này bằng cách dựa vào tiêm để chế nhạo một dịch vụ thay vì mô-đun. Ngoài ra, gọi tiêm trong một BeforeEach là một kiểu chống vì nó gây khó khăn cho việc thử nghiệm trên cơ sở thử nghiệm.

Đây là cách tôi sẽ làm điều này ...

module(function ($provide) {
  // By using a decorator we can access $q and stub our method with a promise.
  $provide.decorator('myOtherService', function ($delegate, $q) {

    $delegate.makeRemoteCallReturningPromise = function () {
      var dfd = $q.defer();
      dfd.resolve('some value');
      return dfd.promise;
    };
  });
});

Bây giờ khi bạn tiêm dịch vụ của mình, nó sẽ có một phương pháp được chế giễu đúng cách để sử dụng.

Tôi thấy rằng chức năng dịch vụ đâm, hữu ích là sinon.stub (). Trả về ($ q.when ({})):

this.myService = {
   myFunction: sinon.stub().returns( $q.when( {} ) )
};

this.scope = $rootScope.$new();
this.angularStubs = {
    myService: this.myService,
    $scope: this.scope
};
this.ctrl = $controller( require( 'app/bla/bla.controller' ), this.angularStubs );

bộ điều khiển:

this.someMethod = function(someObj) {
   myService.myFunction( someObj ).then( function() {
        someObj.loaded = 'bla-bla';
   }, function() {
        // failure
   } );   
};

và kiểm tra

const obj = {
    field: 'value'
};
this.ctrl.someMethod( obj );

this.scope.$digest();

expect( this.myService.myFunction ).toHaveBeenCalled();
expect( obj.loaded ).toEqual( 'bla-bla' );

Đoạn mã:

spyOn(myOtherService, "makeRemoteCallReturningPromise").and.callFake(function() {
    var deferred = $q.defer();
    deferred.resolve('Remote call result');
    return deferred.promise;
});

Có thể được viết dưới dạng ngắn gọn hơn:

spyOn(myOtherService, "makeRemoteCallReturningPromise").and.returnValue(function() {
    return $q.resolve('Remote call result');
});