Skip to content

Commit acd17a0

Browse files
author
Dirk Ginader
committed
added QUnit for unit testing the expected results
1 parent 5a62733 commit acd17a0

File tree

4 files changed

+2574
-2
lines changed

4 files changed

+2574
-2
lines changed

index.html

Lines changed: 13 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
* http://www.opensource.org/licenses/mit-license.php
1515
* http://www.gnu.org/licenses/gpl.html
1616
*
17-
* Version: 1.5
17+
* Version: 1.6
1818
*
1919
* History:
2020
* * 1.0 initial release
@@ -25,7 +25,11 @@
2525
* * 1.5 adding Support for Firefox 4 thanks to Estelle Weyl
2626
* * 1.5.1 changed \0 back to \9 as \0 was also triggering Opera while \9 does not
2727
* * 1.5.2 added an Opera-hack
28+
* * 1.6 added Hack for IE 10 (not working yet)
29+
* * * also added QUnit for automated testi gof the results
2830
-->
31+
32+
<link rel="stylesheet" type="text/css" href="tests/qunit-1.10.0.css">
2933

3034
<style type="text/css">
3135
#more{
@@ -142,8 +146,8 @@
142146
<p id="firefox3_5">Firefox 3.5+</p>
143147
<p id="firefox3_6">Firefox 3.6+</p>
144148
<p id="firefox4">Firefox 4+</p>
145-
<p id="ie7">IE 7</p>
146149
<p id="ie6">IE 6</p>
150+
<p id="ie7">IE 7</p>
147151
<p id="ie6andie7">IE 6 and IE7</p>
148152
<p id="ie6andie7andie8andie9">IE6, IE 7, IE 8 and IE 9</p>
149153
<p id="ie8">IE8</p>
@@ -152,5 +156,12 @@
152156
<pre>
153157
check the code to see how the CSS Hacks work or <a href="http://blog.ginader.de/archives/2009/02/01/CSS-Voodoo-The-dark-art-of-CSS-Hacks.php">Read more about the CSS Hacks used in this Demo here</a>
154158
</pre>
159+
160+
<!-- the following code is not needed for the hack.
161+
This is for Unit testing only -->
162+
163+
<div id="qunit"></div>
164+
<script src="tests/qunit-1.10.0.js"></script>
165+
<script src="tests/tests.js"></script>
155166
</body>
156167
</html>

tests/qunit-1.10.0.css

Lines changed: 235 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,235 @@
1+
/**
2+
* QUnit v1.10.0 - A JavaScript Unit Testing Framework
3+
*
4+
* http://qunitjs.com
5+
*
6+
* Copyright 2012 jQuery Foundation and other contributors
7+
* Released under the MIT license.
8+
* http://jquery.org/license
9+
*/
10+
11+
/** Font Family and Sizes */
12+
13+
#qunit-tests, #qunit-header, #qunit-banner, #qunit-testrunner-toolbar, #qunit-userAgent, #qunit-testresult {
14+
font-family: "Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial, sans-serif;
15+
}
16+
17+
#qunit-testrunner-toolbar, #qunit-userAgent, #qunit-testresult, #qunit-tests li { font-size: small; }
18+
#qunit-tests { font-size: smaller; }
19+
20+
21+
/** Resets */
22+
23+
#qunit-tests, #qunit-tests ol, #qunit-header, #qunit-banner, #qunit-userAgent, #qunit-testresult, #qunit-modulefilter {
24+
margin: 0;
25+
padding: 0;
26+
}
27+
28+
29+
/** Header */
30+
31+
#qunit-header {
32+
padding: 0.5em 0 0.5em 1em;
33+
34+
color: #8699a4;
35+
background-color: #0d3349;
36+
37+
font-size: 1.5em;
38+
line-height: 1em;
39+
font-weight: normal;
40+
41+
border-radius: 5px 5px 0 0;
42+
-moz-border-radius: 5px 5px 0 0;
43+
-webkit-border-top-right-radius: 5px;
44+
-webkit-border-top-left-radius: 5px;
45+
}
46+
47+
#qunit-header a {
48+
text-decoration: none;
49+
color: #c2ccd1;
50+
}
51+
52+
#qunit-header a:hover,
53+
#qunit-header a:focus {
54+
color: #fff;
55+
}
56+
57+
#qunit-testrunner-toolbar label {
58+
display: inline-block;
59+
padding: 0 .5em 0 .1em;
60+
}
61+
62+
#qunit-banner {
63+
height: 5px;
64+
}
65+
66+
#qunit-testrunner-toolbar {
67+
padding: 0.5em 0 0.5em 2em;
68+
color: #5E740B;
69+
background-color: #eee;
70+
overflow: hidden;
71+
}
72+
73+
#qunit-userAgent {
74+
padding: 0.5em 0 0.5em 2.5em;
75+
background-color: #2b81af;
76+
color: #fff;
77+
text-shadow: rgba(0, 0, 0, 0.5) 2px 2px 1px;
78+
}
79+
80+
#qunit-modulefilter-container {
81+
float: right;
82+
}
83+
84+
/** Tests: Pass/Fail */
85+
86+
#qunit-tests {
87+
list-style-position: inside;
88+
}
89+
90+
#qunit-tests li {
91+
padding: 0.4em 0.5em 0.4em 2.5em;
92+
border-bottom: 1px solid #fff;
93+
list-style-position: inside;
94+
}
95+
96+
#qunit-tests.hidepass li.pass, #qunit-tests.hidepass li.running {
97+
display: none;
98+
}
99+
100+
#qunit-tests li strong {
101+
cursor: pointer;
102+
}
103+
104+
#qunit-tests li a {
105+
padding: 0.5em;
106+
color: #c2ccd1;
107+
text-decoration: none;
108+
}
109+
#qunit-tests li a:hover,
110+
#qunit-tests li a:focus {
111+
color: #000;
112+
}
113+
114+
#qunit-tests ol {
115+
margin-top: 0.5em;
116+
padding: 0.5em;
117+
118+
background-color: #fff;
119+
120+
border-radius: 5px;
121+
-moz-border-radius: 5px;
122+
-webkit-border-radius: 5px;
123+
}
124+
125+
#qunit-tests table {
126+
border-collapse: collapse;
127+
margin-top: .2em;
128+
}
129+
130+
#qunit-tests th {
131+
text-align: right;
132+
vertical-align: top;
133+
padding: 0 .5em 0 0;
134+
}
135+
136+
#qunit-tests td {
137+
vertical-align: top;
138+
}
139+
140+
#qunit-tests pre {
141+
margin: 0;
142+
white-space: pre-wrap;
143+
word-wrap: break-word;
144+
}
145+
146+
#qunit-tests del {
147+
background-color: #e0f2be;
148+
color: #374e0c;
149+
text-decoration: none;
150+
}
151+
152+
#qunit-tests ins {
153+
background-color: #ffcaca;
154+
color: #500;
155+
text-decoration: none;
156+
}
157+
158+
/*** Test Counts */
159+
160+
#qunit-tests b.counts { color: black; }
161+
#qunit-tests b.passed { color: #5E740B; }
162+
#qunit-tests b.failed { color: #710909; }
163+
164+
#qunit-tests li li {
165+
padding: 5px;
166+
background-color: #fff;
167+
border-bottom: none;
168+
list-style-position: inside;
169+
}
170+
171+
/*** Passing Styles */
172+
173+
#qunit-tests li li.pass {
174+
color: #3c510c;
175+
background-color: #fff;
176+
border-left: 10px solid #C6E746;
177+
}
178+
179+
#qunit-tests .pass { color: #528CE0; background-color: #D2E0E6; }
180+
#qunit-tests .pass .test-name { color: #366097; }
181+
182+
#qunit-tests .pass .test-actual,
183+
#qunit-tests .pass .test-expected { color: #999999; }
184+
185+
#qunit-banner.qunit-pass { background-color: #C6E746; }
186+
187+
/*** Failing Styles */
188+
189+
#qunit-tests li li.fail {
190+
color: #710909;
191+
background-color: #fff;
192+
border-left: 10px solid #EE5757;
193+
white-space: pre;
194+
}
195+
196+
#qunit-tests > li:last-child {
197+
border-radius: 0 0 5px 5px;
198+
-moz-border-radius: 0 0 5px 5px;
199+
-webkit-border-bottom-right-radius: 5px;
200+
-webkit-border-bottom-left-radius: 5px;
201+
}
202+
203+
#qunit-tests .fail { color: #000000; background-color: #EE5757; }
204+
#qunit-tests .fail .test-name,
205+
#qunit-tests .fail .module-name { color: #000000; }
206+
207+
#qunit-tests .fail .test-actual { color: #EE5757; }
208+
#qunit-tests .fail .test-expected { color: green; }
209+
210+
#qunit-banner.qunit-fail { background-color: #EE5757; }
211+
212+
213+
/** Result */
214+
215+
#qunit-testresult {
216+
padding: 0.5em 0.5em 0.5em 2.5em;
217+
218+
color: #2b81af;
219+
background-color: #D2E0E6;
220+
221+
border-bottom: 1px solid white;
222+
}
223+
#qunit-testresult .module-name {
224+
font-weight: bold;
225+
}
226+
227+
/** Fixture */
228+
229+
#qunit-fixture {
230+
position: absolute;
231+
top: -10000px;
232+
left: -10000px;
233+
width: 1000px;
234+
height: 1000px;
235+
}

0 commit comments

Comments
 (0)