Home/ Questions/Q 8163529
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-06T19:04:56+00:00

Wow, what a mess. This is the scenario. Backbone driven JS app. RequireJS for

  • 0

Wow, what a mess. This is the scenario.

  • Backbone driven JS app.

  • RequireJS for AMD functionality, initialized like this: 

    <script data-main="js/main" src="js/require.js" type="text/javascript"></script>

    then inside main.js the following config code:

    require.config(
{
    paths:
    {
        ... : ...
    }
});

    Each Backbone View/Model/Router is a “define(…)” module, and “require(“theOneRouter”, …)” is called once in main.js.

  • r.js used as optimizer with Uglify/Closure. One ‘compiled’ main.js is created in a ./release subfolder which I pick dynamically within my .net framework.

  • Took quite a while to get the Backbone + Require.JS to work, but works great now!

  • Then slapping Jasmine on top of that also took a little custom work, but it worked just fine. I had to load require.js from my SpecRunner.html, define each test module as an AMD using require’s define(…) call, and I instantiate & run Jasmine once from a call to require’s require(…) call once in the SpecRunner.html:

    require(
[
//"test/specs/testSpec1",
"test/specs/views"
],
function ()
{
    jasmine.getEnv().updateInterval = 1000;
    var reporter = new jasmine.TrivialReporter();
    jasmine.getEnv().addReporter(reporter);
    ....
    ....
});

    this too works great. Tests load & run, no issues. Require takes care of everything.

Now, I would like a framework like JSTestDriver to act as my runner. I’ve chosen JSTD for it’s simplicity, ability to test on remote browsers, code coverage support, but am still open for other suggestions.

JSTestDriver per se works fine, the only problem I have is running the combination JSTD + Jasmine + ReuireJS together. The biggest issue being, if I tell JSTD in the config file about a Jasmine/Require test module in order to load it, I get the following error:

http://requirejs.org/docs/errors.html#mismatch

If I use r.js to optmize all my code into one main.js, the combination works, including Coverage, but coverage is collected on one gigantic file and hard to analyze. Not to mention it takes very long to instrument a 50k-lines-of-code js file and to run it via JSTD.

I tried creating a fixture-like js file that loads all my Jasmine test modules & code modules, but I keep returning to the above “mismatch” error, AND, if I don’t tell JSTD about each module individually (by loading an html/js fixture that does the real loading) they won’t get instrumented for code coverage.

Has anyone gotten this specific combination to work?
Maybe I’m asking for too much…

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The solution is exactly as devadvocate mentioned. Because JsTestDriver and Require.js are competing to be the ones to manage the loading of files/dependencies, JsTestDriver throws a fit when you try to do it 100% the Require.js way (with anonymous modules and defines). Instead you have to name your modules and use require([…], function(…) {… instead of define([…]. I wrote a post that shows how to integrate QUnit, Requirejs, and code coverage with JSTD: js-test-driver+qunit+coverage+requirejs. I use QUnit in my example, but you can easily substitute QUnit for Jasmine. In trying to figure this out I considered just using PhantomJS, but for our user base it is essential that we have cross-browser testing, IE7,IE8,IE9, etc., so a single WebKit wouldn’t cut it. JsTestDriver is very useful, but I’m afraid poor documentation turns developers away. Soon I’ll get the code for my example up on GitHub. Hope this helps.

    • 0