-
Notifications
You must be signed in to change notification settings - Fork 4
/
slickspec.html
261 lines (229 loc) · 9.06 KB
/
slickspec.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
<!DOCTYPE html>
<html>
<head>
<title>Slick Specs</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="assets/screen.css" type="text/css" media="screen" title="no title" charset="utf-8" />
<!--[if IE]><link rel="stylesheet" href="assets/ie.css" type="text/css" media="screen" title="no title" charset="utf-8" /><![endif]-->
<style type="text/css" media="screen">
.container {
padding:3em;
width: auto;
}
sup.version{
font-size: 9px;
font-style: italic;
}
div{
text-align:left;
}
#select .buttons {
text-align:right;
}
#select label {
text-align:right;
padding-top:0.8em;
}
#select div input {
line-height: 1em;
padding: 0.5em;
}
ul#prebuilt {
padding-left:0;
list-style:none;
}
#prebuilt dt a {
font-size: 1.5em;
text-decoration: none;
padding: 0.5em;
}
#prebuilt dt a:hover {
background-color: #DEE6F7;
}
.box a:hover {
background-color: #fff;
}
dt,dt b{
font-weight: normal;
}
dt{
padding-top:0.5em;
}
</style>
</head>
<body>
<div class="container">
<h1>Slick<strong>Spec</strong> <sup class="version">pre-release</sup></h1>
<p><em>Generic Selectors API Specification</em></p>
<div class="span-12 last">
<p>SlickSpec is a framework independant specification for selectors engines.</p>
<p>In this first release all the various separate specs have been combined into a single spec runner. Some of the frameworks specifically choose not to support some selectors that other frameworks fully support. In our next SlickSpec release we plan to separate out these selectors and have both a strict standards-only set and a common extenstions set of specs.</p>
</div>
<hr />
<div class="span-22">
<div class="span-8">
<h2>Bootstrapped</h2>
<dl id="prebuilt">
<!-- jQuery -->
<dt><a href="select.html?script=http://github.com/jeresig/sizzle/raw/master/sizzle.js&script=bootstrap/sizzle.slickspec.js"> → SlickSpec <strong>Sizzle</strong> <sup class="version">edge</sup></a></dt>
<dt><a href="select.html?script=http://code.jquery.com/jquery-1.4a1.js&script=bootstrap/sizzle.slickspec.js"> → SlickSpec <strong>Sizzle</strong> <sup class="version">jQuery 1.4</sup></a></dt>
<dt><a href="select.html?script=http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.js&script=bootstrap/sizzle.slickspec.js"> → SlickSpec <strong>Sizzle</strong> <sup class="version">jQuery 1.3</sup></a> </dt>
<!-- MooTools -->
<dt><a href="select.html?script=../Source/Slick.Finder.js&script=../Source/Slick.Parser.js&script=bootstrap/slick.slickspec.js"> → SlickSpec <small>MooTools</small> <strong>Slick</strong> <sup class="version">edge</sup></a></dt>
<dt><a href="select.html?script=http://ajax.googleapis.com/ajax/libs/mootools/1.2.4/mootools.js&script=bootstrap/moo12.slickspec.js"> → SlickSpec <strong>MooTools</strong> <sup class="version">1.2.4</sup></a></dt>
<!-- NWMatcher -->
<dt><a href="select.html?script=http://javascript.nwbox.com/NWMatcher/nwmatcher.js&script=bootstrap/nwmatcher.slickspec.js"> → SlickSpec <strong>NWMatcher</strong> <sup class="version">20091231</sup></a></dt>
<!-- YUI -->
<dt><a href="select.html?script=http://ajax.googleapis.com/ajax/libs/yui/2/build/yahoo/yahoo.js&script=http://ajax.googleapis.com/ajax/libs/yui/2/build/dom/dom.js&script=http://ajax.googleapis.com/ajax/libs/yui/2/build/selector/selector.js&script=bootstrap/yui.slickspec.js"> → SlickSpec <strong>YUI</strong> <sup class="version">2.x</sup></a></dt>
</dl>
<h3>Results</h3>
<p>Here we list the historical results from various browsers so that you can quickly see previous results without having to run the specs yourself.</p>
<h4>Mon Jan 11 16:28:58 -0500 2010</h4>
<dl>
<!-- jQuery -->
<dt><b><strong>Sizzle</strong> <sup class="version">edge 9AAF3C9A</sup></b></dt>
<dd>Safari 4: 1349 examples 76 failures 38 errors</dd>
<dd>IE 6: 1119 examples 12 failures 10 errors</dd>
<dt><b><strong>Sizzle</strong> <sup class="version">jQuery 1.4</sup></b></dt>
<dd>Safari 4: 1277 examples 74 failures 38 errors</dd>
<dt><b><strong>Sizzle</strong> <sup class="version">jQuery 1.3</sup></b> </dt>
<dd>Safari 4: 1277 examples 438 failures 42 errors</dd>
<!-- MooTools -->
<dt><b><small>MooTools</small> <strong>Slick</strong> <sup class="version">edge</sup></b></dt>
<dd>Safari 4: 1690 examples 5 failures 0 errors</dd>
<dd>IE 6: 1165 examples 13 failures 0 errors</dd>
<dt><b><strong>MooTools</strong> <sup class="version">1.2.4</sup></b></dt>
<dd>Safari 4: 1213 examples 284 failures 191 errors</dd>
<!-- NWMatcher -->
<dt><b><strong>NWMatcher</strong> <sup class="version">20091231</sup></b></dt>
<dd>Safari 4: 1138 examples 218 failures 248 errors</dd>
<!-- YUI -->
<dt><b><strong>YUI</strong> <sup class="version">2.x</sup></b></dt>
<dd>Safari 4: 1258 examples 471 failures 8 errors</dd>
</dl>
</div>
<div class="span-12 box">
<h2>SlickSpec for any engine</h2>
<p>To run SlickSpec on your own selector engine all you need is a link to the source and a simple bootstrap script.</p>
<p>The bootstrap script maps the generic methods that the specs use to the specific selector engine's methods.</p>
<p>See the Slick.js bootstrap as an example <a href="bootstrap/slick.slickspec.js">bootstrap/slick.slickspec.js</a>.</p>
<form action="select.html" method="get" accept-charset="utf-8" id="select">
<fieldset>
<legend>Run against a custom script</legend>
<div>
<label class="column span-3" for="script">Script(s)</label>
<input class="span-8 last" type="text" name="script" value="../Slick.Finder.js" />
</div>
<div>
<label class="column span-3" for="script"> </label>
<input class="span-8 last" type="text" name="script" value="../Slick.Parser.js" />
</div>
<div>
<label class="column span-3" for="script"> </label>
<input class="span-8 last" type="text" name="script" value="" />
</div>
<div>
<label class="column span-3" for="script"><span>Bootstrap Script</span></label>
<input class="span-8 last" type="text" name="script" value="bootstrap/slick.slickspec.js" />
</div>
<div>
<label class="column span-3" for="rerun">Rerun Spec</label>
<input class="span-8 last" type="text" name="rerun" value="" />
</div>
</fieldset>
<div class="buttons">
<input type="submit" value="SlickSpec Custom →" />
</div>
</form>
</div>
</div>
<div class="span-12">
<h3>Known Issues</h3>
<ul>
<li>
<strong>Sometimes specs run multiple times and result in a % higher than 100%</strong><br />
This isn't that big of a deal since the result of each spec should remain the same no matter how many times it is run
</li>
<li>
<strong>Some specs are currently commented out</strong><br />
We're working on supporting those additional specs in an upcoming version.
</li>
<li>
<strong>Tons of specs fail, but only sometimes</strong><br />
Sometimes specs fail simple because they haven't fully loaded before the runner tried to run them.
This is on our TODO to get fixed. Currently we use SlickSpec mostly on our localhost. Try waiting until everyhing fully loads and then refreshing the runner.
</li>
</ul>
<h3>Roadmap</h3>
<ul>
<li>
<strong>SlickSpec Pre-release <em>(current)</em></strong><br />
Get it done enough to be useful for selector engine developers.
</li>
<li>
<strong>SlickSpec 1.0 <em>(next)</em></strong>
<ol>
<li>
Switch from JSSpec to another JavaScript testing library.<br />
Probly Jasmine, but that is subject to change.
</li>
<li>
Separate out all the specs into separate groups<br />
<ul>
<li>W3C CSS 1</li>
<li>W3C CSS 2.1</li>
<li>W3C CSS 3</li>
<li>W3C CSS Draft</li>
<li>Library-specific Extensions<br />
<ul>
<li>jQuery's <code>:first</code></li>
<li>SlickJS's reverse combinators</li>
<li>etc…</li>
</ul>
</li>
<li>etc…</li>
</ul>
</li>
</ol>
</li>
<li>
<strong>SlickSpec 2.0 <em>(eventually)</em></strong>
<ul>
<li>
ServerSide JS support
<ul>
<li>Env.js</li>
<li>Jaxer</li>
<li>JScript.NET ActiveX "htmlfile"</li>
<li>etc…</li>
</ul>
</li>
<li>
Support multiple testing frameworks?
</li>
<li>
Store results and generate reports?
</li>
<li>
More integration with TestSwarm?
</li>
<li>
Bootstraps/Wrappers to map any selector engine's api to any other selector engine's api?
</li>
<li>
Other crazy awesome stuff!
</li>
</ul>
</li>
</ul>
</div>
<div class="row span-12 box">
<div>Help develop <a href="http://github.com/mootools/slick/" title="mootools/slick - GitHub">SlickSpec on GitHub</a> </div>
<div>Please report any issues with SlickSpec to <a href="http://github.com/mootools/slick/issues" title="Issues - mootools/slick - GitHub">SlickSpec Issues</a></div>
</div>
<div class="row span-12">
<p id="copyright"> SlickSpec—Copyright © MooTools 2009—MIT License </p>
</div>
</div>
</body>
</html>