在AngularJS

Question

我有一個具有內回調控制器如何單元測試控制器回調：

angular.module('controllers').controller('MainCtrl', function() { 
var result = {}; 
var self = this; 
this.test = function(data) { 
     jsonld.expand(data, function(err, expanded) { 
      self.result = expanded; 
     }); 
    } 
}); 

我的問題是，我需要在一個單元測試，以檢查「結果」的值，但如果我只是調用ctrl.test（data）然後ctrl.result，那麼ctrl.result的值是{}，它應該是測試函數（在jsonld.expand內部）返回的內容。有沒有辦法測試這種行爲（發生回調時測試self.result）？

我已經搜遍了，但我發現的一切都與定製服務有關，但在這種情況下，這是一個external library。

Answer 1

如果你想測試你的代碼，你必須遵守一定的規則。例如，不要使用全局變量/依賴關係。

在你的例子中是jsonld全局依賴。在單元測試中，我們只測試一個組件，用mock代替依賴關係。

如何修改代碼以更好地測試？

angular.module('controllers') 
    .controller('MainCtrl', function(jsonld) { 
    var result = {}; 
    var self = this; 
    this.test = function(data) { 
     jsonld.expand(data, function(err, expanded) { 
     self.result = expanded; 
    }); 
    } 
}); 

唯一的區別是在控制器構造函數 - jsonld中顯式定義了依賴關係。

但現在，你會得到錯誤jsonldProvider不存在（或類似） - 因爲他的DI容器角注入依賴（https://docs.angularjs.org/guide/di）

註冊jsonld到DI容器可能看起來像

angular.module('....') 
    .factory('jsonld', function() { // string jsonld is name of service in DI container 
    return jsonld; // this is global variable - jsonld library 
    }) 

最後我們能夠寫測試和模擬jsonld - 結果在這裏http://plnkr.co/edit/6xdVwJsJba8SVZ6d6lgg?p=preview

如果您使用$ http，testin使用$ httpBackend將會更容易，但jsonld是外部庫，並且不在內部使用$ http。因此測試更加複雜。