<!DOCTYPE html>
<html>
  <head>
    <script src="../resources/text-based-repaint.js"></script>
    <script>
      if (window.testRunner)
        testRunner.dumpAsText();

      function repaintTest()
      {
        var things = document.getElementsByClassName("before");
        while (things.length)
          things[0].classList.remove("before");
      }
    </script>
    <style>
      .box {
        width: 200px;
        height: 200px;
        margin: 50px;
        background-color: green;
        -webkit-filter: url(#blur);
        filter: url(#blur);
      }
      .before {
        background-color: red;
      }
    </style>
  </head>
  <body onload="runRepaintAndPixelTest()">
    <div class="box before"></div>
    <svg xmlns="http://www.w3.org/2000/svg" width="0" height="0" version="1.1">
      <defs>
        <filter id="blur" x="-0.5" y="-0.5" width="2" height="2">
          <feGaussianBlur stdDeviation="0 20"/>
        </filter>
      </defs>
    </svg>
  </body>
</html>