Bug Tracker

Ticket #2847: 2847.html

File 2847.html, 6.4 KB (added by nathanhammond, 14 years ago)

In depth test case.

Line 
1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
2<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
3
4<head>
5<title>2847 Test Case</title>
6<script type="text/javascript" src="jquery-1.2.6.js"></script>
7<script type="text/javascript">
8$(document).ready(function(){
9        $("ul.first1 > li:first").each(function(){
10                $(this).addClass('first');
11        });
12        $("ul.first2 > li:first").each(function(){
13                $(this).addClass('first');
14        });
15        $("ul.nth1 > li:nth(1)").each(function(){
16                $(this).addClass('nth');
17        });
18        $("ul.nth2 > li:nth(1)").each(function(){
19                $(this).addClass('nth');
20        });
21        $("ul.eq1 > li:eq(1)").each(function(){
22                $(this).addClass('eq');
23        });
24        $("ul.eq2 > li:eq(1)").each(function(){
25                $(this).addClass('eq');
26        });
27        $("ul.lt1 > li:lt(2)").each(function(){
28                $(this).addClass('lt');
29        });
30        $("ul.lt2 > li:lt(2)").each(function(){
31                $(this).addClass('lt');
32        });
33        $("ul.gt1 > li:gt(0)").each(function(){
34                $(this).addClass('gt');
35        });
36        $("ul.gt2 > li:gt(0)").each(function(){
37                $(this).addClass('gt');
38        });
39        $("ul.firstchild1 > li:first-child").each(function(){
40                $(this).addClass('firstchild');
41        });
42        $("ul.firstchild2 > li:first-child").each(function(){
43                $(this).addClass('firstchild');
44        });
45        $("ul.lastchild1 > li:last-child").each(function(){
46                $(this).addClass('lastchild');
47        });
48        $("ul.lastchild2 > li:last-child").each(function(){
49                $(this).addClass('lastchild');
50        });
51        $("ul.last1 > li:last").each(function(){
52                $(this).addClass('last');
53        });
54        $("ul.last2 > li:last").each(function(){
55                $(this).addClass('last');
56        });
57        $("ul.only1 > li:only-child").each(function(){
58                $(this).addClass('onlychild');
59        });
60        $("ul.only2 > li:only-child").each(function(){
61                $(this).addClass('onlychild');
62        });
63});
64</script>
65<style type="text/css">
66        h1 { clear: left; }
67        ul { float: left; display: inline; width: 200px; }
68        ul li.in-question { background-color: red; }
69        ul li.first,
70        ul li.last,
71        ul li.nth,
72        ul li.eq,
73        ul li.gt,
74        ul li.lt,
75        ul li.firstchild,
76        ul li.lastchild,
77        ul li.onlychild { background-color: lime; }
78</style>
79</head>
80
81<body>
82        <h1>Test :first jQuery selector.</h1>
83        <p>The first list item in each of the following lists should be green:</p>
84        <ul class="first1">
85                <li class="in-question">First LI with <strong>no</strong> preceding comment</li>
86                <li>Second LI</li>
87                <li>Third LI</li>
88        </ul>
89        <ul class="first2">
90                <!-- I am a comment -->
91                <li class="in-question">First LI <strong>with</strong> a preceding comment</li>
92                <li>Second LI</li>
93                <li>Third LI</li>
94        </ul>
95
96        <h1>Test :first-child jQuery selector.</h1>
97        <p>The first list item in each of the following lists should be green:</p>
98        <ul class="firstchild1">
99                <li class="in-question">First LI with <strong>no</strong> preceding comment</li>
100                <li>Second LI</li>
101                <li>Third LI</li>
102        </ul>
103        <ul class="firstchild2">
104                <!-- I am a comment -->
105                <li class="in-question">First LI <strong>with</strong> a preceding comment</li>
106                <li>Second LI</li>
107                <li>Third LI</li>
108        </ul>
109
110        <h1>Test :nth(1) jQuery selector.</h1>
111        <p>The second list item in each of the following lists should be green:</p>
112        <ul class="nth1">
113                <li>First LI</li>
114                <li class="in-question">Second LI with <strong>no</strong> preceding comment</li>
115                <li>Third LI</li>
116        </ul>
117        <ul class="nth2">
118                <!-- I am a comment -->
119                <li>First LI</li>
120                <li class="in-question">Second LI <strong>with</strong> a preceding comment</li>
121                <li>Third LI</li>
122        </ul>
123
124        <h1>Test :eq(1) jQuery selector.</h1>
125        <p>The second list item in each of the following lists should be green:</p>
126        <ul class="eq1">
127                <li>First LI</li>
128                <li class="in-question">Second LI with <strong>no</strong> preceding comment</li>
129                <li>Third LI</li>
130        </ul>
131        <ul class="eq2">
132                <!-- I am a comment -->
133                <li>First LI</li>
134                <li class="in-question">Second LI <strong>with</strong> a preceding comment</li>
135                <li>Third LI</li>
136        </ul>
137
138        <h1>Test :lt(2) jQuery selector.</h1>
139        <p>The first and second list item in each of the following lists should be green:</p>
140        <ul class="lt1">
141                <li class="in-question">First LI with <strong>no</strong> preceding comment</li>
142                <li class="in-question">Second LI with <strong>no</strong> preceding comment</li>
143                <li>Third LI</li>
144        </ul>
145        <ul class="lt2">
146                <!-- I am a comment -->
147                <li class="in-question">First LI <strong>with</strong> a preceding comment</li>
148                <li class="in-question">Second LI <strong>with</strong> a preceding comment</li>
149                <li>Third LI</li>
150        </ul>
151
152        <h1>Test :gt(0) jQuery selector.</h1>
153        <p>The second and third list item in each of the following lists should be green:</p>
154        <ul class="gt1">
155                <li>First LI</li>
156                <li class="in-question">Second LI with <strong>no</strong> preceding comment</li>
157                <li class="in-question">Third LI with <strong>no</strong> preceding comment</li>
158        </ul>
159        <ul class="gt2">
160                <!-- I am a comment -->
161                <li class="notgreen">First LI</li>
162                <li class="in-question">Second LI <strong>with</strong> a preceding comment</li>
163                <li class="in-question">Third LI <strong>with</strong> a preceding comment</li>
164        </ul>
165
166        <h1>Test :last jQuery selector.</h1>
167        <p>The last list item in each of the following lists should be green:</p>
168        <ul class="last1">
169                <li>First LI</li>
170                <li>Second LI</li>
171                <li class="in-question">Last LI with <strong>no</strong> following comment.</li>
172        </ul>
173        <ul class="last2">
174                <li>First LI</li>
175                <li>Second LI</li>
176                <li class="in-question">Last LI <strong>with</strong> a following comment.</li>
177                <!-- I am a comment -->
178        </ul>
179
180        <h1>Test :last-child jQuery selector.</h1>
181        <p>The last list item in each of the following lists should be green:</p>
182        <ul class="lastchild1">
183                <li>First LI</li>
184                <li>Second LI</li>
185                <li class="in-question">Last LI with <strong>no</strong> following comment.</li>
186        </ul>
187        <ul class="lastchild2">
188                <li>First LI</li>
189                <li>Second LI</li>
190                <li class="in-question">Last LI <strong>with</strong> a following comment.</li>
191                <!-- I am a comment -->
192        </ul>
193
194        <h1>Test :only-child jQuery selector.</h1>
195        <p>The only list item in each of the following lists should be green:</p>
196        <ul class="only1">
197                <li class="in-question">Only LI with <strong>no</strong> comments.</li>
198        </ul>
199        <ul class="only2">
200                <!-- I am a comment -->
201                <li class="in-question">Only LI <strong>with</strong> comments.</li>
202        </ul>
203
204</body>
205
206</html>