Getting chai to play nice with requirejs - requirejs

Question

I am attempting to set up Karma/Mocha/Chai into my Backbone project, which uses requirejs and not having much luck.
First, here's my setup:
- app/
- js/
- bower_components/
- node_modules/
- test/
- test-main.js
- karma.conf.js
// relevant bits of karma.conf.js
frameworks: ['mocha', 'requirejs', 'chai'],
files: [
'test/test-main.js',
{pattern: 'bower_components/requirejs-text/text.js', included: false},
{pattern: 'bower_components/jquery/dist/jquery.js', included: false},
{pattern: 'bower_components/underscore/underscore.js', included: false},
{pattern: 'bower_components/backbone/backbone.js', included: false},
{pattern: 'app/js/**/*.js', included: false},
{pattern: 'test/**/*Spec.js', included: falase}
],
exclude: [ 'app/js/requireConfig.js', 'app/js/main.js' ],
preprocessors: { '**/*.html': [] },
// test-main.js
var allTestFiles = [];
var TEST_REGEXP = /(spec|test)\.js$\i;
var pathToModules = function(path) {
return path.replace(/^\/base\//, '').replace(/\.js$/, '');
}
Object.keys(window.__karma__.files).forEach(function(file) {
if (TEST_REGEXP.text(file)) {
allTestFiles.push(pathToModule(file));
}
});
require.config({
baseUrl: '/base/app/js',
paths: {
text: '../../bower_components/requirejs-text/text',
jquery: '../../bower_components/jquery/dist/jquery',
underscore: '../../bower_components/underscore/underscore',
backbone: '../../bower_components/backbone/backbone',
test: '../../test',
},
deps: allTestFiles,
callback: window.__karma__.start;
});
When I run karma, I get:
Error: Mismatched anonymous define() module: function(module) {
--the entire contents of text.js --
I tried changing the order of "frameworks" to frameworks: ['mocha', 'chai', requirejs'], which made the mismatch error go away, but then got:
TypeError: 'undefined' is not an object (evaluating 'window.chai.should')
This is a known issue and the recommendation is to keep requirejs before chai.
Does anyone have experience getting requirejs-text to work? Thanks.

Answer 1

Welp, sorry to waste a question on SO. I started from scratch and my above configuration (aside from needing "{pattern: 'app/js/**/*.html', included: false}") worked fine.
For completeness, here is the updated configuration:
- app/
- js/
- bower_components/
- node_modules/
- test/
- test-main.js
- karma.conf.js
// ---- relevant bits of karma.conf.js ----
// "requirejs" must come before "chai" or Chai will not load properly.
// Sidenote: Karma loads the listed frameworks backwards.
frameworks: ['mocha', 'requirejs', 'chai'],
// Contrary to what a few stackoverflow and github issue responses
// suggested, the order of files do not appear to matter at all.
files: [
'test/test-main.js',
// app files
{pattern: 'app/js/**/*.html', included: false},
{pattern: 'app/js/**/*.js', included: false},
// tests
{pattern: 'test/**/*Spec.js', included: false},
// libraries
{pattern: 'bower_components/jquery/dist/jquery.js', included:false, watching: false},
{pattern: 'bower_components/underscore/underscore.js', included:false, watching: false},
{pattern: 'bower_components/backbone/backbone.js', included:false, watching: false},
{pattern: 'bower_components/requirejs-text/text.js', included:false, watching: false},
],
exclude: [ 'app/js/requireConfig.js', 'app/js/main.js' ],
preprocessors: {},
// ---- test-main.js ----
var allTestFiles = [];
for (var file in window.__karma__.files) {
if (window.__karma__.files.hasOwnProperty(file)) {
if (/Spec\.js$/.test(file)) {
allTestFiles.push(file);
}
}
}
require.config({
baseUrl: '/base/app/js',
paths: {
jquery: '../../bower_components/jquery/dist/jquery',
underscore: '../../bower_components/underscore/underscore',
backbone: '../../bower_components/backbone/backbone',
text: '../../bower_components/requirejs-text/text',
},
deps: allTestFiles,
callback: window.__karma__.start;
});