2016-11-03 43 views
0

我有以下的功能,即使用將q承諾庫茉莉,與承諾單元測試的XMLHttpRequest

getConfig: function(params){ 

      return this.codeApiClient.get(this.endpoints.config, params, {}).then(function(response){ 
       return response; 
      }, function(err){ 
       throw err; 
      }); 
     } 

上面的代碼調用如下所示的API代碼(我已經縮寫代碼來消除噪聲)

CodeApiClient.prototype = { 
    get: function(endpoint, paramStr, headers){ 
     var defer = new Q.defer(); 
     var start_time = new Date().getTime(); 

     var req = new XMLHttpRequest(); 
     var url = endpoint + (paramStr.indexOf('?') !== -1 ? paramStr : '?' + paramStr); 

     req.open('GET', url); 

     req.onload = function() { 
      var request_time = new Date().getTime() - start_time; 
      // This is called even on 404 etc 
      if (req.status < 400) { 
       var response = JSON.parse(req.response) 
       response.__request_time = request_time; 
       defer.resolve(response); 
      } else { 
       // Otherwise reject with the status text 
       defer.reject(Error(req.statusText)); 
      } 
     }; 
} 

我的問題是:如何爲getConfig編寫Jasmine測試,即僞造響應並存根底層XMLHttpRequest? 是sinon.js能夠做到這一點。我知道它可以存根上$就回調,但我不知道如何與一個承諾的lib做到這一點,如問:請注意,這是純JavaScript,沒有角度等

回答

1
  • 下面是如何使用callFake在茉莉花回報一個承諾。
  • 既然Q和傳統的jQuery都提供了延遲的 對象,你可以用Q.defer()替換$ .Deferred()。

var tempObj = { 
 
    \t getConfig: function(params){ 
 

 
       return this.codeApiClient.get(this.endpoints.config, params, {}).then(function(response){ 
 
        return response; 
 
       }, function(err){ 
 
        throw err; 
 
       }); 
 
      } 
 
     codeApiClient : { 
 
      get : function(){ 
 
      // some get function of codeApiClient 
 
      } 
 
     } 
 
    } 
 

 

 
    it('test getConfig success', function(){ 
 
    \t var dummyResponse = {'someDummyKey' : 'someDummyValue'}; 
 
    \t spyOn(tempObj.codeApiClient, 'get').and.callFake(function(e){ 
 
    \t \t return $.Deferred().resolve(dummyResponse).promise(); 
 
    \t }); 
 
     tempObj.getConfig({}); 
 
     //any expectations 
 
    }); 
 

 
    it('test getConfig failure', function(){ 
 
    \t var dummyResponse = {'error' : 'someDummyFailure'}; 
 
    \t spyOn(tempObj.codeApiClient, 'get').and.callFake(function(e){ 
 
    \t \t return $.Deferred().reject(dummyResponse).promise(); 
 
    \t }); 
 
     tempObj.getConfig({}); 
 
     //any expectations 
 
    });

+0

你舉的例子給出了一個錯誤:錯誤::獲得()方法不存在 用法:node_modules/jasmine-core/lib/jasmine-co中的spyOn(,) re/jasmine.js(line 2075) – Rory

+0

我已經投票選出了這個答案Winter Soldier。在將我的實際代碼重構爲他的答案後,我現在有一個工作單元測試,完全嘲笑等。乾杯冬季士兵: - ) – Rory

+0

我很高興我可以幫助你@Rory。編輯答案btw擺脫錯誤。感謝您的投票。 –

0

如果有人有興趣這裏是我的茉莉花測試,希望它有助於

define([ 'q', 'lodash', 'jquery', 'ChatApi'], function (Q, _ , $ , ChatApi) { 

    describe('Chat Api test', function() { 
     var categories 
     var chatApi; 
     var fakeResponse; 

     beforeEach(function() { 
      //fakes 
      categories = { 
       "l10n": { 
        "defaultLanguage": "en-GB", 
        "languages": [ 
         { 
          "name": "en-GB", 
          "value": "Tell me more..." 
         }, 
         { 
          "name": "fr", 
          "value": "On veut tout savoir..." 
         }, 
         { 
          "name": "de", 
          "value": "Wähle die passende Kategorie aus..." 
         } 
        ] 
       } 
      }; 
      fakeResponse = { 
       'categories': categories 
      } 
      chatApi = new ChatApi("https://server/gateway/","v1"); 
     }); 

     it('test getConfig success', function(done){ 
      var getConfigCalled = spyOn(chatApi, 'getConfig').and.callFake(function(e){ 
       //jQuery version of promises 
       //return $.Deferred().resolve(fakeResponse).promise(); 
       var deferred = Q.defer(); 
       deferred.resolve(fakeResponse); 
       return deferred.promise; 
      }); 

      chatApi.getConfig({}).then(function(response){ 
       //compare objects using lodash 
       var x = _.isEqual(response.categories, fakeResponse.categories); 
       expect(x).toBe(true); 
      }) 

      expect(getConfigCalled).toHaveBeenCalled(); 

      done(); 
     }); 

    }); 
});