layout/style/test/test_viewport_units.html

Thu, 15 Jan 2015 21:03:48 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Thu, 15 Jan 2015 21:03:48 +0100
branch
TOR_BUG_9701
changeset 11
deefc01c0e14
permissions
-rw-r--r--

Integrate friendly tips from Tor colleagues to make (or not) 4.5 alpha 3;
This includes removal of overloaded (but unused) methods, and addition of
a overlooked call to DataStruct::SetData(nsISupports, uint32_t, bool.)

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

mercurial