I'm using yeoman, grunt, mocha. I want to do BDD so I make basic unit test and run grunt test
in console, which gives me ReferenceError: can't find variable: Creature
opening test/index.html in browser works as it should.
This is my creature.js file in app/scripts:
'use strict';
var Creature = (function () {
function Creature(name) {
this.name = name;
}
Creature.prototype.sayHello = function (message) {
return this.name + ' ' + message;
};
Creature.prototype.eat = function (item){
return this.name + ' is eating ' + item;
}
return Creature;
})();
This is my test/index.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Mocha Spec Runner</title>
<link rel="stylesheet" href="bower_components/mocha/mocha.css">
</head>
<body>
<div id="mocha"></div>
<script src="bower_components/mocha/mocha.js"></script>
<script>mocha.setup('bdd')</script>
<script src="bower_components/chai/chai.js"></script>
<script>
var assert = chai.assert;
var expect = chai.expect;
var should = chai.should();
</script>
<!-- include source files here... -->
<script src="../app/scripts/creature.js"></script>
<!-- include spec files here... -->
<script src="spec/test.js"></script>
<script>mocha.run()</script>
</body>
</html>
This is my test/spec/test.js file:
/* global describe, it */
(function () {
'use strict';
describe('Creature', function () {
describe('Comunnications', function () {
it('should say <name> hi', function () {
var creature = new Creature('test');
expect(creature.sayHello('hi')).to.equal('test hi');
});
it('should say <name> is eating <item>', function () {
var creature = new Creature('test');
expect(creature.eat('pear')).to.equal('test is eating pear');
});
});
});
})();
Console log:
Running "copy:styles" (copy) task
Done, without errors.
Running "autoprefixer:dist" (autoprefixer) task
Running "connect:test" (connect) task
Started connect web server on http://localhost:9001
Running "mocha:all" (mocha) task
Testing: http://localhost:9001/index.html
..
0 passing (113ms)
2 failing
1) Creature Comunnications should say <name> hi:
ReferenceError: Can't find variable: Creature
at http://localhost:9001/spec/test.js:9
at http://localhost:9001/bower_components/mocha/mocha.js:4263
at http://localhost:9001/bower_components/mocha/mocha.js:4635
at http://localhost:9001/bower_components/mocha/mocha.js:4694
at next (http://localhost:9001/bower_components/mocha/mocha.js:4561)
at http://localhost:9001/bower_components/mocha/mocha.js:4570
at next (http://localhost:9001/bower_components/mocha/mocha.js:4514)
at http://localhost:9001/bower_components/mocha/mocha.js:4538
at timeslice (http://localhost:9001/bower_components/mocha/mocha.js:5531)
2) Creature Comunnications should say <name> is eating <item>:
ReferenceError: Can't find variable: Creature
at http://localhost:9001/spec/test.js:13
at http://localhost:9001/bower_components/mocha/mocha.js:4263
at http://localhost:9001/bower_components/mocha/mocha.js:4635
at http://localhost:9001/bower_components/mocha/mocha.js:4694
at next (http://localhost:9001/bower_components/mocha/mocha.js:4561)
at http://localhost:9001/bower_components/mocha/mocha.js:4570
at next (http://localhost:9001/bower_components/mocha/mocha.js:4514)
at http://localhost:9001/bower_components/mocha/mocha.js:4538
at timeslice (http://localhost:9001/bower_components/mocha/mocha.js:5531)
>> 2/2 tests failed (0.11s)
Warning: Task "mocha:all" failed. Use --force to continue.
Aborted due to warnings.
Execution Time (2014-06-08 14:40:23 UTC)
concurrent:test 3s ■■■■■■■■■■■■■■■ 32%
connect:test 447ms ■■■ 5%
mocha:all 5.9s ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ 63%
Total 9.4s
Perhaps it has to do with the reference to ../app/scripts/creature.js when running through phantomjs it has a different path compared to using it in a real browser?
EDIT
It seems like grunt test
opens the wrong path to test on. It seems to open root/index.html When it opens... I got it to work by changing the path to the creature.js (removed the app/)
<!-- include source files here... -->
<script src="../scripts/creature.js"></script>
However when running grunt test
it now works, but opening the test/index.html file it now gives me the error ReferenceError: Creature is not defined
in firebug console.
Do I do something wrong or is that de correct behaviour? Anything I can do to make it work both ways?
I discovered where the issue was by changing the gruntfile.js changed test:options:open to true.
// The actual grunt server settings
connect: {
options: {
port: 9000,
open: true,
livereload: 35729,
// Change this to '0.0.0.0' to access the server from outside
hostname: 'localhost'
},
livereload: {
options: {
...
}
},
test: {
options: {
open: false,
port: 9001,
middleware: function(connect) {
return [
connect.static('.tmp'),
connect.static('test'),
connect().use('/bower_components', connect.static('./bower_components')),
connect.static(config.app)
];
}
}
},
dist: {
...
}
}
}
Thanks in advance!
Possibly related to Running Mocha on the command line and Including a file
Have you tried putting
before
It looks like the var isn't defined and probably what volkinc was after with his response.
probably you call
when DOM is not ready yet try this
or with jQuery
This is probably because of this line. connect.static(config.app). Running it on the commandline, it runs connect, and sets the root/base path (where it reads the file) to app and test. So if you remove app it works for commandline, however if you are running it as a file, it is relative, hence needing 'app'