How do I mock a service that returns promise in AngularJS Jasmine unit test

Question

I have myService that uses myOtherService  which makes a remote call  returning promise   angular module  app myService     app myOtherService       factory  myService         myOtherService      function myOtherService          function makeRemoteCall             return myOtherService makeRemoteCallReturningPromise                   return           makeRemoteCall  makeRemoteCall                             To make a unit test for myService I need to mock myOtherService  such that its makeRemoteCallReturningPromise method returns a promise  This is how I do it   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                             As you can see from the above  the definition of my mock depends on  q  which I have to load using inject    Furthermore  injecting the mock should be happening in module    which should be coming before inject    However  the value for the mock is not updated once I change it   What is the proper way to do this

User · Answer

You can use a stubbing library like sinon to mock your service  You can then return  q when   as your promise  If your scope object s value comes from the promise result  you will need to call 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

User · Answer

We can also write jasmine s implementation of returning promise directly by spy   spyOn myOtherService   makeRemoteCallReturningPromise   andReturn  q when         For Jasmine 2   spyOn myOtherService   makeRemoteCallReturningPromise   and returnValue  q when          copied from comments  thanks to ccnokes

User · Answer

using sinon     const mockAction   sinon stub MyService prototype  actionBeingCalled                         returns httpPromise 200      Known that  httpPromise can be     const httpPromise    code    gt  new Promise  resolve  reject    gt     code  gt   200  amp  amp  code  lt   299    resolve   code      reject   code  error true

User · Answer

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

User · Answer

I found that useful  stabbing service function as sinon stub   returns  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      controller   this someMethod   function someObj       myService myFunction  someObj   then  function             someObj loaded    bla-bla         function                failure                 and test  const obj         field   value     this ctrl someMethod  obj     this scope  digest     expect  this myService myFunction   toHaveBeenCalled    expect  obj loaded   toEqual   bla-bla

User · Answer

Honestly   you are going about this the wrong way by relying on inject to mock a service instead of module  Also  calling inject in a beforeEach is an anti-pattern as it makes mocking difficult on a per test basis   Here is how I would do this     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                     Now when you inject your service it will have a properly mocked method for usage

User · Answer

I m not sure why the way you did it doesn t work  but I usually do it with the spyOn function  Something like this   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                           Also remember that you will need to make a  digest call for the then function to be called  See the Testing section of the  q documentation   ------EDIT------  After looking closer at what you re doing  I think I see the problem in your code  In the beforeEach  you re setting myOtherServiceMock to a whole new object  The  provide will never see this reference  You just need to update the existing reference   beforeEach inject  function  myService    q       myService    myService       myOtherServiceMock makeRemoteCallReturningPromise   function             var deferred    q defer            deferred resolve  Remote call result            return deferred promise

User · Answer

The code snippet   spyOn myOtherService   makeRemoteCallReturningPromise   and callFake function         var deferred    q defer        deferred resolve  Remote call result        return deferred promise        Can be written in a more concise form   spyOn myOtherService   makeRemoteCallReturningPromise   and returnValue function         return  q resolve  Remote call result

[javascript] How do I mock a service that returns promise in AngularJS Jasmine unit test?

Examples related to javascript

Examples related to angularjs

Examples related to unit-testing

Examples related to mocking

Examples related to jasmine