I am having trouble getting the Blanket.js report to show in the browser when testing with mocha.js. My HTML file is:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Cow tests</title>
<link rel="stylesheet" media="all" href="vendor/mocha.css">
</head>
<body>
<div id="mocha"><p><a href=".">Index</a></p></div>
<div id="messages"></div>
<div id="fixtures"></div>
<script src="vendor/mocha.js"></script>
<script src="vendor/chai.js"></script>
<script src="vendor/blanket.min.js" data-cover-adapter="vendor/mocha-blanket.js"></script>
<script>mocha.setup('bdd')</script>
<script src="cow.js" data-cover></script>
<script src="cow_test.js"></script>
<script>mocha.run();</script>
</body>
</html>
My cow.js file is:
// cow.js
(function (exports) {
"use strict";
function Cow(name) {
this.name = name || "Anon cow";
}
exports.Cow = Cow;
Cow.prototype = {
greets: function (target) {
if (!target)
throw new Error("missing target");
return this.name + " greets " + target;
}
};
})(this);
my cow_test.js file is:
var expect = chai.expect;
describe("Cow", function () {
describe("constructor", function () {
it("should have a default name", function () {
var cow = new Cow();
expect(cow.name).to.equal("Anon cow");
});
it("should set cow's name if provided", function () {
var cow = new Cow("Kate");
expect(cow.name).to.equal("Kate");
});
});
describe("#greets", function () {
it("should greet passed target", function () {
var greetings = (new Cow("Kate")).greets("Baby");
expect(greetings).to.equal("Kate greets Baby");
});
});
});
When i open the html file all i get is the mocha results. i have checked many times that my dependencies are in the right place and the blanket.min.js file is in the same folder as the mocha-blanket.js file which is in the same directory as mocha.js.