third_party/WebKit/LayoutTests/svg/animations/script-tests/animate-marker-orient-from-angle-to-angle.js

   1 description("Animate SVGMarkerElement orientAttr from an angle to an angle");
   2 createSVGTestCase();
   3
   4 // Setup test document
   5
   6 var marker = createSVGElement("marker");
   7 marker.setAttribute("id", "marker");
   8 marker.setAttribute("viewBox", "0 0 10 10");
   9 marker.setAttribute("markerWidth", "2");
  10 marker.setAttribute("markerHeight", "2");
  11 marker.setAttribute("refX", "5");
  12 marker.setAttribute("refY", "5");
  13 marker.setAttribute("markerUnits", "strokeWidth");
  14
  15 var markerPath = createSVGElement("path");
  16 markerPath.setAttribute("fill", "blue");
  17 markerPath.setAttribute("d", "M 5 0 L 10 10 L 0 10 Z");
  18 marker.appendChild(markerPath);
  19
  20 var defsElement = createSVGElement("defs");
  21 defsElement.appendChild(marker);
  22 rootSVGElement.appendChild(defsElement);
  23
  24 var path = createSVGElement("path");
  25 path.setAttribute("id", "path");
  26 path.setAttribute("onclick", "executeTest()");
  27 path.setAttribute("fill", "none");
  28 path.setAttribute("stroke", "green");
  29 path.setAttribute("stroke-width", "10");
  30 path.setAttribute("marker-start", "url(#marker)");
  31 path.setAttribute("marker-end", "url(#marker)");
  32 path.setAttribute("d", "M 130 135 L 180 135 L 180 185");
  33 path.setAttribute("transform", "translate(-130, -120)");
  34 rootSVGElement.appendChild(path);
  35
  36 var animate1 = createSVGElement("animate");
  37 animate1.setAttribute("id", "animation");
  38 animate1.setAttribute("attributeName", "orient");
  39 animate1.setAttribute("begin", "path.click");
  40 animate1.setAttribute("dur", "4s");
  41 animate1.setAttribute("from", "90deg");
  42 animate1.setAttribute("to", "180deg");
  43 animate1.setAttribute("fill", "freeze");
  44 marker.appendChild(animate1);
  45
  46 // Setup animation test
  47 function sample1() {
  48     shouldBeCloseEnough("marker.orientAngle.animVal.value", "0");
  49     shouldBe("marker.orientAngle.baseVal.value", "0");
  50
  51     shouldBe("marker.orientType.animVal", "SVGMarkerElement.SVG_MARKER_ORIENT_ANGLE");
  52     shouldBe("marker.orientType.baseVal", "SVGMarkerElement.SVG_MARKER_ORIENT_ANGLE");
  53 }
  54
  55 function sample2() {
  56     shouldBeCloseEnough("marker.orientAngle.animVal.value", "90");
  57     shouldBe("marker.orientAngle.baseVal.value", "0");
  58
  59     shouldBe("marker.orientType.animVal", "SVGMarkerElement.SVG_MARKER_ORIENT_ANGLE");
  60     shouldBe("marker.orientType.baseVal", "SVGMarkerElement.SVG_MARKER_ORIENT_ANGLE");
  61 }
  62
  63 function sample3() {
  64     shouldBeCloseEnough("marker.orientAngle.animVal.value", "135");
  65     shouldBe("marker.orientAngle.baseVal.value", "0");
  66
  67     shouldBe("marker.orientType.animVal", "SVGMarkerElement.SVG_MARKER_ORIENT_ANGLE");
  68     shouldBe("marker.orientType.baseVal", "SVGMarkerElement.SVG_MARKER_ORIENT_ANGLE");
  69 }
  70
  71 function sample4() {
  72     shouldBeCloseEnough("marker.orientAngle.animVal.value", "180");
  73     shouldBe("marker.orientAngle.baseVal.value", "0");
  74
  75     shouldBe("marker.orientType.animVal", "SVGMarkerElement.SVG_MARKER_ORIENT_ANGLE");
  76     shouldBe("marker.orientType.baseVal", "SVGMarkerElement.SVG_MARKER_ORIENT_ANGLE");
  77 }
  78
  79 function executeTest() {
  80     const expectedValues = [
  81         // [animationId, time, sampleCallback]
  82         ["animation", 0.0,   sample1],
  83         ["animation", 0.001, sample2],
  84         ["animation", 2.0,   sample3],
  85         ["animation", 3.999, sample4],
  86         ["animation", 4.001, sample4]
  87     ];
  88
  89     runAnimationTest(expectedValues);
  90 }
  91
  92 var successfullyParsed = true;