third_party/WebKit/LayoutTests/svg/custom/js-late-pattern-creation.svg

   1 <?xml version="1.0" encoding="UTF-8"?>
   2 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1 Basic//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11-basic.dtd">
   3 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"  id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" onload="runRepaintAndPixelTest()">
   4 <script xlink:href="../../fast/repaint/resources/text-based-repaint.js"/>
   5 <g id="content" transform="scale(1, 1.5)">
   6      <text font-size="68" fill="url(#dynPattern)"  x="20" y="70">Pattern on fill</text>
   7 </g>
   8 <script>
   9     window.testIsAsync = true;
  10     var content = document.getElementById("content");
  11
  12     function repaintTest() {
  13         // FIXME: we need a better way of waiting for layout/repainting to happen
  14         setTimeout(createPattern, 1);
  15     }
  16
  17     function createPattern()
  18     {
  19         var pattern = document.createElementNS("http://www.w3.org/2000/svg", "pattern");
  20         pattern.setAttribute("id", "dynPattern");
  21         pattern.setAttribute("patternUnits", "userSpaceOnUse");
  22         pattern.setAttribute("x", "0");
  23         pattern.setAttribute("y", "0");
  24         pattern.setAttribute("width", "20");
  25         pattern.setAttribute("height", "20");
  26
  27         var rect1 = document.createElementNS("http://www.w3.org/2000/svg", "rect");
  28         rect1.setAttribute("x", "5");
  29         rect1.setAttribute("y", "5");
  30         rect1.setAttribute("width", "10");
  31         rect1.setAttribute("height", "10");
  32         rect1.setAttribute("fill", "red");
  33
  34         var rect2 = document.createElementNS("http://www.w3.org/2000/svg", "rect");
  35         rect2.setAttribute("x", "10");
  36         rect2.setAttribute("y", "10");
  37         rect2.setAttribute("width", "10");
  38         rect2.setAttribute("height", "10");
  39         rect2.setAttribute("fill", "green");
  40
  41         pattern.appendChild(rect1);
  42         pattern.appendChild(rect2);
  43
  44         content.appendChild(pattern);
  45
  46         finishRepaintTest();
  47     }
  48 </script>
  49
  50 </svg>