title: ReferenceError: requirejs is not defined at
body: <p>I am using Mocha with Zombie.js to test my application which uses require.js.</p>
  
  <p>I have the following content in the test.js file:</p>
  
  <pre><code>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);
    });
  });
  </code></pre>
  
  <p>When I am launching the test (with command line mocha test/test.js), I encouner the following error:</p>
  
  <pre><code>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
  </code></pre>
  
  <p>It seems that somehow Mocha/Zombie doesn't wait for the require.js script to get loaded or something similar. Have you encountered this issue before ? Many thanks.</p>
  
  <p><strong>Later Edit:</strong></p>
  
  <p>This is the code for index.html of the application:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
     &lt;head class="hbs-head-container"&gt;&lt;/head&gt;
  
     &lt;script id="hbs-head-template" type="text/x-handlebars-template"&gt;
     &lt;meta charset="utf-8"&gt;
        &lt;meta content="IE=edge" http-equiv="X-UA-Compatible"&gt;
        &lt;meta content="{{metaContent}}"&gt;
        &lt;meta content="width=device-width, initial-scale=1" name="viewport"&gt;
        &lt;title&gt;{{title}}&lt;/title&gt;
        &lt;link href="{{googleFonts}}" rel="stylesheet"&gt;
        &lt;link href="{{materialIcons}}" rel="stylesheet"&gt;
        &lt;link href="../bower_components/material-design-lite/material.min.css" rel="stylesheet"&gt;
        &lt;link href="stylesheets/main.css" rel="stylesheet"&gt;
     &lt;/script&gt;
  
     &lt;body&gt;
        &lt;section class="hbs-body-container"&gt;&lt;/section&gt;
  
        &lt;script id="hbs-body-template" type="text/x-handlebars-template"&gt;
        &lt;div class="mdl-layout mdl-js-layout mdl-layout--fixed-header mdl-layout--fixed-tabs"&gt;
           &lt;header class="mdl-layout__header"&gt;
              &lt;div class="mdl-layout__header-row"&gt;
                 &lt;span class="mdl-layout-title"&gt;{{title}}&lt;/span&gt;
              &lt;/div&gt;
              &lt;div class="mdl-layout__tab-bar mdl-js-ripple-effect"&gt;
                 {{#each tabs}}
                    &lt;a class="{{classValue}}" href="{{hrefValue}}"&gt;{{text}}&lt;/a&gt;    
                 {{/each}}
              &lt;/div&gt;
           &lt;/header&gt;
  
           &lt;div class="mdl-layout__drawer"&gt;
              &lt;span class="mdl-layout-title"&gt;{{title}}&lt;/span&gt;
           &lt;/div&gt;
  
           &lt;main class="mdl-layout__content"&gt;
            {{#each sections}}
              &lt;section class="mdl-layout__tab-panel {{#if @first}}is-active{{/if}}" id="{{sectionId}}"&gt;
                 &lt;div class="page-content"&gt;
                    &lt;div class="mdl-cell mdl-cell--4-col" id=
                       "{{pageContentId}}"&gt;
                       &lt;div class="demo-card-wide mdl-card mdl-shadow--2dp"&gt;
                          &lt;div class="mdl-card__title"&gt;
                             &lt;h2 class="mdl-card__title-text"&gt;{{pageContentTitle}}
                             &lt;/h2&gt;
                          &lt;/div&gt;
                          &lt;div class="mdl-card__supporting-text"&gt;
                             &lt;input id="{{filesId}}" name="file" type="file"&gt;
                             &lt;a class=
                                "mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect"
                                onclick="abortRead();"&gt;{{cancel}}&lt;/a&gt;
                             &lt;div id="{{progressBarId}}"&gt;
                                &lt;div class="percent"&gt;
                                   0%
                                &lt;/div&gt;
                             &lt;/div&gt;
                             &lt;div id="{{someInfoId}}"&gt;
                                {{someInfoValue}}
                             &lt;/div&gt;
                             &lt;div id="{{fileContentId}}"&gt;
                                {{fileContentValue}}
                             &lt;/div&gt;
                          &lt;/div&gt;
                          &lt;div class="mdl-card__actions mdl-card--border"&gt;
                             {{#each buttons}}
                                &lt;a class="{{classValue}}" id="{{idValue}}"&gt;{{text}}&lt;/a&gt;    
                             {{/each}}
                          &lt;/div&gt;
                          &lt;div class="mdl-card__menu"&gt;
                          &lt;/div&gt;
                       &lt;/div&gt;
                    &lt;/div&gt;
  
                    &lt;div class="mdl-cell mdl-cell--8-col" id="{{outputCardId}}"&gt;
                       &lt;div class="demo-card-wide mdl-card mdl-shadow--2dp"&gt;
                          &lt;div class="mdl-card__title"&gt;
                             &lt;h2 class="mdl-card__title-text"&gt;{{opText}}&lt;/h2&gt;
                          &lt;/div&gt;
                          &lt;div class="mdl-card__supporting-text"&gt;
                             &lt;div class="mdl-textfield mdl-js-textfield"&gt;
                                &lt;textarea class="mdl-textfield__input" id=
                                   "{{resultsOutputId}}" rows="10"&gt;
                                None ...
                                &lt;/textarea&gt;
                             &lt;/div&gt;
                          &lt;/div&gt;
                          &lt;div class="mdl-card__actions mdl-card--border"&gt;
                             &lt;a class=
                                "mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect"
                                data-clipboard-target="#{{resultsOutputId}}" id="{{ccId}}"&gt;{{ccText}}&lt;/a&gt;
                          &lt;/div&gt;
                          &lt;div class="mdl-card__menu"&gt;
                          &lt;/div&gt;
                       &lt;/div&gt;
                    &lt;/div&gt;
                 &lt;/div&gt;
              &lt;/section&gt;
              {{/each}}
           &lt;/main&gt;
  
           &lt;footer class="demo-footer mdl-mini-footer"&gt;
              &lt;div class="mdl-mini-footer--left-section"&gt;
                 &lt;ul class="mdl-mini-footer--link-list"&gt;
                    &lt;li&gt;
                       &lt;a href={{footerLink}}&gt;{{footerText}}&lt;/a&gt;
                    &lt;/li&gt;
                 &lt;/ul&gt;
              &lt;/div&gt;
           &lt;/footer&gt;
        &lt;/div&gt;
        &lt;/script&gt;
        &lt;script src="../bower_components/material-design-lite/material.min.js"&gt;&lt;/script&gt;
  
        &lt;script src="../bower_components/requirejs/require.js"&gt;&lt;/script&gt;
        &lt;script type="text/javascript"&gt;
           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',
               }
           });
        &lt;/script&gt;
  
        &lt;script src="javascripts/templates/hbs-head.js"&gt;&lt;/script&gt;
        &lt;script src="javascripts/templates/hbs-body.js"&gt;&lt;/script&gt;
  
        &lt;script src="javascripts/main.js"&gt;&lt;/script&gt;
     &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>