AngularJS 單元測試（二）詳解_AngularJS

使用對象類比注入

我們可以非常容易的使用angularjs的$provider服務用一個對象類比一個依賴並且注入。

例子如下

 angular.module('artists',[]).  factory('Artists',['imageStore',function(imageStore){    return {      thumb:function(){        return imageStore.thumbnailUrl(id)      }    }  }])

如何?

如何確定了服務

1、建立一個URL的引用，稍後會被mock捕獲，和為Artists注入的一個變數

var URL;
var Artists;

2、緊接著在beforeEach方法中使用$provide 服務註冊類比的factory服務。使用一個對象類比thumbnailUrl方法。

beforeEach(module(function($provide){  $provide.value('imageStore',{    thumbnailUrl:function(id){      url='/thumb/'+id    }  })})

3、使用$injector服務注入這個方法，返回這個Artists服務並且用剛才建立的的變數來聲明，稍後可以使用到。

 beforeEach(inject(function($inject){  Artists=$inject.get('Artists'); }))

4、調用Artists建立一個簡單的測試

it('return the correct artist thumbnailUrl',function(){  Artists.thumb('1');  expect(url).toBe('/thumbs/1'); })

5、這裡有一個完整的使用$provide類比測試例子，這返回一個定義了thumbnailUrl方法，

describe('factory:artists',function(){  var url;  var Artists;  beforeEach(module('artist'));  beforeEach(module(function($provide){    $provide.value('imageStore',{      thumbnailUrl: function (id) {      url = '/thumbs/' + id;      }      })  }));  beforeEach(inject(function($injector){    Artists=$injector.get('Artists')  }))  it('return the correct artist thumbnailUrl',function(){    Artists.thumb('1');    expect(url).toBe('/thumb/1')  }) })

使用spec類比註冊執行個體

為了聲明依賴注入的執行個體，下面聲明一個例子，下面有兩個服務，第二個服務被注入到了第一個裡。

 angular.module('hiphop',[])  .factory('deejays',['$rootscope','scratch',function($rootscope,scratch){    return{      originator: 'DJ Kool Herc',      technique: scratch.technique()    }  }])  .factory('scratch',['$rootscope',function($rootscope){    return{      technique:function(){        return 'breakbeat';      }    }  }])

2、

describe('Service: deejays',function(){  beforeEach(module('hiphop'))；  var deejays;  beforeEach(inject(function($injector){    deejays=$injector.get('deejays');  }))  beforeEach(inject(function($provide) {    $provide.value('scratch',jasmine.createSpyObj('scratch', ['technique']));  }));  it('should return the correct originator',function(){    expect(deejays.originator).toBe('DJ Kool Herc');  }) })

以上就是對AngularJS 單元測試的資料整理，後續繼續補充相關資料，謝謝大家對本站的支援！