Source code
Revision control
Copy as Markdown
Other Tools
Test Info:
- This WPT test may be referenced by the following Test IDs:
- /css/CSS2/syntax/square-brackets-001.xht - WPT Dashboard Interop Dashboard
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<head>
<title>CSS Test: Parser recovery after invalid '['</title>
<link rel="author" title="Boris Zbarsky" href="mailto:bzbarsky@mit.edu"/>
<link rel="reviewer" title="Ms2ger" href="mailto:Ms2ger@gmail.com"/>
<link rel="match" href="../reference/ref-this-text-should-be-green.xht"/>
<meta name="flags" content="invalid" />
<meta name="assert" content="When an invalid '[' is encountered where a
selector is expected, the CSS parser skips to
the matching ']' and then ignores the following
ruleset."/>
<style type="text/css"><![CDATA[
p { color: red; }
[
p { color: red !important; }
p { color: red !important; }
] p { color: red !important; }
p { color: green; }
]]></style>
</head>
<body>
<p>This text should be green.</p>
</body>
</html>
<!--
line 1
<whitespace-token>
<ident-token> p
<whitespace-token>
<{-token>
<whitespace-token>
<ident-token> color
<colon-token>
<whitespace-token>
<ident-token> red
<semicolon-token>
<whitespace-token>
<}-token>
line 2
<whitespace-token>
<[-token>
line 3
<whitespace-token>
<ident-token> p
<whitespace-token>
<{-token>
<whitespace-token>
<ident-token> color
<colon-token>
<whitespace-token>
<ident-token> red
<whitespace-token>
<delim-token> !
<ident-token> important
<semicolon-token>
<whitespace-token>
<}-token>
line 4
<whitespace-token>
<ident-token> p
<whitespace-token>
<{-token>
<whitespace-token>
<ident-token> color
<colon-token>
<whitespace-token>
<ident-token> red
<whitespace-token>
<delim-token> !
<ident-token> important
<semicolon-token>
<whitespace-token>
<}-token>
line 5
<whitespace-token>
<]-token>
<ident-token> p
<whitespace-token>
<{-token>
<whitespace-token>
<ident-token> color
<colon-token>
<whitespace-token>
<ident-token> red
<whitespace-token>
<delim-token> !
<ident-token> important
<semicolon-token>
<whitespace-token>
<}-token>
line 6
<whitespace-token>
<ident-token> p
<whitespace-token>
<{-token>
<whitespace-token>
<ident-token> color
<colon-token>
<whitespace-token>
<ident-token> green
<semicolon-token>
<whitespace-token>
<}-token>
line 7
<whitespace-token>
[
qualified rule {
prelude: [
<ident-token> p
<whitespace-token>
]
block:
simple block {
associated token: <{-token>
value: [
<whitespace-token>
<ident-token> color
<colon-token>
<whitespace-token>
<ident-token> red
<semicolon-token>
<whitespace-token>
]
}
}
qualified rule {
prelude: [
simple block {
associated token: <[-token>
value: [
<whitespace-token>
<ident-token> p
<whitespace-token>
simple block {
associated token: <{-token>
value: [
<whitespace-token>
<ident-token> color
<colon-token>
<whitespace-token>
<ident-token> red
<whitespace-token>
<delim-token> !
<ident-token> important
<semicolon-token>
<whitespace-token>
]
}
<whitespace-token>
<ident-token> p
<whitespace-token>
simple block {
associated token: <{-token>
value: [
<whitespace-token>
<ident-token> color
<colon-token>
<whitespace-token>
<ident-token> red
<whitespace-token>
<delim-token> !
<ident-token> important
<semicolon-token>
<whitespace-token>
]
}
<whitespace-token>
]
}
<ident-token> p
<whitespace-token>
]
block:
simple block {
associated token: <{-token>
value: [
<whitespace-token>
<ident-token> color
<colon-token>
<whitespace-token>
<ident-token> red
<whitespace-token>
<delim-token> !
<ident-token> important
<semicolon-token>
<whitespace-token>
]
}
}
qualified rule {
prelude: [
<ident-token> p
<whitespace-token>
]
block:
simple block {
associated token: <{-token>
value: [
<whitespace-token>
<ident-token> color
<colon-token>
<whitespace-token>
<ident-token> green
<semicolon-token>
<whitespace-token>
]
}
}
]
-->