| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> |
| <html xmlns="http://www.w3.org/1999/xhtml"> |
| <head> |
| <title>CSS Test: handling of invalid url() functions</title> |
| <link rel="author" title="L. David Baron" href="https://dbaron.org/" /> |
| <link rel="author" title="Mozilla Corporation" href="http://mozilla.com/" /> |
| <link rel="help" href="http://www.w3.org/TR/CSS21/syndata.html#tokenization" /> |
| <link rel="help" href="http://www.w3.org/TR/CSS21/syndata.html#parsing-errors" /> |
| <link rel="match" href="uri-013-ref.xht"/> |
| <meta name="flags" content="invalid" /> |
| <style type="text/css"> |
| div { background-color: red } |
| </style> |
| <style type="text/css"> |
| /* not a URI token, but handled according to rules for parsing errors */ |
| #one { background: url(foo"bar") } |
| #one { background-color: green; } |
| </style> |
| <style type="text/css"> |
| /* not a URI token, but handled according to rules for parsing errors */ |
| #foo { background: url(foo"bar |
| ) } |
| #two { background-color: green; } |
| </style> |
| <style type="text/css"> |
| /* not a URI token; the unterminated string ends at end of line, so |
| the brace never matches */ |
| #three { background-color: green; } |
| #foo { background: url(foo"bar) } |
| #three { background-color: red; } |
| </style> |
| <style type="text/css"> |
| /* not a URI token; the unterminated string ends at end of line */ |
| #foo { background: url(foo"bar) } |
| ) } |
| #four { background-color: green; } |
| </style> |
| <style type="text/css"> |
| /* not a URI token; the unterminated string ends at end of line, so |
| the brace never matches */ |
| #five { background-color: green; } |
| #foo { background: url("bar) } |
| #five { background-color: red; } |
| </style> |
| <style type="text/css"> |
| /* not a URI token; the unterminated string ends at end of line */ |
| #foo { background: url("bar) } |
| ) } |
| #six { background-color: green; } |
| </style> |
| <style type="text/css"> |
| /* not a URI token, but brace matching should work */ |
| #seven { background: url(()); background-color: green; } |
| </style> |
| <style type="text/css"> |
| /* not a URI token, but brace matching should work */ |
| #eight { background: url([{}]); background-color: green; } |
| </style> |
| <style type="text/css"> |
| /* not a URI token, but brace matching should work */ |
| #nine { background: url([)]); background-color: green; } |
| </style> |
| <style type="text/css"> |
| /* perfectly good URI token (image is a 404, though) */ |
| #ten { background: url({) green; } |
| </style> |
| <style type="text/css"> |
| /* perfectly good URI token (image is a 404, though) */ |
| #eleven { background: url([) green; } |
| </style> |
| <style type="text/css"> |
| /* not a URI token; brace matching should work only after invalid URI token */ |
| #twelve { background: url(}{""{)}); background-color: green; } |
| </style> |
| <style type="text/css"> |
| /* invalid URI token absorbs the [ */ |
| #thirteen { background: url([""); background-color: green; } |
| </style> |
| <style type="text/css"> |
| /* not a URI token; the opening ( is never matched */ |
| #fourteen { background-color: green; } |
| #foo { background: url(() } |
| #fourteen { background-color: red; } |
| </style> |
| <!-- The next three tests test that invalid URI tokens absorb [ and { --> |
| <style type="text/css"> |
| #foo { background: url(a()); } |
| #fifteen { background-color: green } |
| </style> |
| <style type="text/css"> |
| #foo { background: url([()); } |
| #sixteen { background-color: green } |
| </style> |
| <style type="text/css"> |
| #foo { background: url({()); } |
| #seventeen { background-color: green } |
| </style> |
| </head> |
| <body> |
| <div id="one">This should have a green background</div> |
| <div id="two">This should have a green background</div> |
| <div id="three">This should have a green background</div> |
| <div id="four">This should have a green background</div> |
| <div id="five">This should have a green background</div> |
| <div id="six">This should have a green background</div> |
| <div id="seven">This should have a green background</div> |
| <div id="eight">This should have a green background</div> |
| <div id="nine">This should have a green background</div> |
| <div id="ten">This should have a green background</div> |
| <div id="eleven">This should have a green background</div> |
| <div id="twelve">This should have a green background</div> |
| <div id="thirteen">This should have a green background</div> |
| <div id="fourteen">This should have a green background</div> |
| <div id="fifteen">This should have a green background</div> |
| <div id="sixteen">This should have a green background</div> |
| <div id="seventeen">This should have a green background</div> |
| </body> |
| </html> |
