1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/layout/style/test/test_media_queries_dynamic.html Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,121 @@
1.4 +<!DOCTYPE HTML>
1.5 +<html>
1.6 +<!--
1.7 +https://bugzilla.mozilla.org/show_bug.cgi?id=473400
1.8 +-->
1.9 +<head>
1.10 + <title>Test for Bug 473400</title>
1.11 + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
1.12 + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
1.13 +</head>
1.14 +<body onload="run()">
1.15 +<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=473400">Mozilla Bug 473400</a>
1.16 +<iframe id="subdoc" src="about:blank"></iframe>
1.17 +<div id="content" style="display: none">
1.18 +
1.19 +</div>
1.20 +<pre id="test">
1.21 +<script class="testbody" type="application/javascript; version=1.7">
1.22 +
1.23 +/** Test for Bug 473400 **/
1.24 +
1.25 +SimpleTest.waitForExplicitFinish();
1.26 +
1.27 +function run() {
1.28 + var subdoc = document.getElementById("subdoc").contentDocument;
1.29 + var subwin = document.getElementById("subdoc").contentWindow;
1.30 + var style = subdoc.createElement("style");
1.31 + style.setAttribute("type", "text/css");
1.32 + subdoc.getElementsByTagName("head")[0].appendChild(style);
1.33 + var sheet = style.sheet;
1.34 + var iframe_style = document.getElementById("subdoc").style;
1.35 +
1.36 + // Create a style rule and an element now based on the given media
1.37 + // query "q", and return the computed style that should be passed to
1.38 + // query_applies to see if that query currently applies.
1.39 + var n = 0;
1.40 + function make_query(q) {
1.41 + var i = ++n;
1.42 + sheet.insertRule("@media " + q + " { #e" + i + " { text-decoration: underline; } }", sheet.cssRules.length);
1.43 + var e = subdoc.createElement("div");
1.44 + e.id = "e" + i;
1.45 + subdoc.body.appendChild(e);
1.46 + var cs = subdoc.defaultView.getComputedStyle(e, "");
1.47 + cs._originalQueryText = q;
1.48 + return cs;
1.49 + }
1.50 + function query_applies(cs) {
1.51 + return cs.getPropertyValue("text-decoration") == "underline";
1.52 + }
1.53 +
1.54 + function should_apply(cs) {
1.55 + ok(query_applies(cs), cs._originalQueryText + " should apply");
1.56 + }
1.57 +
1.58 + function should_not_apply(cs) {
1.59 + ok(!query_applies(cs), cs._originalQueryText + " should not apply");
1.60 + }
1.61 +
1.62 + var content_div = document.getElementById("content");
1.63 + content_div.style.font = "initial";
1.64 + var em_size =
1.65 + getComputedStyle(content_div, "").fontSize.match(/^(\d+)px$/)[1];
1.66 +
1.67 + let width_val = 317; // pick two not-too-round numbers
1.68 + let height_val = 228;
1.69 + iframe_style.width = width_val + "px";
1.70 + iframe_style.height = height_val + "px";
1.71 + var wh_queries = [
1.72 + make_query("all and (min-width: " +
1.73 + (Math.ceil(width_val/em_size) + 1) + "em)"),
1.74 + make_query("all and (min-width: " +
1.75 + (Math.floor(width_val/em_size) - 1) + "em)"),
1.76 + make_query("all and (max-width: " +
1.77 + (Math.ceil(width_val/em_size) + 1) + "em)"),
1.78 + make_query("all and (max-width: " +
1.79 + (Math.floor(width_val/em_size) - 1) + "em)"),
1.80 + make_query("all and (min-width: " +
1.81 + (Math.ceil(width_val/(em_size*2)) + 1) + "em)"),
1.82 + make_query("all and (min-width: " +
1.83 + (Math.floor(width_val/(em_size*2)) - 1) + "em)"),
1.84 + make_query("all and (max-width: " +
1.85 + (Math.ceil(width_val/(em_size*2)) + 1) + "em)"),
1.86 + make_query("all and (max-width: " +
1.87 + (Math.floor(width_val/(em_size*2)) - 1) + "em)")
1.88 + ];
1.89 +
1.90 + is(wh_queries[0].fontSize, em_size + "px", "text zoom is 1.0");
1.91 + should_not_apply(wh_queries[0]);
1.92 + should_apply(wh_queries[1]);
1.93 + should_apply(wh_queries[2]);
1.94 + should_not_apply(wh_queries[3]);
1.95 + SpecialPowers.setTextZoom(subwin, 2.0);
1.96 + isnot(wh_queries[0].fontSize, em_size + "px", "text zoom is not 1.0");
1.97 + should_not_apply(wh_queries[4]);
1.98 + should_apply(wh_queries[5]);
1.99 + should_apply(wh_queries[6]);
1.100 + should_not_apply(wh_queries[7]);
1.101 + SpecialPowers.setTextZoom(subwin, 1.0);
1.102 + is(wh_queries[0].fontSize, em_size + "px", "text zoom is 1.0");
1.103 + is(subwin.innerHeight, 228, "full zoom is 1.0");
1.104 + should_not_apply(wh_queries[0]);
1.105 + should_apply(wh_queries[1]);
1.106 + should_apply(wh_queries[2]);
1.107 + should_not_apply(wh_queries[3]);
1.108 + SpecialPowers.setFullZoom(subwin, 2.0);
1.109 + isnot(subwin.innerHeight, 228, "full zoom is not 1.0");
1.110 + should_not_apply(wh_queries[4]);
1.111 + should_apply(wh_queries[5]);
1.112 + should_apply(wh_queries[6]);
1.113 + should_not_apply(wh_queries[7]);
1.114 + SpecialPowers.setFullZoom(subwin, 1.0);
1.115 + is(subwin.innerHeight, 228, "full zoom is 1.0");
1.116 +
1.117 + SimpleTest.finish();
1.118 +}
1.119 +
1.120 +</script>
1.121 +</pre>
1.122 +</body>
1.123 +</html>
1.124 +
