What is the equivalent of nUnits [SetUp]
attribute for qUnit?
Create a Test CaseMake a call to the QUnit. test function, with two arguments. Name − The name of the test to display the test results. Function − Function testing code, having one or more assertions.
Modules with grouped test functions are used to define nested modules. QUnit run tests on the parent module before going deep on the nested ones, even if they're declared first. The beforeEach and afterEach callbacks on a nested module call will stack in LIFO (Last In, First Out) Mode to the parent hooks.
QUnit is a JavaScript library to test your JavaScript code. You can write your tests using certain functions provided by QUnit and then have QUnit run them. QUnit can run your tests in the browser or in a plain Node. js process.
var mySetupFunc(details){/* setup code */}
QUnit.testStart(mySetupFunc);
As of QUnit version 1.10.0pre-A, each registered callback will receive a hash as the first (and only) parameter. I've named mine 'details' in the example above. The contents of the hash vary by callback. Here's a list of information in each hash.
begin
(start of all tests)
{} /* empty hash */
done
(end of all tests)
log
(called within the ok() methods, etc)
testStart
(called at the start of each test)
testDone
(called at the end of each test)
moduleStart
(called at the start of each module)
moduleDone
(called at the end of each test)
// There's probably a more elegant way of doing this,
// but these two methods will add a row to a table for each test showing how long
// each test took.
var profileStartTime = null;
function startTimer(details) {
profileStartTime = new Date();
}
function stopTimer(details) {
var stopDate = new Date();
var duration = stopDate - profileStartTime;
jQuery('#profiling').append(
"<tr><td>"
+ (details.module ? details.module + ":" : "")
+ details.name
+ "<\/td><td class='duration'>"
+ duration
+ "<\/td><\/tr>");
}
QUnit.testStart(startTimer);
QUnit.testDone(stopTimer);
My html table that is reference above looks like this:
<div style='margin: 10px 0;'>
<table summary='profiling' class='profiling_table'>
<thead>
<tr>
<th>Test Name</th>
<th>Duration</th>
</tr>
</thead>
<tbody id='profiling'>
</tbody>
</table>
</div>
Perry Tew's answer helped me greatly in solving this issue for myself, and if anyone is interested I wrote an encapsulated events object that will setup all the events for you to just hook into. See below:
Please note that console.log()
doesn't work on all browsers!
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/jquery-ui.min.js"></script>
<script src="lib/qunit-1.9.0.js"></script>
<script src="lib/jquery.mockjax.js"></script>
<!-- QUnit Events -->
<script>
var testSetup = {
begin : function (data) /* before any tests start */ {
console.log("begin: [" + new Date().toLocaleTimeString() + "]");
},
moduleStart : function (data) /* before the start of each module */ {
console.log("-------\n moduleStart:", data.name);
},
testStart : function (data) /* before the start of each test */ {
console.log(" testStart:", data.name);
},
log : function (data) /* called after every assertion */ {
console.log(" log:", data.message);
},
testDone : function (data) /* after each test */ {
console.log(" testDone:", data);
},
moduleDone : function (data) /* after each module */ {
console.log(" moduleDone:", data);
},
done : function (data) /* all tests done */ {
console.log("done:", data);
},
init : function () {
QUnit.begin = testSetup.begin;
QUnit.moduleStart = testSetup.moduleStart;
QUnit.testStart = testSetup.testStart;
QUnit.log = testSetup.log;
QUnit.testDone = testSetup.testDone;
QUnit.moduleDone = testSetup.moduleDone;
QUnit.done = testSetup.done;
console.log("\n======== QUnit events initialized ==========");
}
};
$(document).ready(testSetup.init);
</script>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With