layout/style/test/test_viewport_units.html@8bccb770b82d
layout/style/test/test_viewport_units.html
Wed, 31 Dec 2014 13:27:57 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Wed, 31 Dec 2014 13:27:57 +0100
- branch
- TOR_BUG_3246
- changeset 6
- 8bccb770b82d
- permissions
- -rw-r--r--
Ignore runtime configuration files generated during quality assurance.
1 <!DOCTYPE HTML>
2 <html>
3 <!--
4 https://bugzilla.mozilla.org/show_bug.cgi?id=804970
5 -->
6 <head>
7 <title>Test for dynamic changes to CSS 'vh', 'vw', 'vmin', and 'vmax' units</title>
8 <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
9 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
10 </head>
11 <body>
12 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=804970">Mozilla Bug 804970</a>
13 <iframe id="iframe" src="viewport_units_iframe.html"></iframe>
14 <pre id="test">
15 <script type="application/javascript">
17 /** Test for CSS vh/vw/vmin/vmax units **/
19 function px_to_num(str)
20 {
21 return Number(String(str).match(/^([\d.]+)px$/)[1]);
22 }
24 function width(elt)
25 {
26 return px_to_num(elt.ownerDocument.defaultView.getComputedStyle(elt, "").width);
27 }
29 SimpleTest.waitForExplicitFinish();
31 function run() {
32 var iframe = document.getElementById("iframe");
33 var idoc = iframe.contentDocument;
34 var vh = idoc.getElementById("vh");
35 var vw = idoc.getElementById("vw");
36 var vmin = idoc.getElementById("vmin");
37 var vmax = idoc.getElementById("vmax");
39 iframe.style.width = "100px";
40 iframe.style.height = "250px";
41 is(width(vh), 250, "vh should be 250px");
42 is(width(vw), 100, "vw should be 100px");
43 is(width(vmin), 100, "vmin should be 100px");
44 is(width(vmax), 250, "vmax should be 250px");
46 iframe.style.width = "300px";
47 is(width(vh), 250, "vh should be 250px");
48 is(width(vw), 300, "vw should be 300px");
49 is(width(vmin), 250, "vmin should be 250px");
50 is(width(vmax), 300, "vmax should be 300px");
52 iframe.style.height = "200px";
53 is(width(vh), 200, "vh should be 200px");
54 is(width(vw), 300, "vw should be 300px");
55 is(width(vmin), 200, "vmin should be 200px");
56 is(width(vmax), 300, "vmax should be 300px");
58 SimpleTest.finish();
59 }
61 window.addEventListener("load", run, false);
63 </script>
64 </pre>
65 </body>
66 </html>
