我在使用require和karma为我的AngularJS应用程序编写测试时遇到了麻烦。我随机得到的模块没有定义'从业力加载主源文件时出错,我不确定原因。
我的项目结构如下:
main
-webapp
-components
-{all my external libs}
-js
-{my js files}
test
-lib
angular-mocks.js
underscore.js
-webapp
karma.conf.js
server.js
test-main.js -> require js config
-unit
myTest.js
我的test-main.js定义如下 -
var tests = [];
for (var file in window.__karma__.files) {
if (/Test\.js$/.test(file)) {
tests.push(file);
console.log(file);
}
}
requirejs.config({
baseUrl:'base/',
paths:{
'angular':'main/webapp/components/angular-1.0.7',
'jquery':'main/webapp/components/jquery',
'jquery-ui':'main/webapp/components/jquery-ui',
'lodash':'main/webapp/components/lodash',
'underscore':'test/webapp/lib/underscore',
'angular-mocks':'test/webapp/lib/angular-mocks',
'requireLibChecker':'test/webapp/checker/requireLibChecker',
'bootstrap':'main/webapp/components/bootstrap/js/bootstrap',
'bootstrap-datepicker':'main/webapp/components/bootstrap/js/bootstrap-datepicker',
'app':'main/webapp/js/mcc',
'helper':'main/webapp/js/helper',
'js':'main/webapp/js'
},
shim:{
'angular':{
exports:'angular'
},
'angular-mocks':{
exports:'angular-mocks'
},
'underscore':{
exports:'_'
},
'jquery-ui':{
deps:['jquery'],
exports:'jquery-ui'
},
'bootstrap-datepicker':{
deps:['jquery', 'bootstrap'],
exports:'datepicker'
}
},
priority:[
"angular"
],
// ask Require.js to load these files (all our tests)
deps:tests,
priority:['angular'],
// start test run, once Require.js is done
callback:window.__karma__.start
});
我的主要第一个源文件(mcc.js)在通过karma加载时导致错误,定义如下:
define("app", [
'angular',
'js/controllers/overviewctrl',
'js/controllers/topicactivityctrl',
'js/services/transportmodel',
'js/services/subjectmodel',
'js/directives/controlsdirective',
'bootstrap-datepicker',
'jquery-ui'
], function(angular) {
var app = angular.module('mcc', []).config(['$routeProvider', function ($routeProvider) {
$routeProvider.
when('/overview', {
templateUrl:'partials/system-overview.html',
controller: 'OverviewController'
}).
when('/overview/:systemId', {
templateUrl:'partials/system-overview.html',
controller: 'OverviewController'
}).
otherwise({redirectTo:'/overview'});
}]);
app.controller("AppController", ['$rootScope', 'transportModel', function($rootScope, transportModel) {
$rootScope.$on("$routeChangeError", function(event, current, previous, rejection) {
alert("Route Change Error: " + rejection);
});
if ($rootScope.mcc_region === undefined)
$rootScope.mcc_region = "New York";
transportModel.then(function(tm) {
$rootScope.mcc_regions = tm.regions;
});
}]);
return app;
});
require(['angular', 'helper'], function(angular, helper) {
angular.element(document).ready(function() {
/* MANUALLY LOAD TO WAIT FOR APP */
angular.bootstrap(document, ['mcc']); --> This line causes the error
/* NAVIGATE TO TOP OF PAGE FOR MOBILE DEVICES */
window.scrollTo(0, 1);
});
});
我正在努力调试原因 -
angular.bootstrap(document,[' mcc']);
随机导致错误 - 也就是说,有时浏览器(chrome,phantomJS)找到模块,有时它在通过业力时不会发生。如果我将它作为常规Web应用程序运行,它第一次运行正常。
答案 0 :(得分:0)
我认为您不想在执行测试时引导应用程序。您是否尝试将该模块重构为另一个文件?例如,当您运行应用程序时,该文件等同于 test-main.js 。
我的意思是模块:
require(['angular', 'helper'], function(angular, helper) {
angular.element(document).ready(function() {
/* MANUALLY LOAD TO WAIT FOR APP */
angular.bootstrap(document, ['mcc']); --> This line causes the error
/* NAVIGATE TO TOP OF PAGE FOR MOBILE DEVICES */
window.scrollTo(0, 1);
});
可能根本不需要由Karma加载。