在花了最后一天使这项工作完成之后,我发现我回过头来遇到开始时遇到的相同错误:
错误:意外请求:GET test-directive.html
我正在使用Karma和Jasmine在Angular中测试指令。我在StackOverflow上浏览了类似的问题,但发现在其他示例中尝试过的所有方法均无济于事。
代码结构
Test-App
-src
--bower
--lib
--js
--modules
-– testDir
-— test.js
-— test-directive.html
-— test
----- test.spec .js文件
-test
--config
-– karma.conf.js
--e2e
业力配置
'use strict';
module.exports = function(config){
config.set({
basePath: '../../',
frameworks: ['jasmine'],
files: [
// Angular
'src/bower/angular/angular.js',
// Mocks
'src/bower/angular-mocks/angular-mocks.js',
// Libraries
'src/lib/**/*.js',
// App
'src/js/*.js',
'src/modules/*/*.js',
// Tests
'src/modules/**/test/*spec.js',
// Templates
'src/modules/**/*.html'
],
autoWatch: false,
singleRun: true,
reporters: ['progress'],
browsers: ['PhantomJS'],
preprocessors: {
'src/modules/**/*.html': 'ng-html2js'
},
ngHtml2JsPreprocessor: {
moduleName: 'dir-templates'
},
plugins: [
'karma-jasmine',
'karma-ng-html2js-preprocessor',
'karma-phantomjs-launcher',
'karma-chrome-launcher',
'karma-junit-reporter'
]
});
};
test.js
'use strict';
angular.module('modules.test', []).
directive('testDirective', [function() {
return {
restrict: 'E',
templateUrl: 'test-directive.html',
link: function($scope, $elem, $attrs) {
$scope.someFn = function() {
angular.noop();
};
}
};
}]);
test-direct.html
Hello World
test.spec.js
'use strict';
describe('test module', function() {
beforeEach(module('modules.test'));
/* -- DIRECTIVES------------------ */
describe('directives', function() {
var $compile, $scope, elm;
beforeEach(module('dir-templates');
beforeEach(inject(function($compile, $rootScope) {
$scope = $rootScope.$new();
elm = angular.element('');
$compile(elm)($scope);
$scope.$digest();
}));
it('should have one span tag', function(){
//Jasmine test here to check for one span tag.
});
});
});
缩短了几个文件以解决问题所在。在调用时beforeEach(module('dir-templates')),它应该将所有匹配的.html文件加载到$
templateCache中,并防止引发错误的GET请求。
任何帮助将不胜感激,因为它确实使我发疯。如果您还有其他疑问,请发表评论。