In a previous post I’ve shown a grunt and jasmine setup to develop test-driven JavaScript code. I’m really using the setup to develop code using the jQuery library and adding jasmine-jquery to the stack is mandatory.
Fixtures
By default jasmine-jquery will look for the fixtures in the spec/javascripts/fixtures folder which, in a project managed via grunt, will use the folder containing the Gruntfile.js file as the root folder any relative path is resolved from. Since my file structure is like this
project
- Gruntfile.js
- assets
- js
- spec
- fixtures
- fixture1.html
- fixture2.html
-someComponentSpec.js
- ...
- src
- someComponent.js
- ...
- vendor
- someLib.min.js
- ...
the default path will not apply. Totally new to the whole TDD JavaScript and jQuery thing I’ve had two small gotchas today.
describe("jQuery.ajaxify", function() {
var $frag;
beforeEach(function() {
again in relation to the folder containing the Gruntfile.js file I had to specify a relative path to the fixtures
jasmine.getFixtures().fixturesPath = "assets/js/spec/fixtures";
the loadFixtures method, or any other *Fixtures method for the matter, will not return anything
$frag = loadFixtures('menu_fragment.html'); // frag will be undefined
fixture contents are loaded in the DOM and are ready to be accessed using jQuery
$frag = $("#test-fixture");
});
it("should ...", function() {
...
});
});