我正在使用Mocha和Zombie.js来测试我的应用程序，它使用require.js。
我在test.js文件中有以下内容：
process.env.NODE_ENV = 'test';
var express = require('express'),
http =require('http'),
assert = require('assert');
app = express();
app.use(express.static('src'));
const Browser = require('zombie');
describe('User visits signup page', function() {
before(function() {
this.server = http.createServer(app).listen(3000);
this.browser = new Browser({ site: 'http://localhost:3000', debug: true, runScripts: true });
});
before(function(done) {
this.browser.visit('/index.html', done);
});
describe('submits form', function() {
before(function() {
return this.browser;
});
it('should be successful', function() {
this.browser.assert.success();
});
it('should see welcome page', function() {
this.browser.assert.text('title', 'Page Title');
});
});
after(function(done) {
this.server.close(done);
});
});
当我启动测试时（使用命令行mocha test / test.js），我鼓励出现以下错误：
User visits signup page
1) "before all" hook
0 passing (341ms)
1 failing
1) User visits signup page "before all" hook:
ReferenceError: requirejs is not defined
at http://localhost:3000/index.html:script:2:10
in http://localhost:3000/index.html
似乎Mocha / Zombie不会等待require.js脚本加载或类似的东西。你以前遇到过这个问题吗？非常感谢。
稍后编辑：
这是应用程序的index.html的代码：
<!DOCTYPE html>
<html lang="en">
<head class="hbs-head-container"></head>
<script id="hbs-head-template" type="text/x-handlebars-template">
<meta charset="utf-8">
<meta content="IE=edge" http-equiv="X-UA-Compatible">
<meta content="{{metaContent}}">
<meta content="width=device-width, initial-scale=1" name="viewport">
<title>{{title}}</title>
<link href="{{googleFonts}}" rel="stylesheet">
<link href="{{materialIcons}}" rel="stylesheet">
<link href="../bower_components/material-design-lite/material.min.css" rel="stylesheet">
<link href="stylesheets/main.css" rel="stylesheet">
</script>
<body>
<section class="hbs-body-container"></section>
<script id="hbs-body-template" type="text/x-handlebars-template">
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header mdl-layout--fixed-tabs">
<header class="mdl-layout__header">
<div class="mdl-layout__header-row">
<span class="mdl-layout-title">{{title}}</span>
</div>
<div class="mdl-layout__tab-bar mdl-js-ripple-effect">
{{#each tabs}}
<a class="{{classValue}}" href="{{hrefValue}}">{{text}}</a>
{{/each}}
</div>
</header>
<div class="mdl-layout__drawer">
<span class="mdl-layout-title">{{title}}</span>
</div>
<main class="mdl-layout__content">
{{#each sections}}
<section class="mdl-layout__tab-panel {{#if @first}}is-active{{/if}}" id="{{sectionId}}">
<div class="page-content">
<div class="mdl-cell mdl-cell--4-col" id=
"{{pageContentId}}">
<div class="demo-card-wide mdl-card mdl-shadow--2dp">
<div class="mdl-card__title">
<h2 class="mdl-card__title-text">{{pageContentTitle}}
</h2>
</div>
<div class="mdl-card__supporting-text">
<input id="{{filesId}}" name="file" type="file">
<a class=
"mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect"
onclick="abortRead();">{{cancel}}</a>
<div id="{{progressBarId}}">
<div class="percent">
0%
</div>
</div>
<div id="{{someInfoId}}">
{{someInfoValue}}
</div>
<div id="{{fileContentId}}">
{{fileContentValue}}
</div>
</div>
<div class="mdl-card__actions mdl-card--border">
{{#each buttons}}
<a class="{{classValue}}" id="{{idValue}}">{{text}}</a>
{{/each}}
</div>
<div class="mdl-card__menu">
</div>
</div>
</div>
<div class="mdl-cell mdl-cell--8-col" id="{{outputCardId}}">
<div class="demo-card-wide mdl-card mdl-shadow--2dp">
<div class="mdl-card__title">
<h2 class="mdl-card__title-text">{{opText}}</h2>
</div>
<div class="mdl-card__supporting-text">
<div class="mdl-textfield mdl-js-textfield">
<textarea class="mdl-textfield__input" id=
"{{resultsOutputId}}" rows="10">
None ...
</textarea>
</div>
</div>
<div class="mdl-card__actions mdl-card--border">
<a class=
"mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect"
data-clipboard-target="#{{resultsOutputId}}" id="{{ccId}}">{{ccText}}</a>
</div>
<div class="mdl-card__menu">
</div>
</div>
</div>
</div>
</section>
{{/each}}
</main>
<footer class="demo-footer mdl-mini-footer">
<div class="mdl-mini-footer--left-section">
<ul class="mdl-mini-footer--link-list">
<li>
<a href={{footerLink}}>{{footerText}}</a>
</li>
</ul>
</div>
</footer>
</div>
</script>
<script src="../bower_components/material-design-lite/material.min.js"></script>
<script src="../bower_components/requirejs/require.js"></script>
<script type="text/javascript">
requirejs.config({
baseUrl: '../bower_components',
paths: {
jquery: 'jquery/dist/jquery.min',
handlebars: 'handlebars/handlebars.min',
clipboard: 'clipboard/dist/clipboard.min',
underscore: 'underscore/underscore-min',
papaparse: 'papaparse/papaparse.min',
}
});
</script>
<script src="javascripts/templates/hbs-head.js"></script>
<script src="javascripts/templates/hbs-body.js"></script>
<script src="javascripts/main.js"></script>
</body>
</html>