如何使用業力/茉莉花在angularAMD中模擬服務？

Question

我有一個使用AngularAMD / RequireJS / Karma / Jasmine的項目，該項目的基本配置都可以正常運行，大多數單元測試都可以成功運行並通過。

我無法使用angular.mock.module或angularAMD.value（）正確注入模擬服務。

我有：

// service definition in services/MyService.js
define(['app'], 
       function(app) {
           app.factory('myService', [ '$document', function($document) {
               function add(html) {
                   $document.find('body').append(html);
               }
               return { add: add }; 
           }]);
       }
);


// test
define(['angularAMD', 'angular-mocks', 'app', 'services/MyService'],
       function(aamd, mocks, app) {
           describe('MyService', function() {
               var myBodyMock = {
                   append: function() {}
               };
               var myDocumentMock = {
                   find: function(sel) {
                       // this never gets called 
                       console.log('selector: ' + sel);
                       return myBodyMock; 
                   }
               }; 
               var svc;
               beforeEach(function() {
                   // try standard way to mock a service through ng-mock
                   mocks.module(function($provide) {
                       $provide.value('$document', myDocumentMock);
                   });
                   // hedge my bets - try overriding in aamd as well as ng-mock
                   aamd.value('$document', myDocumentMock);              
               });
               beforeEach(function() { 
                   aamd.inject(['myService', 
                               function(myService) {
                                   svc = myService;
                               }]);
               });
               it('should work', function() {
                   // use svc expecting it to have injected mock of $document.
                   spyOn(myDocumentMock, 'find').andCallThrough();
                   spyOn(myBodyMock, 'append');
                   svc.add('<p></p>');
                   expect(myDocumentMock.find).toHaveBeenCalledWith('body');
                   expect(myBockMock.append).toHaveBeenCalledWith('<p></p>');
               });
           });
       }
);

有誰知道我要去哪里錯了？ 任何幫助將非常感激。

Answer 1

Angular不是異步的，我認為同時使用兩者不是一個好的想法。 如果您想嘗試一種好的模塊化方法，好的，但是在將其放入瀏覽器之前，請先使用RequireJS優化器來構建所有內容，然后再進行測試，我認為您可以在之前使用RequireJS優化器來構建模塊，它將使您擺脫“即使在測試中也可以使用CommononJS環境”的麻煩。

Answer 2

看起來這將是一個范圍可變的問題，業力對此非常挑剔。 我認為您應該全局初始化模擬對象，然后在beforeEach中進行設置。

我的測試文件的頂行總是看起來像這樣：

var bodyMock，svcMock，foo，bar

然后在beforeEach中設置值

編輯：由於bodyMock只是作用域變量，在測試實際運行並且瀏覽器正在尋找對象“ bodyMock”的時候，它什么也找不到。