<!DOCTYPE html>
<html>
<head>
<title>This tests that we use correct repaint coordinates for transformed objects.</title>
<style>
  div {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 10px;
    height: 10px;
    background-color: red;
    -webkit-transform: translateX(0.25px);
  }
</style>
</head>
<body>
<p id="container"></p>
<script>
  var container = document.getElementById("container");
  for (i = 0; i < 30; ++i) {
    adjustment = 0;
    for (j = 0; j < 30; ++j) {
      var d = document.createElement("div");
      d.style.top = (12 * i + adjustment)  + "px";
      d.style.left = (12 * j + adjustment)  + "px";
      adjustment += 0.05;
      container.appendChild(d);
    }
  }

  function move() {
    var divs = document.getElementsByTagName("div");
    for (i = 0; i < divs.length; ++i)
      divs[i].style.left = parseInt(divs[i].style.left) + 0.3 + "px";

    if (window.testRunner && window.internals) {
        var dummy = document.body.offsetTop;
        var repaintRects = window.internals.repaintRectsAsText();
        window.internals.stopTrackingRepaints();

        var pre = document.createElement('pre');
        document.body.appendChild(pre);
        pre.innerHTML = repaintRects;
        testRunner.notifyDone();
      }
  }
  
  if (window.testRunner && window.internals) {
    window.testRunner.dumpAsText(false);
    window.internals.startTrackingRepaints();
    testRunner.waitUntilDone();
  }

  setTimeout(move, 0);
</script>
</body>
</html>
