單元測試角度服務和指令

作爲Angular的新手（並且說實話，JS本身）我正在努力進行單元測試的服務和指令。我試圖從互聯網上的不同例子中編譯解決方案，但失敗了。單元測試角度服務和指令

我有一個服務：

angular.module('myApp.services', []) 
.factory('autoCmpltDataSvc', function ($http) { 
    return { 
     source: function (request, response) { 
      $http({ 
       method: 'jsonp', 
       url: 'http://ws.geonames.org/searchJSON?callback=JSON_CALLBACK', 
       params: { 
        featureClass: "P", 
        style: "full", 
        maxRows: 12, 
        name_startsWith: request.term 
       } 
      }).success(function (data, status) { 
       response($.map(data.geonames, function (item) { 
        return { 
         label: item.name + (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName, 
         value: item.name, 
         geonameId: item.geonameId 
        } 
       })); 
      }); 
     } 
    } 
});

我想假以實際的Web服務通過預定義的陣列的相互作用，並檢查它request.term傳遞不同的值時，返回正確的響應。

另一任務是單元測試一個指令（周圍jquery的自動填充包裝器）

angular.module('myApp.directives', []) 
.directive('autocomplete', function (autoCmpltDataSvc) { 
     return { 
      restrict: 'E', 
      replace: true, 
      transclude: true, 
      template: '<input id="DstnSlctr" ng-model="autocomplete" type="text"/>', 
      link: function (scope, element, attrs) { 
       scope.$watch(autoCmpltDataSvc, function() { 
        element.autocomplete({ 
         source: autoCmpltDataSvc.source, 
         select: function (event, ui) { 
          scope[attrs.selection] = ui.item.value; 
          scope[attrs.selectionid] = ui.item.geonameId; 
          scope.$apply(); 
         } 
        }); 
       }); 
      } 
     } 
    });

我想僞造該呼叫到服務用一些預定義的陣列，並檢查範圍被正確地修改。

是否可以單獨測試這些測試，還是應該只對這項任務使用e2e測試？

在此先感謝您的回覆！塞梅

來源

2012-11-22 Ksenia

對於服務，基本上你會想要做的是在你的單元測試使用$ httpBackend。它使用的是$ httpBackend（$ http後面）。但是當你將它注入單元測試時，它會奇蹟般地知道並攔截這些調用。

根據doc，你需要做的是通過提供真正的URL（以及你將在單元測試中傳遞哪些參數）來實現你的http請求，在beforeEach中添加一個afterEach。注意：我相信doc有輸入錯誤

var $http; // and should probably be: var $httpBackend

對於指令，它取決於。如果你已經創建了整個指令，那麼單元測試可能是一個更簡單的道路。當包裝插件時，你可能會考慮一些事情。首先，編寫e2e測試可能是一個好的第一步。其次，看看你自己的代碼（在指令中）是否可以放入輔助方法中，並且該部分可以是單元可測試的。

來源

2012-11-22 21:07:00

謝謝！我已經重構了代碼並按照您的建議使用$ httpBackend編寫了測試，但由於某種原因它不起作用。我創建了另一個針對此特定問題的線程：http://stackoverflow.com/questions/13582308/whats-wrong-with-angular-service-test – Ksenia

單元測試角度服務和指令

回答

相關問題