Permalink
Browse files

update browser test runner to mirror qunit reports for now

  • Loading branch information...
1 parent 973038a commit 22169372ff1c1654c4686f0e93639b40888af51f @caolan committed Dec 1, 2010
Showing with 149 additions and 68 deletions.
  1. +3 −0 Makefile
  2. +5 −3 README.md
  3. +65 −64 lib/reporters/browser.js
  4. +3 −0 lib/types.js
  5. +70 −0 share/nodeunit.css
  6. +3 −1 test/test.html
View
3 Makefile
@@ -53,6 +53,8 @@ browser:
echo "nodeunit.run = reporter.run;" >> $(BUILDDIR)/browser/nodeunit.js
echo "return nodeunit; })();" >> $(BUILDDIR)/browser/nodeunit.js
sed -i "/\@REMOVE_LINE_FOR_BROWSER/d" $(BUILDDIR)/browser/nodeunit.js
+ # copy nodeunit.css
+ cp share/nodeunit.css $(BUILDDIR)/browser/nodeunit.css
# create nodeunit.min.js
uglifyjs $(BUILDDIR)/browser/nodeunit.js > $(BUILDDIR)/browser/nodeunit.min.js
# create test scripts
@@ -81,6 +83,7 @@ browser:
# copy nodeunit.js to dist/browser/test to make it easier for me to host and
# run on windows VMs with IE
cp $(BUILDDIR)/browser/nodeunit.js $(BUILDDIR)/browser/test/nodeunit.js
+ cp $(BUILDDIR)/browser/nodeunit.css $(BUILDDIR)/browser/test/nodeunit.css
build: stamp-build
View
8 README.md
@@ -245,16 +245,18 @@ __test.html__
<html>
<head>
- <title>My tests</title>
+ <title>Example Test Suite</title>
+ <link rel="stylesheet" href="nodeunit.css" type="text/css" />
<script src="nodeunit.js"></script>
<script src="suite1.js"></script>
<script src="suite2.js"></script>
</head>
<body>
+ <h1 id="nodeunit-header>Example Test Suite</h1>
<script>
nodeunit.run({
- 'suite1': suite1,
- 'suite2': suite2
+ 'Suite One': suite1,
+ 'Suite Two': suite2
});
</script>
</body>
View
129 lib/reporters/browser.js
@@ -23,30 +23,6 @@
exports.info = "Browser-based test reporter";
-exports.addStyles = function () {
- document.body.innerHTML += '<style type="text/css">' +
- 'body { font: 12px Helvetica Neue }' +
- 'h2 { margin:0 ; padding:0 }' +
- 'pre {' +
- 'font: 11px Andale Mono;' +
- 'margin-left: 1em;' +
- 'padding-left: 1em;' +
- 'margin-top: 0;' +
- 'font-size:smaller;' +
- '}' +
- '.assertion_message { margin-left: 1em; }' +
- ' ol {' +
- 'list-style: none;' +
- 'margin-left: 1em;' +
- 'padding-left: 1em;' +
- 'text-indent: -1em;' +
- '}' +
- ' ol li.pass:before { content: "\\2714 \\0020"; }' +
- ' ol li.fail:before { content: "\\2716 \\0020"; }' +
- '</style>';
-};
-
-
/**
* Run all tests within each module, reporting the results
*
@@ -56,63 +32,88 @@ exports.addStyles = function () {
exports.run = function (modules, options) {
var start = new Date().getTime();
- exports.addStyles();
- var results, module;
+ function setText(el, txt) {
+ if ('innerText' in el) {
+ el.innerText = txt;
+ }
+ else if ('textContent' in el){
+ el.textContent = txt;
+ }
+ }
+
+ function getOrCreate(tag, id) {
+ var el = document.getElementById(id);
+ if (!el) {
+ el = document.createElement(tag);
+ el.id = id;
+ document.body.appendChild(el);
+ }
+ return el;
+ };
- results = document.createElement('div');
- results.id = 'results';
- document.body.appendChild(results);
+ var header = getOrCreate('h1', 'nodeunit-header');
+ var banner = getOrCreate('h2', 'nodeunit-banner');
+ var userAgent = getOrCreate('h2', 'nodeunit-userAgent');
+ var tests = getOrCreate('ol', 'nodeunit-tests');
+ var result = getOrCreate('p', 'nodeunit-testresult');
+
+ setText(userAgent, navigator.userAgent);
nodeunit.runModules(modules, {
moduleStart: function (name) {
- var mheading = document.createElement('h2');
+ /*var mheading = document.createElement('h2');
mheading.innerText = name;
results.appendChild(mheading);
module = document.createElement('ol');
- results.appendChild(module);
+ results.appendChild(module);*/
},
testDone: function (name, assertions) {
var test = document.createElement('li');
- if (!assertions.failures()) {
- test.className = 'pass';
- test.innerText = name;
- }
- else {
- test.className = 'fail';
- var html = name;
- for (var i=0; i<assertions.length; i++) {
- var a = assertions[i];
- if (a.failed()) {
- if (a.error instanceof assert.AssertionError && a.message) {
- html += '<div class="assertion_message">' +
- 'Assertion Message: ' + a.message +
- '</div>';
- }
- html += '<pre>';
- html += a.error.stack || a.error;
- html += '</pre>';
- }
- };
- test.innerHTML = html;
+ var strong = document.createElement('strong');
+ strong.innerHTML = name + ' <b style="color: black;">(' +
+ '<b class="fail">' + assertions.failures() + '</b>, ' +
+ '<b class="pass">' + assertions.passes() + '</b>, ' +
+ assertions.length +
+ ')</b>';
+ test.className = assertions.failures() ? 'fail': 'pass';
+ test.appendChild(strong);
+
+ var aList = document.createElement('ol');
+ aList.style.display = 'none';
+ test.onclick = function () {
+ var d = aList.style.display;
+ aList.style.display = (d == 'none') ? 'block': 'none';
+ };
+ for (var i=0; i<assertions.length; i++) {
+ var li = document.createElement('li');
+ var a = assertions[i];
+ if (a.failed()) {
+ li.innerHTML = (a.message || a.method || 'no message') +
+ '<pre>' + (a.error.stack || a.error) + '</pre>';
+ li.className = 'fail';
+ }
+ else {
+ li.innerHTML = a.message || a.method || 'no message';
+ li.className = 'pass';
+ }
+ aList.appendChild(li);
}
- module.appendChild(test);
+ test.appendChild(aList);
+ tests.appendChild(test);
},
done: function (assertions) {
var end = new Date().getTime();
var duration = end - start;
- var summary = document.createElement('h3');
- if (assertions.failures()) {
- summary.innerText = 'FAILURES: ' + assertions.failures() +
- '/' + assertions.length + ' assertions failed (' +
- assertions.duration + 'ms)';
- }
- else {
- summary.innerText = 'OK: ' + assertions.length +
- ' assertions (' + assertions.duration + 'ms)';
- }
- document.body.appendChild(summary);
+ var failures = assertions.failures();
+ banner.className = failures ? 'fail': 'pass';
+
+ result.innerHTML = 'Tests completed in ' + duration +
+ ' milliseconds.<br/><span class="passed">' +
+ assertions.passes() + '</span> assertions of ' +
+ '<span class="all">' + assertions.length + '<span> passed, ' +
+ assertions.failures() + ' failed.';
}
});
};
View
3 lib/types.js
@@ -57,6 +57,9 @@ exports.assertionList = function (arr, duration) {
}
return failures;
};
+ that.passes = function () {
+ return that.length - that.failures();
+ };
that.duration = duration || 0;
return that;
};
View
70 share/nodeunit.css
@@ -0,0 +1,70 @@
+/*!
+ * Styles taken from qunit.css
+ */
+
+h1#nodeunit-header, h1.nodeunit-header {
+ padding: 15px;
+ font-size: large;
+ background-color: #06b;
+ color: white;
+ font-family: 'trebuchet ms', verdana, arial;
+ margin: 0;
+}
+
+h1#nodeunit-header a {
+ color: white;
+}
+
+h2#nodeunit-banner {
+ height: 2em;
+ border-bottom: 1px solid white;
+ background-color: #eee;
+ margin: 0;
+ font-family: 'trebuchet ms', verdana, arial;
+}
+h2#nodeunit-banner.pass {
+ background-color: green;
+}
+h2#nodeunit-banner.fail {
+ background-color: red;
+}
+
+h2#nodeunit-userAgent, h2.nodeunit-userAgent {
+ padding: 10px;
+ background-color: #eee;
+ color: black;
+ margin: 0;
+ font-size: small;
+ font-weight: normal;
+ font-family: 'trebuchet ms', verdana, arial;
+ font-size: 10pt;
+}
+
+div#nodeunit-testrunner-toolbar {
+ background: #eee;
+ border-top: 1px solid black;
+ padding: 10px;
+ font-family: 'trebuchet ms', verdana, arial;
+ margin: 0;
+ font-size: 10pt;
+}
+
+ol#nodeunit-tests {
+ font-family: 'trebuchet ms', verdana, arial;
+ font-size: 10pt;
+}
+ol#nodeunit-tests li strong {
+ cursor:pointer;
+}
+ol#nodeunit-tests .pass {
+ color: green;
+}
+ol#nodeunit-tests .fail {
+ color: red;
+}
+
+p#nodeunit-testresult {
+ margin-left: 1em;
+ font-size: 10pt;
+ font-family: 'trebuchet ms', verdana, arial;
+}
View
4 test/test.html
@@ -1,17 +1,19 @@
<html>
<head>
- <title>Nodeunit tests</title>
+ <title>Nodeunit Test Suite</title>
<!--
Note this file is only used for 'make browser', when it is copied to
dist/browser/test.html for running the browser test suite
-->
+ <link rel="stylesheet" href="nodeunit.css" type="text/css" media="screen" />
<script src="nodeunit.js"></script>
<script src="test-base.js"></script>
<script src="test-runmodule.js"></script>
<script src="test-runtest.js"></script>
<script src="test-testcase.js"></script>
</head>
<body>
+ <h1 id="nodeunit-header">Nodeunit Test Suite</h1>
<script>
nodeunit.run({
'test-base': test_base,

0 comments on commit 2216937

Please sign in to comment.