Added some interactivity to XSLT stylesheet using javascript.
--- a/test/test-automation/style.xsl Wed Jun 29 19:05:56 2011 +0300
+++ b/test/test-automation/style.xsl Wed Jun 29 20:34:59 2011 +0300
@@ -7,16 +7,123 @@
<html>
<head>
<title>Test report</title>
+
+<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"/>
+
+<script type="text/javascript">
+
+$(document).ready(function() {
+ $("span.show-tests").click(function() {
+ var content = $(this).html();
+ var id = $(this).attr('uid');
+
+ var searchString = "div.tests[uid="+id+"]";
+
+ if(content == '[Hide tests]') {
+ $(searchString).hide("fast");
+ $(this).text('[Show tests]');
+ } else {
+ $(searchString).show("fast");
+ $(this).text('[Hide tests]');
+ }
+ });
+
+ $("span.show-asserts").click(function() {
+ var content = $(this).html();
+ var id = $(this).attr('uid');
+
+ console.log("assert uid" + id);
+
+ var searchString = "div.asserts[uid="+id+"]";
+
+ if(content == '[Hide Assert Summary]') {
+ console.log("hide now");
+
+ $(searchString).hide("fast");
+ $(this).text('[Show Assert Summary]');
+ } else {
+ console.log("show now");
+
+ $(searchString).show("fast");
+ $(this).text('[Hide Assert Summary]');
+ }
+ });
+
+ $("span.show-all-tests").click(function() {
+ var content = $(this).html();
+
+ var searchString = "div.tests";
+
+ if(content == '[Hide All Tests]') {
+ console.log("hide now");
+
+ $(searchString).hide("fast");
+ $(this).text('[Show All Tests]');
+
+ /* handle the individual '[show tests]' switcher */
+ $("span.show-tests[uid]").text('[Show tests]');
+
+
+ } else {
+ console.log("show now");
+
+ $(searchString).show("fast");
+ $(this).text('[Hide All Tests]');
+
+ /* handle the individual '[show tests]' switcher */
+ $("span.show-tests[uid]").text('[Hide tests]');
+ }
+ });
+
+ $("span.show-everything").click(function() {
+ var content = $(this).html();
+
+ var searchString = "div.tests";
+
+ if(content == '[Hide Everything]') {
+ console.log("hide now");
+
+ $("div.tests").hide("fast");
+ $("div.asserts").hide("fast");
+ $(this).text('[Show Everything]');
+
+ /* handle the individual switchers */
+ $("span.show-tests[uid]").text('[Show tests]');
+ $("span.show-asserts[uid]").text('[Show Assert Summary]');
+ } else {
+ console.log("show now");
+
+ $("div.tests").show("fast");
+ $("div.asserts").show("fast");
+ $(this).text('[Hide Everything]');
+
+ /* handle the individual switchers */
+ $("span.show-tests[uid]").text('[Hide tests]');
+ $("span.show-asserts[uid]").text('[Hide Assert Summary]');
+
+ }
+ });
+
+ /* Initially everything is hidden */
+ $("div.tests").hide();
+ $("div.asserts").hide();
+});
+
+</script>
<style>
-div {
+div, h1 {
padding: 3px 10px 2px 10px;
}
+h3 {
+ padding: 0 0 0 0;
+}
+
.document {
font-family: Arial;
font-size: 11pt;
- background-color: #EEEEEE;
+ background-color: #EDEDED;
}
.description {
@@ -27,18 +134,23 @@
font-weight: bold;
}
-.aligner {
- width: 100px;
- float: left;
+.switch {
+ font-style: italic;
+ color: rgb(10, 10, 200);
+ font-size: 10pt;
+ cursor: pointer;
+}
+
+.passedTest {
+ background-color: green;
+}
+
+.failedTest {
+ background-color: red;
}
.statistics {
}
-
-.ident {
- position: relative;
- left: 100px;
-}
</style>
@@ -56,31 +168,39 @@
<br/>
<span class="title">Statistics:</span><br/>
<div class="statistics">
- <span class="aligner">Suites: </span> <xsl:value-of select="testlog/numSuites"/> <br/>
- <span class="aligner">Tests in total: </span> <xsl:value-of select="testlog/numTests"/> <br/>
+ <span>Suites: </span> <xsl:value-of select="testlog/numSuites"/> <br/>
+ <span>Tests in total: </span> <xsl:value-of select="testlog/numTests"/> <br/>
<div>
- <span class="aligner">Passed tests: </span><xsl:value-of select="testlog/numPassedTests"/> <br/>
- <span class="aligner">Failed tests: </span><xsl:value-of select="testlog/numFailedTests"/> <br/>
+ <span>Passed tests: </span><xsl:value-of select="testlog/numPassedTests"/> <br/>
+ <span>Failed tests: </span><xsl:value-of select="testlog/numFailedTests"/> <br/>
</div>
</div>
</div>
- <h3>Test results:</h3>
+ <div>
+ <h3>Test results:</h3>
+ <span class="switch show-all-tests">[Show All Tests] </span>|
+ <span class="switch show-everything">[Show Everything]</span>
+ </div>
+
<xsl:for-each select="testlog/suite">
<div id="suite">
Suite: <xsl:value-of select="name"/> (<xsl:value-of select="startTime"/>)
- <div id="suiteInfo">
+ <div class="suiteInfo">
Tests: passed <xsl:value-of select="testsPassed"/>, failed <xsl:value-of select="testsFailed"/>, skipped <xsl:value-of select="testsSkipped"/>.<br/>
Total runtime: <xsl:value-of select="totalRuntime"/> seconds. <br/>
- Show/hide tests.
- <div id="tests">
+ <span class="show-tests switch" uid="{generate-id(test)}">[Show tests]</span>
+ <div class="tests" uid="{generate-id(test)}">
<xsl:for-each select="test">
<div>
Name: <xsl:value-of select="name"/> (<xsl:value-of select="startTime"/> - <xsl:value-of select="endTime"/> ) <br/>
- Total runtime: <xsl:value-of select="totalRuntime"/> <br/>
+ Description: <span class="description"> <xsl:value-of select="description"/> </span><br/>
+
+ Total runtime: <xsl:value-of select="totalRuntime"/> seconds <br/>
Result: <xsl:value-of select="result"/> <br/>
- Show/hide assert info <br/>
- <div id="asserts">
+
+ <span class="switch show-asserts" uid="{generate-id(assertSummary)}">[Show Assert Summary]</span><br/>
+ <div class="asserts" uid="{generate-id(assertSummary)}">
<xsl:for-each select="assert">
<div id="assert">
Assert name: <xsl:value-of select="name"/> <br/>