diff options
Diffstat (limited to 'layout/reftests/css-parsing')
21 files changed, 474 insertions, 0 deletions
diff --git a/layout/reftests/css-parsing/at-rule-013-ref.html b/layout/reftests/css-parsing/at-rule-013-ref.html new file mode 100644 index 0000000000..6574ee5afe --- /dev/null +++ b/layout/reftests/css-parsing/at-rule-013-ref.html @@ -0,0 +1,25 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> +<!-- + from the CSS 2.1 test suite, + http://test.csswg.org/suites/css2.1/20110111/html4/at-rule-013.htm + + See ../css3-namespace/LICENSE . + --> +<html> + <head> + <title>CSS Test: Ignoring at-rules inside @media blocks</title> + <link rel="author" title="L. David Baron" href="https://dbaron.org/"> + <style type="text/css"> + p { + color: green; + background: transparent; + } + </style> + </head> + <body> + <p>This sentence must be green.</p> + <p>This sentence must be green.</p> + <p>This sentence must be green.</p> + <p>This sentence must be green.</p> + </body> +</html> diff --git a/layout/reftests/css-parsing/at-rule-013.html b/layout/reftests/css-parsing/at-rule-013.html new file mode 100644 index 0000000000..fa8981f050 --- /dev/null +++ b/layout/reftests/css-parsing/at-rule-013.html @@ -0,0 +1,68 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> +<!-- + from the CSS 2.1 test suite, + http://test.csswg.org/suites/css2.1/20110111/html4/at-rule-013.htm + + See ../css3-namespace/LICENSE . + --> +<html> + <head> + <title>CSS Test: Ignoring at-rules inside @media blocks</title> + <link rel="author" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact"> + <link rel="help" href="http://www.w3.org/TR/CSS21/syndata.html#parsing-errors"> + <link rel="help" href="http://www.w3.org/TR/CSS21/media.html#at-media-rule"> + <meta name="flags" content="invalid"> + <meta name="assert" content="At-rules inside @media blocks are ignored up to up to the end of the block that contains the invalid at-keyword, or up to and including the next semicolon (;) or up to and including the next block ({...}), whichever comes first."> + <style type="text/css"> + p { + color: red; + background: red; + } + @media all { + #semicolon { background: transparent; } + @foo ] & | # $ % test-token \ + [; # { background: red; } ] + (; #semicolon { background: red; } } } } ) + '; #semicolon { background: red; } } } }', + "; #semicolon { background: red; }' } } }" + ; + #semicolon { color: green; } + } + @media all { + #block { background: transparent; } + @foo ] & | # $ % test-token \ + [; #block { background: red; } ] + (; #block { background: red; } ) + '; #block { background: red; }', + "; #block { background: red; }'" + {; #block { background: red; } + #block { background: red; } } + #block { color: green; } + } + @media all { + #eob { background: transparent; } + @import "support/import-red.css" + } + #eob { + color: green; + } + @media all { + #eob-complex { background: transparent; } + @import "support/import-red.css" + [; #eob-complex { background: red; } ] + (; #eob-complex { background: red; } ) + '; #eob-complex { background: red; }', + "; #eob-complex { background: red; }'" + } + #eob-complex { + color: green; + } + </style> + </head> + <body> + <p id="semicolon">This sentence must be green.</p> + <p id="block">This sentence must be green.</p> + <p id="eob">This sentence must be green.</p> + <p id="eob-complex">This sentence must be green.</p> + </body> +</html> diff --git a/layout/reftests/css-parsing/at-rule-error-handling-import-1.html b/layout/reftests/css-parsing/at-rule-error-handling-import-1.html new file mode 100644 index 0000000000..5dc0acf945 --- /dev/null +++ b/layout/reftests/css-parsing/at-rule-error-handling-import-1.html @@ -0,0 +1,5 @@ +<!DOCTYPE HTML> +<title>Test for unexpected end of @import</title> +<style>div { color: red }</style> +<style>@import ; div { color: green; }</style> +<div>This should be green</div> diff --git a/layout/reftests/css-parsing/at-rule-error-handling-media-1.html b/layout/reftests/css-parsing/at-rule-error-handling-media-1.html new file mode 100644 index 0000000000..349410129e --- /dev/null +++ b/layout/reftests/css-parsing/at-rule-error-handling-media-1.html @@ -0,0 +1,5 @@ +<!DOCTYPE HTML> +<title>Test for unexpected end of @import</title> +<style>div { color: red }</style> +<style>@media ; div { color: green; }</style> +<div>This should be green</div> diff --git a/layout/reftests/css-parsing/at-rule-error-handling-ref.html b/layout/reftests/css-parsing/at-rule-error-handling-ref.html new file mode 100644 index 0000000000..73458df754 --- /dev/null +++ b/layout/reftests/css-parsing/at-rule-error-handling-ref.html @@ -0,0 +1,3 @@ +<!DOCTYPE HTML> +<title>Test for unexpected end of @import (reference)</title> +<div style="color: green">This should be green</div> diff --git a/layout/reftests/css-parsing/green-ref.html b/layout/reftests/css-parsing/green-ref.html new file mode 100644 index 0000000000..ebd2d860ce --- /dev/null +++ b/layout/reftests/css-parsing/green-ref.html @@ -0,0 +1,2 @@ +<!DOCTYPE html> +<div style="width: 100px; height: 100px; background: green"></div> diff --git a/layout/reftests/css-parsing/invalid-attr-1-ref.html b/layout/reftests/css-parsing/invalid-attr-1-ref.html new file mode 100644 index 0000000000..fce005c460 --- /dev/null +++ b/layout/reftests/css-parsing/invalid-attr-1-ref.html @@ -0,0 +1,15 @@ +<!DOCTYPE html> +<html> + <head> + <style> + p { color: green; } + </style> + <style> + div { color: green; } + </style> + </head> + <body> + <p>This text should be green.</p> + <div>This text should be green.</p> + </body> +</html> diff --git a/layout/reftests/css-parsing/invalid-attr-1.html b/layout/reftests/css-parsing/invalid-attr-1.html new file mode 100644 index 0000000000..b418575bba --- /dev/null +++ b/layout/reftests/css-parsing/invalid-attr-1.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> + <head> + <style> + p { color: red; } + [ + p { color: red !important; } + p { color: red !important; } + ] p { color: red !important; } + p { color: green; } + </style> + <style> + div { color: red; } + :not([) + div { color: red !important; } + div { color: red !important; } + ]) div { color: red !important; } + div { color: green; } + </style> + </head> + <body> + <p>This text should be green.</p> + <div>This text should be green.</p> + </body> +</html> diff --git a/layout/reftests/css-parsing/invalid-font-face-descriptor-1-ref.html b/layout/reftests/css-parsing/invalid-font-face-descriptor-1-ref.html new file mode 100644 index 0000000000..1e86fba7ea --- /dev/null +++ b/layout/reftests/css-parsing/invalid-font-face-descriptor-1-ref.html @@ -0,0 +1,5 @@ +<!DOCTYPE html> +<style> + body { color: green! important; } +</style> +There should be no red diff --git a/layout/reftests/css-parsing/invalid-font-face-descriptor-1.html b/layout/reftests/css-parsing/invalid-font-face-descriptor-1.html new file mode 100644 index 0000000000..43ab568f34 --- /dev/null +++ b/layout/reftests/css-parsing/invalid-font-face-descriptor-1.html @@ -0,0 +1,10 @@ +<!DOCTYPE html> +<style> + body { color: red; } + @font-face { + src: url(bbb), + } + + body { color: green! important; } +</style> +There should be no red diff --git a/layout/reftests/css-parsing/invalid-url-handling-ref.xhtml b/layout/reftests/css-parsing/invalid-url-handling-ref.xhtml new file mode 100644 index 0000000000..77dc50ba97 --- /dev/null +++ b/layout/reftests/css-parsing/invalid-url-handling-ref.xhtml @@ -0,0 +1,32 @@ +<!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 (reference)</title> + <link rel="author" title="L. David Baron" href="https://dbaron.org/" /> + <link rel="author" title="Mozilla Corporation" href="http://mozilla.com/" /> + <style type="text/css"> + div { 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> + <div id="eighteen">This should have a green background</div> + <div id="nineteen">This should have a green background</div> + </body> +</html> diff --git a/layout/reftests/css-parsing/invalid-url-handling.xhtml b/layout/reftests/css-parsing/invalid-url-handling.xhtml new file mode 100644 index 0000000000..e6b85a81c9 --- /dev/null +++ b/layout/reftests/css-parsing/invalid-url-handling.xhtml @@ -0,0 +1,135 @@ +<!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" /> + <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; bad-url token is consumed until the first closing ) */ + #foo { background: url(foo"bar) } + #three { background-color: green; } + </style> + <style type="text/css"> + /* not a URI token; bad-url token is consumed until the first closing ) */ + #four { background-color: green; } + #foo { background: url(foo"bar) } + ) } + #four { background-color: red; } + </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; bad-url token is consumed until the first closing ) + so the brace immediately after it closes the declaration block */ + #twelve { background-color: green; } + #twelve { background: url(}{""{)}); background-color: red; } + </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; bad-url token is consumed until the first closing ) */ + #foo { background: url(() } + #fourteen { background-color: green; } + </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> + <!-- Test that url() starting with a quote and without its closing ')' eaten + by any of the tokens that come after the initial quote doesn't eat the rest of + the stylesheet. In particular, this checks whether, once we reach the end of + the string and discover garbage after it, we tokenize the garbage or just skip + to the nearest ')'. --> + <style type="text/css"> + #eighteen { background-color: red; } + #foo { background: url('('')'); } + #eighteen { background-color: green; } + </style> + <!-- And the same thing with double quotes --> + <style type="text/css"> + #nineteen { background-color: red; } + #foo { background: url("("')'); } + #nineteen { 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> + <div id="eighteen">This should have a green background</div> + <div id="nineteen">This should have a green background</div> + </body> +</html> diff --git a/layout/reftests/css-parsing/moz-bool-pref.css b/layout/reftests/css-parsing/moz-bool-pref.css new file mode 100644 index 0000000000..625906df34 --- /dev/null +++ b/layout/reftests/css-parsing/moz-bool-pref.css @@ -0,0 +1,22 @@ +#test { + width: 100px; + height: 100px; +} + +.enabled { + background: red; +} + +.disabled { + background: green; +} + +@supports -moz-bool-pref("testing.supports.moz-bool-pref") { + .enabled { + background: green; + } + + .disabled { + background: red; + } +} diff --git a/layout/reftests/css-parsing/pseudo-elements-1-ref.html b/layout/reftests/css-parsing/pseudo-elements-1-ref.html new file mode 100644 index 0000000000..df626f9c68 --- /dev/null +++ b/layout/reftests/css-parsing/pseudo-elements-1-ref.html @@ -0,0 +1,22 @@ +<!doctype html><style> + div { color: green; float: left } +</style><div +><div>T</div +><div>h</div +><div>e</div +><div>r</div +><div>e</div +><div>s</div +><div>h</div +><div>o</div +><div>u</div +><div>l</div +><div>d</div +><div>b</div +><div>e</div +><div>n</div +><div>o</div +><div>r</div +><div>e</div +><div>d</div +></div> diff --git a/layout/reftests/css-parsing/pseudo-elements-1.html b/layout/reftests/css-parsing/pseudo-elements-1.html new file mode 100644 index 0000000000..43690f862e --- /dev/null +++ b/layout/reftests/css-parsing/pseudo-elements-1.html @@ -0,0 +1,36 @@ +<!doctype html><style> + div { float: left } + /* Pseudo elements can appear only at the end of the selector. */ + .good { color: red } + .bad { color: green } + #good1::first-letter { color: green } + #good2::first-letter, #good3 { color: green } + #good4, #good5::first-letter { color: green } + div > #good6::first-letter, #good7 { color:green } + div #good7 > ::first-letter, #good8 { color:green } + + #bad1::first-letter *, #bad2 { color: red } + #bad4, #bad3::first-letter * { color: red } + div::first-line #bad5, #bad6 { color: red } + #bad7, div::first-line #bad8 { color: red } + #bad9, div ::first-line>#bad10 { color:red } +</style><div +><div class="good" id="good1">T</div +><div class="good" id="good2">h</div +><div class="good" id="good3">e</div +><div class="good" id="good4">r</div +><div class="good" id="good5">e</div +><div class="good" id="good6">s</div +><div class="good" id="good7">h</div +><div class="good" id="good8">o</div +><div class="bad" id="bad1" >u</div +><div class="bad" id="bad2" >l</div +><div class="bad" id="bad3" >d</div +><div class="bad" id="bad4" >b</div +><div class="bad" id="bad5" >e</div +><div class="bad" id="bad6" >n</div +><div class="bad" id="bad7" >o</div +><div class="bad" id="bad8" >r</div +><div class="bad" id="bad9" >e</div +><div class="bad" id="bad10">d</div +></div> diff --git a/layout/reftests/css-parsing/reftest.list b/layout/reftests/css-parsing/reftest.list new file mode 100644 index 0000000000..774186e0b9 --- /dev/null +++ b/layout/reftests/css-parsing/reftest.list @@ -0,0 +1,12 @@ +== at-rule-013.html at-rule-013-ref.html +== invalid-url-handling.xhtml invalid-url-handling-ref.xhtml +== pseudo-elements-1.html pseudo-elements-1-ref.html +== invalid-attr-1.html invalid-attr-1-ref.html +== at-rule-error-handling-import-1.html at-rule-error-handling-ref.html +== at-rule-error-handling-media-1.html at-rule-error-handling-ref.html +== invalid-font-face-descriptor-1.html invalid-font-face-descriptor-1-ref.html +== two-dash-identifiers.html two-dash-identifiers-ref.html + +test-pref(testing.supports.moz-bool-pref,true) == supports-moz-bool-pref-1.html green-ref.html +test-pref(testing.supports.moz-bool-pref,false) == supports-moz-bool-pref-2.html green-ref.html +test-pref(testing.supports.moz-bool-pref,true) == supports-moz-bool-pref-3.html green-ref.html diff --git a/layout/reftests/css-parsing/supports-moz-bool-pref-1.html b/layout/reftests/css-parsing/supports-moz-bool-pref-1.html new file mode 100644 index 0000000000..80b2f27c4f --- /dev/null +++ b/layout/reftests/css-parsing/supports-moz-bool-pref-1.html @@ -0,0 +1,7 @@ +<!DOCTYPE html> +<!-- The query part here is necessary because chrome stylesheets are + cached after first parse, so the -moz-bool-pref() wouldn't be + re-evaluated if we use the same url as the other test. --> +<link rel="stylesheet" href="chrome://reftest/content/moz-bool-pref.css?1"> +<!-- testing.supports.moz-bool-pref = true --> +<div id="test" class="enabled"></div> diff --git a/layout/reftests/css-parsing/supports-moz-bool-pref-2.html b/layout/reftests/css-parsing/supports-moz-bool-pref-2.html new file mode 100644 index 0000000000..324cd0d585 --- /dev/null +++ b/layout/reftests/css-parsing/supports-moz-bool-pref-2.html @@ -0,0 +1,7 @@ +<!DOCTYPE html> +<!-- The query part here is necessary because chrome stylesheets are + cached after first parse, so the -moz-bool-pref() wouldn't be + re-evaluated if we use the same url as the other test. --> +<link rel="stylesheet" href="chrome://reftest/content/moz-bool-pref.css?2"> +<!-- testing.supports.moz-bool-pref = false --> +<div id="test" class="disabled"></div> diff --git a/layout/reftests/css-parsing/supports-moz-bool-pref-3.html b/layout/reftests/css-parsing/supports-moz-bool-pref-3.html new file mode 100644 index 0000000000..b8dc055193 --- /dev/null +++ b/layout/reftests/css-parsing/supports-moz-bool-pref-3.html @@ -0,0 +1,4 @@ +<!DOCTYPE html> +<link rel="stylesheet" href="moz-bool-pref.css"> +<!-- not valid outside chrome / ua stylesheets --> +<div id="test" class="disabled"></div> diff --git a/layout/reftests/css-parsing/two-dash-identifiers-ref.html b/layout/reftests/css-parsing/two-dash-identifiers-ref.html new file mode 100644 index 0000000000..b6ffdbb01e --- /dev/null +++ b/layout/reftests/css-parsing/two-dash-identifiers-ref.html @@ -0,0 +1,12 @@ +<!DOCTYPE html> +<style> + div { color: green; } +</style> +<div>This should be green.</div> +<div>This should be green.</div> +<div>This should be green.</div> +<div>This should be green.</div> +<div>This should be green.</div> +<div>This should be green.</div> +<div>This should be green.</div> +<div>This should be green.</div> diff --git a/layout/reftests/css-parsing/two-dash-identifiers.html b/layout/reftests/css-parsing/two-dash-identifiers.html new file mode 100644 index 0000000000..9ea7854b92 --- /dev/null +++ b/layout/reftests/css-parsing/two-dash-identifiers.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<style> + .ok { color: red; } + #-- { color: green; } + #-foo { color: green } + #--foo { color: green; } + .-- { color: green; } + .-foo { color: green; } + .--foo { color: green; } + + .fail { color: green; } + #- { color: red; } + .- { color: red; } +</style> +<div class="ok" id="--">This should be green.</div> +<div class="ok" id="-foo">This should be green.</div> +<div class="ok" id="--foo">This should be green.</div> +<div class="ok --">This should be green.</div> +<div class="ok -foo">This should be green.</div> +<div class="ok --foo">This should be green.</div> +<div class="fail" id="-">This should be green.</div> +<div class="fail -">This should be green.</div> |