Geek Answers Handbook

Creating grunt-mocha works with requirejs

Running the following Mocha tests in a browser works, but when I use grunt mochathe command line, I get Warning: PhantomJS timed out. I turned the gruntfile mocha.options.run file to false, because if true, requirejs does not have time to run.

Unfortunately, I cannot find a complete sample on this.

The grunt file contains:

mocha: {
  test: {
    src: ['tests/index.html']
  },
}

index.html

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <title>Mocha Test</title>
    <link rel="stylesheet" href="../node_modules/mocha/mocha.css" type="text/css" charset="utf-8" />
</head>
<body>
    <div id="mocha"></div>

    <script src="../node_modules/mocha/mocha.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript" charset="utf-8">
        mocha.setup('bdd');
    </script>

    <script src="../node_modules/chai/chai.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript" charset="utf-8">
        var expect = chai.expect;
    </script>

    <script data-main="requireRunner.js" src="../vendor/require-2.1.9.js"></script>
</body>
</html>

requireRunner:

require.config({
  baseUrl: '/',
  paths: {
    'jquery'        : '../vendor/jquery-2.0.3',
    'underscore'    : '../vendor/underscore-1.5.2',
    'backbone'      : '../vendor/backbone-1.1.0'
  },
  shim: {
    underscore: {
      exports: '_'
    },
    backbone: {
      deps: [
        'underscore',
        'jquery'
      ],
      exports: 'Backbone'
    }
  },
  urlArgs: 'bust=' + (new Date()).getTime()
});

require([
  'tests/models/todoTest'
  ], mocha.run
);

todoTest

define(['js/models/todo'], function(Todo) {
    describe('Todo', function(){    

        var todo;
        before(function() {
            todo = new Todo();
        })

        it('defaults are ok', function(){
            expect(todo.get('title')).to.equal('');
            expect(todo.get('completed')).to.be.false;
        })
    })
})

Todo

/*global define*/
define([
    'underscore',
    'backbone'
], function (_, Backbone) {
    'use strict';

    var TodoModel = Backbone.Model.extend({
        // Default attributes for the todo
        // and ensure that each todo created has `title` and `completed` keys.
        defaults: {
            title: '',
            completed: false
        }
    });

    return TodoModel;
});
+4
source share
3 answers

A few little things to make it work correctly:

  • the paths seem more tolerant in the browser, the path issue can only occur on grunt-mocha (this is not a problem, just a reminder)
  • running grunt mocha , grunt server mocha - ,
  • options:{log: true} requirejs index.html
+2

-!

mocha.options.run, grunt-mocha (, , )

, . grunt mocha !

index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>FdP - Tests</title>
    <link rel="stylesheet" href="../app/vendor/mocha/mocha.css"/>
</head>
<body>
<div id="mocha"></div>
<script src="../app/vendor/mocha/mocha.js"></script>
<script src="../app/vendor/chai/chai.js"></script>
<script>
    mocha.setup('bdd');
    chai.should();
</script>
<script data-main="specRunner.js" src="../app/vendor/requirejs/require.js"></script>
</body>
</html>


mocha: {
  test: {
    src: ['test/index.html']
  }
}

specRunner.js

...
function (testSuite) {
    'use strict';
    require(testSuite.specs, function () {
        mocha.run();
    });
...

Grunt-mocha: 0.4.7

+1

, , , html . html , , , grunt-mocha . , , , require.js .

0
source

More articles:


All Articles