Skip to content

Commit 8affbc3

Browse files
committed
add unit testing for css
1 parent 7726cd9 commit 8affbc3

4 files changed

Lines changed: 2095 additions & 0 deletions

File tree

tests/qunit/index.html

Lines changed: 92 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,92 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="UTF-8" />
5+
<title>QUnit Test Suite</title>
6+
<link rel="stylesheet" href="lib/qunit.css">
7+
<script src="lib/qunit.js"></script>
8+
9+
10+
11+
<!-- src files -->
12+
<script type="text/javascript" src="../../external/jquery-1.6.2.js"></script>
13+
14+
<!-- 'Core', 'Generate', 'Parse', 'Preload', 'Queue', 'Renderer', 'Util', 'renderers/Canvas' -->
15+
<script type="text/javascript" src="../../src/Core.js"></script>
16+
<script type="text/javascript" src="../../src/Generate.js"></script>
17+
<script type="text/javascript" src="../../src/Parse.js"></script>
18+
<script type="text/javascript" src="../../src/Preload.js"></script>
19+
<script type="text/javascript" src="../../src/Queue.js"></script>
20+
<script type="text/javascript" src="../../src/Renderer.js"></script>
21+
<script type="text/javascript" src="../../src/Util.js"></script>
22+
<script type="text/javascript" src="../../src/renderers/Canvas.js"></script>
23+
24+
<script src="unit/css.js"></script>
25+
26+
27+
<style>
28+
#borders div {
29+
border-color: #000;
30+
border-style: solid;
31+
}
32+
33+
#backgroundPosition div {
34+
width:50px;
35+
height:50px;
36+
}
37+
</style>
38+
</head>
39+
<body>
40+
<div id="qunit"></div>
41+
<div id="qunit-fixture" style="display:none;">
42+
<div id="borders">
43+
<div style="border-width: 1px 0;"></div>
44+
<div style="border-width: 1em 0;"></div>
45+
<div style="border-width: thin medium thick;"></div>
46+
<div style="border-width: 5% 6px 12%;"></div> <!-- percentages aren't valid -->
47+
<div style="border-width: 5em 5ex 5in 5cm;"></div>
48+
<div style="border-width: 500em 500ex 500in 500cm;"></div>
49+
<div style="border-width: 5mm 5pt 5pc 5px;"></div>
50+
<div style="border-width: auto inherit;"></div>
51+
<div style="border-width: 500mm 500pt 500pc 500px;"></div>
52+
</div>
53+
54+
<div id="padding">
55+
<div style="padding: 1px 0;"></div>
56+
<div style="padding: 1em 0;"></div>
57+
<div style="padding: thin medium thick;"></div>
58+
<div style="padding: 5% 6px 12%;"></div>
59+
<div style="padding: 5em 5ex 5in 5cm;"></div>
60+
<div style="padding: 500em 500ex 500in 500cm;"></div>
61+
<div style="padding: 5mm 5pt 5pc 5px;"></div>
62+
<div style="padding: 500mm 500pt 500pc 500px;"></div>
63+
</div>
64+
65+
<div id="backgroundPosition">
66+
<div style="background-position: 1px 0;"></div>
67+
<div style="background-position: 1em 0;"></div>
68+
<div style="background-position: thin medium;"></div>
69+
70+
<div style="background-position: 5em 5ex;"></div>
71+
<div style="background-position: 5in 5cm;"></div>
72+
<div style="background-position: 500in 500cm;"></div>
73+
<div style="background-position: 500em 500ex;"></div>
74+
<div style="background-position: 5pc 5px;"></div>
75+
<div style="background-position: 500pc 500px;"></div>
76+
<div style="background-position: 5mm 5pt;"></div>
77+
<div style="background-position: 500mm 500pt;"></div>
78+
79+
</div>
80+
81+
<div id="backgroundPositionPercentage">
82+
<div style="background-position: 5% 6px;"></div>
83+
<div style="background-position: center center;"></div>
84+
<div style="background-position: left bottom;"></div>
85+
</div>
86+
</div>
87+
88+
<!-- <iframe src="../borders.html" id="borders"></iframe> -->
89+
90+
91+
</body>
92+
</html>

tests/qunit/lib/qunit.css

Lines changed: 232 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,232 @@
1+
/**
2+
* QUnit v1.4.0pre - A JavaScript Unit Testing Framework
3+
*
4+
* http://docs.jquery.com/QUnit
5+
*
6+
* Copyright (c) 2012 John Resig, Jörn Zaefferer
7+
* Dual licensed under the MIT (MIT-LICENSE.txt)
8+
* or GPL (GPL-LICENSE.txt) licenses.
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 {
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: 15px 15px 0 0;
42+
-moz-border-radius: 15px 15px 0 0;
43+
-webkit-border-top-right-radius: 15px;
44+
-webkit-border-top-left-radius: 15px;
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-header label {
58+
display: inline-block;
59+
}
60+
61+
#qunit-banner {
62+
height: 5px;
63+
}
64+
65+
#qunit-testrunner-toolbar {
66+
padding: 0.5em 0 0.5em 2em;
67+
color: #5E740B;
68+
background-color: #eee;
69+
}
70+
71+
#qunit-userAgent {
72+
padding: 0.5em 0 0.5em 2.5em;
73+
background-color: #2b81af;
74+
color: #fff;
75+
text-shadow: rgba(0, 0, 0, 0.5) 2px 2px 1px;
76+
}
77+
78+
79+
/** Tests: Pass/Fail */
80+
81+
#qunit-tests {
82+
list-style-position: inside;
83+
}
84+
85+
#qunit-tests li {
86+
padding: 0.4em 0.5em 0.4em 2.5em;
87+
border-bottom: 1px solid #fff;
88+
list-style-position: inside;
89+
}
90+
91+
#qunit-tests.hidepass li.pass, #qunit-tests.hidepass li.running {
92+
display: none;
93+
}
94+
95+
#qunit-tests li strong {
96+
cursor: pointer;
97+
}
98+
99+
#qunit-tests li a {
100+
padding: 0.5em;
101+
color: #c2ccd1;
102+
text-decoration: none;
103+
}
104+
#qunit-tests li a:hover,
105+
#qunit-tests li a:focus {
106+
color: #000;
107+
}
108+
109+
#qunit-tests ol {
110+
margin-top: 0.5em;
111+
padding: 0.5em;
112+
113+
background-color: #fff;
114+
115+
border-radius: 15px;
116+
-moz-border-radius: 15px;
117+
-webkit-border-radius: 15px;
118+
119+
box-shadow: inset 0px 2px 13px #999;
120+
-moz-box-shadow: inset 0px 2px 13px #999;
121+
-webkit-box-shadow: inset 0px 2px 13px #999;
122+
}
123+
124+
#qunit-tests table {
125+
border-collapse: collapse;
126+
margin-top: .2em;
127+
}
128+
129+
#qunit-tests th {
130+
text-align: right;
131+
vertical-align: top;
132+
padding: 0 .5em 0 0;
133+
}
134+
135+
#qunit-tests td {
136+
vertical-align: top;
137+
}
138+
139+
#qunit-tests pre {
140+
margin: 0;
141+
white-space: pre-wrap;
142+
word-wrap: break-word;
143+
}
144+
145+
#qunit-tests del {
146+
background-color: #e0f2be;
147+
color: #374e0c;
148+
text-decoration: none;
149+
}
150+
151+
#qunit-tests ins {
152+
background-color: #ffcaca;
153+
color: #500;
154+
text-decoration: none;
155+
}
156+
157+
/*** Test Counts */
158+
159+
#qunit-tests b.counts { color: black; }
160+
#qunit-tests b.passed { color: #5E740B; }
161+
#qunit-tests b.failed { color: #710909; }
162+
163+
#qunit-tests li li {
164+
margin: 0.5em;
165+
padding: 0.4em 0.5em 0.4em 0.5em;
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: #5E740B;
175+
background-color: #fff;
176+
border-left: 26px 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: 26px solid #EE5757;
193+
white-space: pre;
194+
}
195+
196+
#qunit-tests > li:last-child {
197+
border-radius: 0 0 15px 15px;
198+
-moz-border-radius: 0 0 15px 15px;
199+
-webkit-border-bottom-right-radius: 15px;
200+
-webkit-border-bottom-left-radius: 15px;
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+
224+
/** Fixture */
225+
226+
#qunit-fixture {
227+
position: absolute;
228+
top: -10000px;
229+
left: -10000px;
230+
width: 1000px;
231+
height: 1000px;
232+
}

0 commit comments

Comments
 (0)