layout/style/test/test_bug771043.html

   1 <!DOCTYPE HTML>
   2 <html>
   3 <!--
   4 https://bugzilla.mozilla.org/show_bug.cgi?id=771043
   5 -->
   6 <head>
   7   <meta charset="utf-8">
   8   <title>Test for Bug 771043</title>
   9   <script src="/tests/SimpleTest/SimpleTest.js"></script>
  10   <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
  11   <script type="application/javascript">
  12
  13   /** Test for Bug 771043 **/
  14   var expectedValue;
  15   var callCount = 0;
  16   var storedHeight;
  17   function callback(arg) {
  18     ++callCount;
  19     is(arg.matches, expectedValue,
  20        "Should have the right value on call #" + callCount + " to the callback");
  21     SimpleTest.executeSoon(tests.shift());
  22   }
  23
  24   function flushLayout() {
  25     storedHeight = document.querySelector("iframe").offsetHeight;
  26   }
  27
  28   function setHeight(height) {
  29     var ifr = document.querySelector("iframe");
  30     ifr.style.height = height + "px";
  31     flushLayout();
  32   }
  33
  34   SimpleTest.waitForExplicitFinish();
  35
  36   var tests = [
  37     () => { expectedValue = true; setHeight(50); },
  38     () => { expectedValue = false; setHeight(200); },
  39     () => {
  40       var ifr = document.querySelector("iframe");
  41       ifr.style.display = "none";
  42       flushLayout();
  43       ifr.style.display = "";
  44       expectedValue = true;
  45       setHeight(50);
  46     },
  47     () => { expectedValue = false; setHeight(200); },
  48     SimpleTest.finish.bind(SimpleTest)
  49   ];
  50
  51   addLoadEvent(function() {
  52     var mql = frames[0].matchMedia("(orientation: landscape)");
  53     mql.addListener(callback);
  54
  55     tests.shift()();
  56   });
  57   </script>
  58 </head>
  59 <body>
  60 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=771043">Mozilla Bug 771043</a>
  61 <!-- Important: the iframe needs to be displayed -->
  62 <p id="display"><iframe style="width: 100px; height: 200px"</p>
  63 <div id="content" style="display: none">
  64
  65 </div>
  66 <pre id="test">
  67 </pre>
  68 </body>
  69 </html>