third_party/WebKit/LayoutTests/fast/css/zoom-in-length-round-trip.html

   1 <p>
   2     Test that fixed integral lengths round-trip correctly through zooming.
   3 </p>
   4 <p>
   5     The test queries <tt>offsetWidth</tt> and <tt>offsetHeight</tt> of a 1&times;10-pixel rectangle under zooming by a factor of <i>k</i>/100 for 100 &le; <i>k</i> &le; 200.
   6 </p>
   7 <pre id="console"></pre>
   8 <div id="container">
   9     <div id="target" style="width: 1px; height: 10px;"></div>
  10 </div>
  11 <script>
  12     function log(message)
  13     {
  14         var console = document.getElementById("console");
  15         console.appendChild(document.createTextNode(message + "\n"));
  16     }
  17
  18     if (window.testRunner)
  19         testRunner.dumpAsText();
  20
  21     var target = document.getElementById("target");
  22     var containerStyle = document.getElementById("container").style;
  23     var zoom;
  24     var failed = false;
  25
  26     for (zoom = 100; zoom <= 200; zoom += 1) {
  27         containerStyle.setProperty("zoom", zoom / 100);
  28         if (Math.abs(target.offsetWidth - 1) > 0.5 || Math.abs(target.offsetHeight - 10) > 0.5) {
  29             failed = true;
  30             log("FAIL at " + zoom + "% magnification: 1 mapped to " + target.offsetWidth + " and 10 mapped to " + target.offsetHeight + ".");
  31         }
  32     }
  33
  34     if (!failed)
  35         log("PASS");
  36 </script>