I am trying to test directive in angular using Jasmine. I installed karma-ng-html2js-preprocessor using NPM. Then I istalled jQuery using Bower but I am getting this error
我试图使用Jasmine测试角度指令。我使用NPM安装了karma-ng-html2js-preprocessor。然后我使用Bower使用jQuery,但是我收到了这个错误
Connected on socket ndfTI8XJInIU5YJCAAAA with id 49983199
Chrome 47.0.2526 (Mac OS X 10.10.2) http controller test it should be one FAILED
Error: [$injector:modulerr] Failed to instantiate module templates due to:
Error: [$injector:nomod] Module 'templates' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.4.8/$injector/nomod?p0=templates
at /Users/naveenkumar/Documents/ionic_work/tes/bower_components/angular/angular.js:68:12
at /Users/naveenkumar/Documents/ionic_work/tes/bower_components/angular/angular.js:2005:17
at ensure (/Users/naveenkumar/Documents/ionic_work/tes/bower_components/angular/angular.js:1929:38)
at module (/Users/naveenkumar/Documents/ionic_work/tes/bower_components/angular/angular.js:2003:14)
at /Users/naveenkumar/Documents/ionic_work/tes/bower_components/angular/a
I made directive like this
我做了这样的指示
angular.module('app',[]).controller('first',function($scope,data){
$scope.name='test';
$scope.message='application';
data.getData().then(function(data){
console.log(data);
})
}).factory('data',function($http){
return{
getData:getData
}
function getData(){
return $http.get('data.json').success(successCall).error(errorcallback)
}
function successCall(data){
return data
}
function errorcallback(data){
return data
}
}).directive('helloWorld',function(){
return {
restrict:'E',
scope:{
data:'=',
message:'@'
} ,
templateUrl:'app/partial/home.html',
link:function(s,e,a){
}
}
})
home.html
<div class="dir">
<h1>{{data}}</h1>
<h1>{{message}}</h1>
</div>
test.js
describe('http controller test', function () {
var $rootScope,
$scope,
$compile,
$body=$('body'),
el,
$el,
controller,
html='<hello-world data="name" message="{{message}}"></hello-world>';
beforeEach(function(){
module('templates','app') ;
inject(function($injector){
$rootScope = $injector.get('$rootScope') ;
$compile = $injector.get('$compile') ;
$scope=$rootScope.$new();
el=$compile(angular.element(html))($scope)
controller =$injector.get('$controller')('first',{$scope:$scope})
})
$body.append(el);
$rootScope.$digest();
$el=$('.dir');
})
afterEach(function(){
$body.empty();
})
it('it should be one',function(){
expect($el.length).isEqual(1)
})
describe('Init value',function(){
it('check name value',function(){
expect($scope.name).toEqual('test');
})
})
it('it should be true',function(){
expect(true).toBeTruthy();
})
})
and there is karma-config file
还有karma-config文件
// Karma configuration
// Generated on Fri Dec 18 2015 19:53:32 GMT+0530 (IST)
module.exports = function(config) {
config.set({
// base path that will be used to resolve all patterns (eg. files, exclude)
basePath: '',
// frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
frameworks: ['jasmine'],
// list of files / patterns to load in the browser
files: [
'bower_components/angular/angular.js' ,
'bower_components/jquery/dist/jquery.js' ,
'bower_components/angular-mocks/angular-mocks.js' ,
'bower_components/angular-resource/angular-resource.js' ,
'app/**/.html',
'app/*.js',
'test/**.js'
],
// list of files to exclude
exclude: [
],
// preprocess matching files before serving them to the browser
// available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
preprocessors: {
'app/**/.html':['ng-html2js']
},
ngHtml2JsPreprocessor:{
moduleName:'templates'
},
// test results reporter to use
// possible values: 'dots', 'progress'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
reporters: ['progress'],
// web server port
port: 9876,
// enable / disable colors in the output (reporters and logs)
colors: true,
// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
logLevel: config.LOG_INFO,
// enable / disable watching file and executing tests whenever any file changes
autoWatch: true,
// start these browsers
// available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
browsers: ['Chrome'],
// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: false,
// Concurrency level
// how many browser should be started simultanous
concurrency: Infinity
})
}
I already declared the template module like this
我已经像这样声明了模板模块
ngHtml2JsPreprocessor:{
moduleName:'templates'
},
update 1
Connected on socket i5kkzULDwF1_ptvcAAAA with id 55433592
Chrome 47.0.2526 (Mac OS X 10.10.2) http controller test it should be one FAILED
Error: [$injector:modulerr] Failed to instantiate module templates due to:
Error: [$injector:nomod] Module 'templates' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.4.8/$injector/nomod?p0=templates
at /Users/naveenkumar/Documents/ionic_work/tes/bower_components/angular/angular.js:68:12
at /Users/naveenkumar/Documents/ionic_work/tes/bower_components/angular/angular.js:2005:17
at ensure (/Users/naveenkumar/Documents/ionic_work/tes/bower_components/angular/angular.js:1929:38)
at module (/Users/naveenkumar/Documents/ionic_work/tes/bower_components/angular/angular.js:2003:14)
at /Users/naveenkumar/Documents/ionic_work/tes/bower_components/angular/angular.js:4435:22
at forEach (/Users/naveenkumar/Documents/ionic_work/tes/bower_components/angular/angular.js:340:20)
at loadModules (/Users/naveenkumar/Documents/ionic_work/tes/bower_components/angular/angular.js:4419:5)
at Object.createInjector [as injector] (/Users/naveenkumar/Documents/ionic_work/tes/bower_components/angular/angular.js:4344:11)
at Object.workFn (/Users/naveenkumar/Documents/ionic_work/tes/bower_components/angular-mocks/angular-mocks.js:2428:52)
at window.inject.angular.mock.inject (/Users/naveenkumar/Documents/ionic_work/tes/bower_components/angular-mocks/angular-mocks.js:2411:37)
http://errors.angularjs.org/1.4.8/$injector/modulerr?p0=templates&p1=Error%3A%20%5B%24injector%3Anomod%5D%20Module%20'templates'%20is%20not%20available!%20You%20either%20misspelled%20the%20module%20name%20or%20forgot%20to%20load%20it.%20If%
1 个解决方案
#1
0
I have no prior experiences with karma-ng-html2js-preprocessor
so this is more like a guess - could it be that template module was not generated because no templates were found.
我之前没有使用karma-ng-html2js-preprocessor的经验,所以这更像是猜测 - 可能是因为没有找到模板而没有生成模板模块。
Could you try to change this part of files
section of your karma-config
from:
你能尝试改变你的karma-config的这部分文件部分:
'app/**/.html'
to:
'app/**/*.html'
and preprocessors
section from:
和预处理器部分来自:
preprocessors: {
'app/**/.html':['ng-html2js']
}
to
preprocessors: {
'app/**/*.html':['ng-html2js']
}
Update:
If that doesn't work for you, you could set log level of Karma to
如果这对您不起作用,您可以将Karma的日志级别设置为
logLevel: config.LOG_DEBUG
and try to search for lines starting with DEBUG [preprocessor.html2js]
to gather additional info related to html2js
preprocessor.
并尝试搜索以DEBUG [preprocessor.html2js]开头的行,以收集与html2js预处理器相关的其他信息。
#1
0
I have no prior experiences with karma-ng-html2js-preprocessor
so this is more like a guess - could it be that template module was not generated because no templates were found.
我之前没有使用karma-ng-html2js-preprocessor的经验,所以这更像是猜测 - 可能是因为没有找到模板而没有生成模板模块。
Could you try to change this part of files
section of your karma-config
from:
你能尝试改变你的karma-config的这部分文件部分:
'app/**/.html'
to:
'app/**/*.html'
and preprocessors
section from:
和预处理器部分来自:
preprocessors: {
'app/**/.html':['ng-html2js']
}
to
preprocessors: {
'app/**/*.html':['ng-html2js']
}
Update:
If that doesn't work for you, you could set log level of Karma to
如果这对您不起作用,您可以将Karma的日志级别设置为
logLevel: config.LOG_DEBUG
and try to search for lines starting with DEBUG [preprocessor.html2js]
to gather additional info related to html2js
preprocessor.
并尝试搜索以DEBUG [preprocessor.html2js]开头的行,以收集与html2js预处理器相关的其他信息。