I’ve been working on setting up the infrastructure for a mostly javascript based project, and we’ve been putting RequireJS into the codebase to help us manage the file dependencies instead of having to declare them within the page that is using them. As a concept, RequireJS is helping us keep different javascript modules apart in different files and let’s us assemble them.
RequireJS works by declaring dependencies and having the framework pull them in when you need them.
define(["aDependency"], function(theDependency) {
// now I can do something with theDependency
theDependency.aMethodOnIt();
})
This is pretty much how spring works, but the issue I have is that RequireJS manages the lifecycle of the javascript objects, so when you want to pass in a substitute for a test, you end up in a dilemma.
define(["aDependency"], function(theDependency) { // how do I get inject a different instance?
// now I can do something with theDependency
theDependency.aMethodOnIt();
})
Unsurprisingly a number of people wrote libraries such as testr which allow you to override the requirejs to inject different versions. Although very reasonable approaches, I find this approach a little bit smelly as you’re effectively patching a library you don’t own. The ruby community know the dangers of monkey patching too much, particularly those parts of a code base you cannot control and the potential issues you face when you try to upgrade.
Our current approach involves using RequireJS to manage the file/name dependencies, but for us to write javascript that allows us to control the instances of the objects that we want. Here’s an example:
dependency.js
define([], function () {
return function () {
return {
doSomeWork:function () {
}
};
};
});
consumer.js
define([], function () {
return function (aDependency) {
var dependency = aDependency;
return {
start:function () {
dependency.doSomeWork();
}
};
};
});
And then we control the lifecycle of the components and instances in the application using the following code.
main.js
define(["consumer", "dependency"], function (Consumer, Dependency) {
var dependency = Dependency();
var consumer = Consumer(dependency);
consumer.start();
});
And our jasmine tests get to look like this:
requirejs = require('requirejs');
describe("consumer", function() {
it("should ensure the dependency does some work", function() {
// given
var dependency = jasmine.createSpyObj("dependency", ["doSomeWork"]);
var consumer = requirejs("consumer")(dependency);
// when
consumer.start();
// then
expect(dependency.doSomeWork).toHaveBeenCalled();
});
});
This approach has been working out well, forcing us to manage the dependency and global hell that javascript global functions can quickly become. Thoughts? Please leave a comment.
