third_party/WebKit/LayoutTests/svg/custom/mouse-move-on-svg-root-standalone.svg

   1 <svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" style="border: solid">
   2     <circle cx="350" cy="350" r="50" fill="green" onmousedown="startMove()"/>
   3     <text x="200" y="50" text-anchor="middle">The circle should be in the middle</text>
   4     <script>
   5         var root = document.getElementsByTagName("svg")[0];
   6         var circle = document.getElementsByTagName("circle")[0];
   7
   8         function move(evt) {
   9             var matrix = root.getScreenCTM();
  10             var point = root.createSVGPoint();
  11             point.x = evt.clientX;
  12             point.y = evt.clientY;
  13             point = point.matrixTransform(matrix.inverse());
  14             circle.cx.baseVal.value = point.x;
  15             circle.cy.baseVal.value = point.y;
  16         }
  17
  18         function startMove() {
  19             root.addEventListener("mousemove", move, false);
  20             root.addEventListener("mouseup", stopMove, false);
  21         }
  22
  23         function stopMove() {
  24             root.removeEventListener("mousemove", move, false);
  25             root.removeEventListener("mouseup", stopMove, false);
  26
  27             if (window.testRunner)
  28                 testRunner.notifyDone();
  29         }
  30
  31         if (window.testRunner)
  32             testRunner.waitUntilDone();
  33
  34         if (window.eventSender) {
  35             eventSender.mouseMoveTo(350, 350);
  36             eventSender.mouseDown();
  37             eventSender.mouseMoveTo(200, 200);
  38             eventSender.mouseUp();
  39         }
  40     </script>
  41 </svg>