LayoutTests/fast/css/max-device-aspect-ratio.html

   1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
   2 <html>
   3 <head id="myhead">
   4 <script src="../js/resources/js-test-pre.js"></script>
   5 <script>
   6 if (window.layoutTestController) {
   7     window.layoutTestController.waitUntilDone();
   8 }
   9
  10 var count = 0;
  11 var maxCount = 10;
  12 var timeout = 100;
  13
  14 function doTest()
  15 {
  16     var headElement = document.getElementById("myhead");
  17     var linkElement = document.createElement("link");
  18     linkElement.rel = "stylesheet";
  19     var width;
  20     var height;
  21     if (screen.width > screen.height) {
  22         // For a landscape screen, a ratio of 100/1 should always be greater than the screen (e.g., 16/9)
  23         width = 100;
  24         height = 1;
  25     } else {
  26         // For a portrait screen, a ratio of 1/1 will always be greater than the screen (e.g., 9/16)
  27         // For a square screen, a ratio of 1/1 will always be equal to the screen (e.g., 9/9)
  28         width = 1;
  29         height = 1;
  30     }
  31     linkElement.media = "screen and (max-device-aspect-ratio: " + width + "/" + height + ")";
  32     linkElement.href = "resources/device-aspect-ratio.css";
  33     headElement.appendChild(linkElement);
  34     description("This text is green if the max-device-aspect-ratio media query works properly.");
  35     setTimeout("waitForStylesheetLoad()", timeout);
  36 }
  37
  38 function waitForStylesheetLoad()
  39 {
  40     count++;
  41
  42     if (document.defaultView.getComputedStyle(document.getElementById('description'), null).color == "rgb(0, 128, 0)") {
  43         shouldBe("document.defaultView.getComputedStyle(document.getElementById('description'), null).color", "'rgb(0, 128, 0)'");
  44         isSuccessfullyParsed();
  45         if (window.layoutTestController) {
  46             window.layoutTestController.notifyDone();
  47         }
  48         return;
  49     }
  50
  51     if (count > maxCount) {
  52         testFailed("Stylesheet did not load in " + (maxCount * timeout / 1000) + " second(s).");
  53         return;
  54     }
  55
  56     setTimeout("waitForStylesheetLoad()", timeout);
  57 }
  58 </script>
  59 </head>
  60 <body onload="doTest()">
  61 </body>
  62 </html>