我想測試一個Angular指令有一個外部模板,但不能得到這個工作。這是我第一次嘗試使用Karma。我用Google搜索的解決方案,並試圖將karma.conf.js文件的各種變化,但仍不斷收到這樣的:噶單元測試Angular JS指令與externalUrl
Error: [$injector:modulerr] Failed to instantiate module app/inventory/itemDetails.html due to:
Error: [$injector:nomod] Module 'app/inventory/itemDetails.html' is not available! You either misspelled the module name or forgot to load it.
文件夾結構:
app
inventory
itemDetails.html
itemDetailsDirective.js (templateUrl: "app/inventory/itemDetails.html")
UnitTest
karma.conf.js
specs
inventorySpec.js
karma.conf.js
// list of files/patterns to load in the browser
files: [
'../scripts/jquery.min.js',
'scripts/angular.js',
'scripts/angular-mocks.js',
'../app/*.js',
'../app/**/*.js',
'../app/inventory/itemDetails.html',
'specs/*.js'
],
preprocessors: {
'../app/inventory/itemDetails.html':['ng-html2js'] // Is this supposed to be the path relative to the karma.conf.js file?
},
ngHtml2JsPreprocessor: {
stripPrefix: '../',
},
itemDetailsDirective.js
templateUrl: "app/inventory/itemDetails.html",
個
inventorySpec.js(大部分的東西註釋掉用於調試)
describe("itemDetailsDirective", function() {
var element, $scope;
beforeEach(module("app/inventory/itemDetails.html"));
beforeEach(inject(function ($compile, $rootScope) {
console.log("itemDetailsDirective");
//element = angular.element('<item-details></item-details>');
//$scope = $rootScope.$new();
//$compile(element)($scope);
//$scope.$digest();
}));
it('should display', function() {
// var isolatedScope = element.isolateScope();
// //expect(isolatedScope.condition).toEqual("Fair");
});
});
所以我有一個單元測試文件夾(VS 2013項目)平行於app文件夾。 karma.conf.js中「files」下的路徑是正確的 - 所有「非templateUrl」測試都能正常工作。
幫助會很好,而我還剩下一些頭髮!
我認爲你可以使用注入服務在你的測試中注入指令,然後從那裏獲取templateUrl。我會試着寫一個例子。 – 2014-11-24 18:54:41