Yeoman webapp generator - How to run mocha tests in the Browser - testing

Question

I've got some JS tests written in mocha/chai and I would like to run them in a project scaffolded using the webapp generator.
I've put my tests inside the "test" folder from Yeoman's structure and the tests are running fine. But the issue is that the grunt test command is only showing the test results in the console, not in the browser.
I'm looking for a way to run the command and have the tests shown in the browser. How can I do that?
Thanks for any help!

Answer 1

Please consider this part of connect's configuration (more precisely, this is a sub-task of connect):
test : {
options : {
middleware : function(connect) {
return [
require('connect-livereload')(),
mountFolder(connect, '.tmp'),
mountFolder(connect, 'test')
];
},
port : grunt.option('port') ? Number(grunt.option('port')) + 1 : 9001
}
}
The above will make files from the specified folders available through http.
.tmp is where my transpiled coffeescript and SCSS is landing as regular JS/CSS
test is where my tests reside together with a very simple index.html file which wires all JS/CSS together, including mocha.js and mocha.css
Later in my Gruntfile I register the test task:
grunt.registerTask('test', function(target) {
var tasks = [
'clean:server',
'coffee',
'jst',
'connect:test'
];
if (target === 'browser') {
tasks.push('open:test');
tasks.push('watch');
} else {
tasks.push('mocha');
}
grunt.task.run(tasks);
});
The part which is relevant to your problem is 'connect:test' which makes it possible to access the tests through the browser, and this one:
if (target === 'browser') {
tasks.push('open:test');
tasks.push('watch');
} else {
tasks.push('mocha');
}
As long as you don't specify browser as your test target, the tests will run headlessly in the console. But if you go like grunt test:browser, Grunt will open a browser thanks to open:test. For your reference, I also include my open:test config:
test : {
path : 'http://localhost:<%= connect.test.options.port %>'
}