Preparation Code Preparation HTML (this will be inserted in the <body>
of a valid HTML5 document in standards mode) (useful when testing DOM operations or including libraries) <script src ="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" > </script >
<script src ="https://cdnjs.cloudflare.com/ajax/libs/mustache.js/0.8.1/mustache.min.js" > </script >
<script src ="http://rawgit.com/documentcloud/underscore/master/underscore.js" > </script >
<script src ="http://rawgit.com/olado/doT/master/doT.js" > </script >
<div id ='container' > </div >
<script >
window.sharedVariables = {
header: "Header",
header2: "Header2",
header3: "Header3",
header4: "Header4",
header5: "Header5",
header6: "Header6",
list: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10']
};
window.mustacheTemplate = "<div > <h1 class ='header' > {{{header}}}</h1 > <h2 class ='header2' > {{{header2}}}</h2 > <h3 class ='header3' > {{{header3}}}</h3 > <h4 class ='header4' > {{{header4}}}</h4 > <h5 class ='header5' > {{{header5}}}</h5 > <h6 class ='header6' > {{{header6}}}</h6 > <ul class ='list' > {{#list}}<li class ='item' > {{{.}}}</li > {{/list}}</ul > </div > ";
window.underscoreTemplateNoWith = _.template("<div > <h1 class ='header' > <%= data.header %></h1 > <h2 class ='header2' > <%= data.header2 %></h2 > <h3 class ='header3' > <%= data.header3 %></h3 > <h4 class ='header4' > <%= data.header4 %></h4 > <h5 class ='header5' > <%= data.header5 %></h5 > <h6 class ='header6' > <%= data.header6 %></h6 > <ul class ='list' > <% for (var i = 0, l = data.list.length; i < l; i++) { %><li class ='item' > <%= data.list[i] %></li > <% } %></ul > </div > ", null, {variable: 'data'});
// DOT
window.doTtemplate = doT.template("<div > <h1 class ='header' > {{=it.header}}</h1 > <h2 class ='header2' > {{=it.header2}}</h2 > <h3 class ='header3' > {{=it.header3}}</h3 > <h4 class ='header4' > {{=it.header4}}</h4 > <h5 class ='header5' > {{=it.header5}}</h5 > <h6 class ='header6' > {{=it.header6}}</h6 > <ul class ='list' > {{for(var i = 0,l=it.list.length;i<l;i++) { }}<li class ='item' > {{=it.list[i]}}</li > {{ } }}</ul > </div > ");
</script >
Setup JS
Teardown JS
Test cases
Test #1 Title *
Async
Code * Mustache .render (mustacheTemplate, sharedVariables);
Test #2 Title *
Async
Code * doTtemplate (sharedVariables);
Title *
Async
Code * underscoreTemplateNoWith (sharedVariables);
Title *
Async
Code * $("#container" ).html (Mustache .render (mustacheTemplate, sharedVariables));
Title *
Async
Code * $("#container" ).html (doTtemplate (sharedVariables));
Title *
Async
Code * $("#container" ).html (underscoreTemplateNoWith (sharedVariables));
Title *
Async
Code * document .getElementById ("container" ).innerHTML = Mustache .render (mustacheTemplate, sharedVariables);
Title *
Async
Code * document .getElementById ("container" ).innerHTML = doTtemplate (sharedVariables);
Title *
Async
Code * document .getElementById ("container" ).innerHTML = underscoreTemplateNoWith (sharedVariables);