mercredi 4 février 2015

Load twig templates when testing backbone with mocha

In a project I am working in, we use twig templates. However I have been tasked with writing the test code for our backbone files. I am using Mocha, Chai and SinonJS and have run into an issue regarding the rendering of templates when testing views.


I get the following error message when simply loading the backbone file to be tested in my test driver page: TypeError: 'undefined' is not an object (evaluating 'text.replace') and points to the underscore.js file line 1310 and to the line in my backbone view file were the template method is defined:


template: _.template($('#comment-template').html())


My test driver page is:



<html>
<head>
<title>Backbone.js Tests</title>
<meta http-equiv="Content-Type"
content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<link rel="stylesheet" href="js/lib/mocha.css" />
</head>

<body>

<div id="blanket-main" class="hidden" style="display: none;"></div>

<div id="mocha"></div>

<!-- Test Fixtures. -->
<div id="fixtures" style="display: none; visibility: hidden;"></div>

<script src="js/lib/mocha.js"></script>
<script src="js/lib/chai.js"></script >
<script src="js/lib/sinon-chai.js"></script >
<script src="js/lib/sinon.js"></script >
<script src="js/lib/chai-datetime.js"></script>

<!-- JavaScript Core Libraries -->
<script src="../public/js/thirdParty/underscore.js"></script>
<script src="../public/js/thirdParty/backbone.js"></script>
<script src="../public/js/thirdParty/jquery-1.11.js"></script>
<script src="../public/js/thirdParty/jquery.dataTables.js"></script>


<!-- JavaScript Coverage Libraries. -->
<script src="js/lib/blanket.js"></script>


<!-- JavaScript Application Libraries -->
<script src="../public/js/api.js" data-cover></script>
<script src="../public/js/comment.js" data-cover></script>
<script src="../public/js/model/_entity.js" data-cover></script>

<script>

var expect = chai.expect;

mocha.setup({
ui: "bdd",
globals: ['stats', 'failures', 'runner'], // Blanket leaks.
bail: false
});

// Set up Mocha with custom Blanket.js reporter.
mocha.reporter(function (_reporter) {
// Updated for Mocha 1.15.1 integration.
// See: http://ift.tt/1LMxQAq
var blanketReporter = function (runner) {
// Listeners.
runner.on("start", function () { blanket.setupCoverage(); });
runner.on("suite", function () { blanket.onModuleStart(); });
runner.on("test", function () { blanket.onTestStart(); });
runner.on("test end", function (test) {
blanket.onTestDone(test.parent.tests.length,
test.state === 'passed');
});
runner.on("end", function () {
blanket.onTestsDone();
$("#blanket-main").removeClass("hidden").show("fast");
$("html, body").animate({ scrollTop: 0 });
});
_reporter.call(this, runner);
};

blanketReporter.prototype = _reporter.prototype;
return blanketReporter;
}(mocha._reporter));

blanket.beforeStartTestRunner({
callback: function () {
(window.mochaPhantomJS || mocha).run();
}
});

</script>

<script src="js/spec/globalNamespace.spec.js"></script>
<script src="js/spec/namespaceInstan.spec.js"></script>
<script src="js/spec/models/model_entity.spec.js"></script>
<script src="js/spec/collections/collection_entity.spec.js"></script>
<script src="js/spec/collections/collection_CommentList.spec.js"></script>
<script src="js/spec/views/view_CommentView.spec.js"></script>


<!-- Coverage style helpers -->
<style type="text/css">
#blanket-main {
margin-top: 65px;
margin-right: 20px;
margin-left: 20px;
border-radius: 5px;
border: 1px solid #666;
}
</style>

</body>

</html>


I am guessing I need to point to my templates? I can't find any documentation or workaround for using twig templates when testing backbone views with mocha, chai and sinon. What do I need to do to get this working and stop getting this error?


Aucun commentaire:

Enregistrer un commentaire