我的代码需要手动引导，因为需要在加载应用程序之前加载文件。
var bootstrapModule = angular.module('bootstrapModule', []);
// the bootstrapper service loads the config and bootstraps the specified app
bootstrapModule.factory('bootstrapper', function ($http, $log, $q, $timeout) {
return {
bootstrap: function (appName) {
var deferred = $q.defer();
$http.get('config/urls/development.json')
.success(function (data) {
.....
deferred.resolve();
})
.error(function (data) {
...
});
return deferred.promise;
}
};
});
// create a div which is used as the root of the bootstrap app
var appContainer = document.createElement('div');
// in run() function you can now use the bootstrapper service and shutdown the bootstrapping app after initialization of your actual app
bootstrapModule.run(function (bootstrapper) {
bootstrapper.bootstrap('angular3App').then(function () {
// removing the container will destroy the bootstrap app
if (appContainer) appContainer.remove();
});
});
// make sure the DOM is fully loaded before bootstrapping
angular.element(document).ready(function () {
angular.bootstrap(appContainer, ['bootstrapModule']);
});
我希望我的单元测试能够复制此行为，以便它可以在加载的文件中包含信息。
我正在尝试在 beforeEach 中引导我的应用程序，但它不起作用。
beforeEach(function(done) {
var bootstrapModule = module('bootstrapModule')
// create a div which is used as the root of the bootstrap app
var appContainer = document.createElement('div');
// in run() function you can now use the bootstrapper service and shutdown the bootstrapping app after initialization of your actual app
bootstrapModule.run(function (bootstrapper) {
bootstrapper.bootstrap('angular3App').then(function () {
// removing the container will destroy the bootstrap app
appContainer.remove();
});
});
// make sure the DOM is fully loaded before bootstrapping
angular.element(document).ready(function () {
angular.bootstrap(appContainer, ['bootstrapModule']);
});
});
它没有相应地引导。我范围内依赖于引导加载文件加载的信息不可用。
有人有什么想法吗？
最佳答案
这是一个老问题，但我刚刚处理过这个问题，似乎最近至少有一个人遇到过类似的问题。我用头撞墙让我的单元测试运行我喜欢的设置 @sauvenancio。工厂是我发现导入项目所需的 config.json 文件的一种方式，它很有效——只是在我们的测试中表现不佳。
据我所知，测试试图在 bootstrapMOudule.factory 中的 promise 得到解决之前运行。幸运的是，加载配置 JSON 是一项要求——通过服务加载它不是项目要求——所以我放弃了获取 JSON 的服务。
我几乎遵循了此处概述的方法: How to configure your AngularJS application using environment variables
在 index.html 文档中，我在加载我的 Angular 应用程序的文件之前为 env.js 文件添加了一个脚本标签。
<html>
...
<script src="js/jquery.js"></script>
<!-- Gets the config.json -->
<script src="env.js"></script>
<!-- The App -->
<script src="js/main.js"></script>
</html>
env.js 文件包含将 config.json 加载到窗口的代码。我的看起来像这样:
(function (window) {
window.__env = window.__env || {};
$.get( 'config.json', function( data ){
window.__env = data;
})
.error( function handleErrorResponse( xhr, status, error ){
console.error( "An AJAX error occured: " + status + "\nError: " + error ) ;
});
}(this));
从这里我只是将 window.__env 加载到我的 main.js 文件中并将其用于我的常量。
var env = {};
if(window){
Object.assign(env, window.__env);
}
...
angular.module('app').constant('AppSettings', env);
一旦我做了这些改变，一切都像魅力一样......非常感谢Jurgen Van de Moere .希望这会对某人有所帮助。
关于javascript - 无法在 AngularJS 中使用手动 Bootstrap 对应用程序进行单元测试，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24920071/