|
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> |
|
2 <html xmlns="http://www.w3.org/1999/xhtml"> |
|
3 <head> |
|
4 <title>CSS Test: handling of invalid url() functions</title> |
|
5 <link rel="author" title="L. David Baron" href="http://dbaron.org/" /> |
|
6 <link rel="author" title="Mozilla Corporation" href="http://mozilla.com/" /> |
|
7 <link rel="help" href="http://www.w3.org/TR/CSS21/syndata.html#tokenization" /> |
|
8 <link rel="help" href="http://www.w3.org/TR/CSS21/syndata.html#parsing-errors" /> |
|
9 <meta name="flags" content="invalid" /> |
|
10 <style type="text/css"> |
|
11 div { background-color: red } |
|
12 </style> |
|
13 <style type="text/css"> |
|
14 /* not a URI token, but handled according to rules for parsing errors */ |
|
15 #one { background: url(foo"bar") } |
|
16 #one { background-color: green; } |
|
17 </style> |
|
18 <style type="text/css"> |
|
19 /* not a URI token, but handled according to rules for parsing errors */ |
|
20 #foo { background: url(foo"bar |
|
21 ) } |
|
22 #two { background-color: green; } |
|
23 </style> |
|
24 <style type="text/css"> |
|
25 /* not a URI token; the unterminated string ends at end of line, so |
|
26 the brace never matches */ |
|
27 #three { background-color: green; } |
|
28 #foo { background: url(foo"bar) } |
|
29 #three { background-color: red; } |
|
30 </style> |
|
31 <style type="text/css"> |
|
32 /* not a URI token; the unterminated string ends at end of line */ |
|
33 #foo { background: url(foo"bar) } |
|
34 ) } |
|
35 #four { background-color: green; } |
|
36 </style> |
|
37 <style type="text/css"> |
|
38 /* not a URI token; the unterminated string ends at end of line, so |
|
39 the brace never matches */ |
|
40 #five { background-color: green; } |
|
41 #foo { background: url("bar) } |
|
42 #five { background-color: red; } |
|
43 </style> |
|
44 <style type="text/css"> |
|
45 /* not a URI token; the unterminated string ends at end of line */ |
|
46 #foo { background: url("bar) } |
|
47 ) } |
|
48 #six { background-color: green; } |
|
49 </style> |
|
50 <style type="text/css"> |
|
51 /* not a URI token, but brace matching should work */ |
|
52 #seven { background: url(()); background-color: green; } |
|
53 </style> |
|
54 <style type="text/css"> |
|
55 /* not a URI token, but brace matching should work */ |
|
56 #eight { background: url([{}]); background-color: green; } |
|
57 </style> |
|
58 <style type="text/css"> |
|
59 /* not a URI token, but brace matching should work */ |
|
60 #nine { background: url([)]); background-color: green; } |
|
61 </style> |
|
62 <style type="text/css"> |
|
63 /* perfectly good URI token (image is a 404, though) */ |
|
64 #ten { background: url({) green; } |
|
65 </style> |
|
66 <style type="text/css"> |
|
67 /* perfectly good URI token (image is a 404, though) */ |
|
68 #eleven { background: url([) green; } |
|
69 </style> |
|
70 <style type="text/css"> |
|
71 /* not a URI token; brace matching should work only after invalid URI token */ |
|
72 #twelve { background: url(}{""{)}); background-color: green; } |
|
73 </style> |
|
74 <style type="text/css"> |
|
75 /* invalid URI token absorbs the [ */ |
|
76 #thirteen { background: url([""); background-color: green; } |
|
77 </style> |
|
78 <style type="text/css"> |
|
79 /* not a URI token; the opening ( is never matched */ |
|
80 #fourteen { background-color: green; } |
|
81 #foo { background: url(() } |
|
82 #fourteen { background-color: red; } |
|
83 </style> |
|
84 <!-- The next three tests test that invalid URI tokens absorb [ and { --> |
|
85 <style type="text/css"> |
|
86 #foo { background: url(a()); } |
|
87 #fifteen { background-color: green } |
|
88 </style> |
|
89 <style type="text/css"> |
|
90 #foo { background: url([()); } |
|
91 #sixteen { background-color: green } |
|
92 </style> |
|
93 <style type="text/css"> |
|
94 #foo { background: url({()); } |
|
95 #seventeen { background-color: green } |
|
96 </style> |
|
97 </head> |
|
98 <body> |
|
99 <div id="one">This should have a green background</div> |
|
100 <div id="two">This should have a green background</div> |
|
101 <div id="three">This should have a green background</div> |
|
102 <div id="four">This should have a green background</div> |
|
103 <div id="five">This should have a green background</div> |
|
104 <div id="six">This should have a green background</div> |
|
105 <div id="seven">This should have a green background</div> |
|
106 <div id="eight">This should have a green background</div> |
|
107 <div id="nine">This should have a green background</div> |
|
108 <div id="ten">This should have a green background</div> |
|
109 <div id="eleven">This should have a green background</div> |
|
110 <div id="twelve">This should have a green background</div> |
|
111 <div id="thirteen">This should have a green background</div> |
|
112 <div id="fourteen">This should have a green background</div> |
|
113 <div id="fifteen">This should have a green background</div> |
|
114 <div id="sixteen">This should have a green background</div> |
|
115 <div id="seventeen">This should have a green background</div> |
|
116 </body> |
|
117 </html> |