<!DOCTYPE html>
<title>SVGGeometryElement.getPointAtLength method (element attached)</title>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<svg></svg>
<script>
setup(function() {
  window.svgElement = document.querySelector("svg");
});

test(function() {
  var pathElement = document.createElementNS("http://www.w3.org/2000/svg", "path");
  svgElement.appendChild(pathElement);

  function pointAtLength(string) {
      pathElement.setAttribute("d", string);

      var point = pathElement.getPointAtLength(700);
      return [Math.round(point.x), Math.round(point.y)];
  }

  assert_array_equals(pointAtLength('M0,20 L400,20 L640,20'), [640, 20]);
  assert_array_equals(pointAtLength('M0,20 L400,20 L640,20 z'), [580, 20]);
  assert_array_equals(pointAtLength('M0,20 L400,20 z M 320,20 L640,20'), [100, 20]);
  assert_array_equals(pointAtLength('M0,20 L20,40'), [20, 40]);
}, document.title + " with SVGPathElement");

test(function() {
  var rectElement = document.createElementNS("http://www.w3.org/2000/svg", "rect");
  svgElement.appendChild(rectElement);

  function pointAtLength(rx, ry, width, height) {
    rectElement.setAttribute("rx", rx);
    rectElement.setAttribute("ry", ry);
    rectElement.setAttribute("width", width);
    rectElement.setAttribute("height", height);

    var point = rectElement.getPointAtLength(300);
    return [Math.round(point.x), Math.round(point.y)];
  }

  assert_array_equals(pointAtLength(0, 0, 200, 300), [200, 100]);
  assert_array_equals(pointAtLength(50, 50, 200, 300), [200, 172]);
}, document.title + " with SVGRectElement");

test(function() {
  var circleElement = document.createElementNS("http://www.w3.org/2000/svg", "circle");
  svgElement.appendChild(circleElement);

  function pointAtLength(radius) {
    circleElement.setAttribute("r", radius);

    var point = circleElement.getPointAtLength(100);
    return [Math.round(point.x), Math.round(point.y)];
  }
  
  assert_array_equals(pointAtLength(10), [10, 0]);
  assert_array_equals(pointAtLength(100), [54, 84]);
}, document.title + " with SVGCircleElement");
</script>