diff options
Diffstat (limited to '')
| -rw-r--r-- | layout/style/test/test_bug511909.html | 198 |
1 files changed, 198 insertions, 0 deletions
diff --git a/layout/style/test/test_bug511909.html b/layout/style/test/test_bug511909.html new file mode 100644 index 0000000000..ec0d414f9f --- /dev/null +++ b/layout/style/test/test_bug511909.html @@ -0,0 +1,198 @@ +<html><!-- + https://bugzilla.mozilla.org/show_bug.cgi?id=511909 + --><head> +<meta http-equiv="content-type" content="text/html; charset=UTF-8"> +<title>@media and @-moz-document testcases</title> + +<script src="/tests/SimpleTest/SimpleTest.js"></script> +<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"> + +<style type="text/css"> +a { + font-weight: bold; +} + #pink { + color: pink; + } + + #green { + color: green; + } + + #blue { + color: blue; + } + +pre { + border: 1px solid black; +} +</style> + +<style type="text/css"> +@-moz-document regexp(".*test_bug511909.*"){ + #d { + color: pink; + } +} +</style> + +<style type="text/css"> +@media screen { + #m { + color: green; + } +} +</style> + +<style type="text/css"> +@-moz-document regexp(".*test_bug511909.*"){ + @media screen { + #dm { + color: blue; + } + } +} +</style> + +<!-- should parse --> +<style type="text/css"> +@media print { + @-moz-document regexp("not_this_url"),} + #mx { + color: pink; + } + } +} +</style> + +<!-- should parse --> +<style type="text/css"> +@-moz-document regexp("not_this_url"){ + @media print ,} + #mxx { + color: blue; + } + } +} +</style> + +<style type="text/css"> +@media screen { + @-moz-document regexp(".*test_bug511909.*"){ + #md { + color: green; + } + } +} +</style> + +<style type="text/css"> +@media screen { + @-moz-document regexp(".*test_bug511909.*"){ + @media screen { + @-moz-document regexp(".*test_bug511909.*"){ + @media screen { + #me { + color: blue; + } + } + } + } + } +} +</style> +</head> +<body> + <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=511909">Mozilla Bug 511909</a> + <p id="display"></p> + <div id="content" style="display: none"> + </div> + + <script class="testbody" type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + + addLoadEvent(function() { + SpecialPowers.pushPrefEnv( + { "set": [["layout.css.moz-document.content.enabled", true ]]}, + function() { + // Ensure all the sheets are re-parsed, so that the pref applies. + for (const sheet of Array.from(document.querySelectorAll('style'))) { + sheet.textContent += "/* dummy */"; + } + + var pink = getComputedStyle(document.getElementById("pink"), ""); + var green = getComputedStyle(document.getElementById("green"), ""); + var blue = getComputedStyle(document.getElementById("blue"), ""); + + var cs1 = getComputedStyle(document.getElementById("d"), ""); + var cs2 = getComputedStyle(document.getElementById("m"), ""); + var cs3 = getComputedStyle(document.getElementById("dm"), ""); + var cs4 = getComputedStyle(document.getElementById("md"), ""); + var cs5 = getComputedStyle(document.getElementById("mx"), ""); + var cs6 = getComputedStyle(document.getElementById("mxx"), ""); + var cs7 = getComputedStyle(document.getElementById("me"), ""); + + is(cs1.color, pink.color, "@-moz-document applies"); + is(cs2.color, green.color, "@media applies"); + is(cs3.color, blue.color, "@media nested in @-moz-document applies"); + is(cs4.color, green.color, "@-moz-document nested in @media applies"); + is(cs5.color, pink.color, "broken @media nested in @-moz-document correctly handled"); + is(cs6.color, blue.color, "broken @-moz-document nested in @media correctly handled"); + is(cs7.color, blue.color, "@media nested in @-moz-document nested in @media applies"); + SimpleTest.finish(); + }) + }); + </script> +<div> +<pre>default style +</pre> +<a id="pink">This line should be pink</a><br> + +<a id="green">This line should be green</a><br> + +<a id="blue">This line should be blue</a><br> + +<pre>@-moz-document {...} +</pre> +<a id="d">This line should be pink</a><br> +<pre>@media screen {...} +</pre> +<a id="m">This line should be green</a><br> +<pre>@-moz-document { + @media screen {...} +} +</pre> +<a id="dm">This line should be blue</a><br> +<pre>@media print { + @-moz-document regexp("not_this_url"),} + #mx { + color: pink; + } + } +} +</pre> +<a id="mx">This line should be pink</a><br></div> +<pre>@-moz-document regexp("not_this_url"){ + @media print ,} + #mxx { + color: blue; + } + } +} +</pre> +<a id="mxx">This line should be blue</a><br> +<pre>@media screen { + @-moz-documen {...} +} +</pre> +<a id="md">This line should be green</a><br> +<pre>@media screen { + @-moz-document { + @media screen {...} + } +} +</pre> +<a id="me">This line should be blue</a><br> + + +</body></html> |