src/third_party/WebKit/LayoutTests/svg/dom/script-tests/path-parser.js

   1 description("This tests the SVG path parser by parsing and then re-serializing various paths.");
   2
   3 var pathElement = document.createElementNS("http://www.w3.org/2000/svg", "path");
   4
   5 var pathProperties = {
   6     "M": [ "x", "y" ],
   7     "m": [ "x", "y" ],
   8     "L": [ "x", "y" ],
   9     "l": [ "x", "y" ],
  10     "H": [ "x" ],
  11     "h": [ "x" ],
  12     "V": [ "y" ],
  13     "v": [ "y" ],
  14     "Z": [ ],
  15     "z": [ ],
  16     "C": [ "x1", "y1", "x2", "y2", "x", "y" ],
  17     "c": [ "x1", "y1", "x2", "y2", "x", "y" ],
  18     "S": [ "x2", "y2", "x", "y" ],
  19     "s": [ "x2", "y2", "x", "y" ],
  20     "Q": [ "x1", "y1", "x", "y" ],
  21     "q": [ "x1", "y1", "x", "y" ],
  22     "T": [ "x", "y" ],
  23     "t": [ "x", "y" ],
  24     "A": [ "r1", "r2", "angle", "largeArcFlag", "sweepFlag", "x", "y" ],
  25     "a": [ "r1", "r2", "angle", "largeArcFlag", "sweepFlag", "x", "y" ]
  26 };
  27
  28 function printSegment(segment)
  29 {
  30     var letter = segment.pathSegTypeAsLetter;
  31     var names = pathProperties[letter];
  32     if (!names)
  33         return letter + "?";
  34     var string = letter;
  35     for (var i = 0; i < names.length; ++i) {
  36         if (i)
  37             string += ",";
  38         var value = segment[names[i]];
  39         if (value == undefined) {
  40             string += "?";
  41             continue;
  42         }
  43         if (typeof(value) === "boolean") {
  44             string += value ? 1 : 0;
  45             continue;
  46         }
  47         string += value.toFixed(1).replace(/\.0$/, "");
  48     }
  49     return string;
  50 }
  51
  52 function parsePath(string)
  53 {
  54     pathElement.setAttributeNS(null, "d", string);
  55
  56     var pathSegList = pathElement.pathSegList;
  57     var numberOfItems = pathSegList.numberOfItems;
  58
  59     var pathCommands = "";
  60     for (var i = 0; i < numberOfItems; i++) {
  61         if (i)
  62             pathCommands += " ";
  63         pathCommands += printSegment(pathSegList.getItem(i));
  64     }
  65
  66     return pathCommands;
  67 }
  68
  69 shouldBe("parsePath('M1,2')", "'M1,2'");
  70 shouldBe("parsePath('m1,2')", "'m1,2'");
  71 shouldBe("parsePath('M100,200 m3,4')", "'M100,200 m3,4'");
  72 shouldBe("parsePath('M100,200 L3,4')", "'M100,200 L3,4'");
  73 shouldBe("parsePath('M100,200 l3,4')", "'M100,200 l3,4'");
  74 shouldBe("parsePath('M100,200 H3')", "'M100,200 H3'");
  75 shouldBe("parsePath('M100,200 h3')", "'M100,200 h3'");
  76 shouldBe("parsePath('M100,200 V3')", "'M100,200 V3'");
  77 shouldBe("parsePath('M100,200 v3')", "'M100,200 v3'");
  78 shouldBe("parsePath('M100,200 Z')", "'M100,200 Z'");
  79 shouldBe("parsePath('M100,200 z')", "'M100,200 Z'");
  80 shouldBe("parsePath('M100,200 C3,4,5,6,7,8')", "'M100,200 C3,4,5,6,7,8'");
  81 shouldBe("parsePath('M100,200 c3,4,5,6,7,8')", "'M100,200 c3,4,5,6,7,8'");
  82 shouldBe("parsePath('M100,200 S3,4,5,6')", "'M100,200 S3,4,5,6'");
  83 shouldBe("parsePath('M100,200 s3,4,5,6')", "'M100,200 s3,4,5,6'");
  84 shouldBe("parsePath('M100,200 Q3,4,5,6')", "'M100,200 Q3,4,5,6'");
  85 shouldBe("parsePath('M100,200 q3,4,5,6')", "'M100,200 q3,4,5,6'");
  86 shouldBe("parsePath('M100,200 T3,4')", "'M100,200 T3,4'");
  87 shouldBe("parsePath('M100,200 t3,4')", "'M100,200 t3,4'");
  88 shouldBe("parsePath('M100,200 A3,4,5,0,0,6,7')", "'M100,200 A3,4,5,0,0,6,7'");
  89 shouldBe("parsePath('M100,200 A3,4,5,1,0,6,7')", "'M100,200 A3,4,5,1,0,6,7'");
  90 shouldBe("parsePath('M100,200 A3,4,5,0,1,6,7')", "'M100,200 A3,4,5,0,1,6,7'");
  91 shouldBe("parsePath('M100,200 A3,4,5,1,1,6,7')", "'M100,200 A3,4,5,1,1,6,7'");
  92 shouldBe("parsePath('M100,200 a3,4,5,0,0,6,7')", "'M100,200 a3,4,5,0,0,6,7'");
  93 shouldBe("parsePath('M100,200 a3,4,5,0,1,6,7')", "'M100,200 a3,4,5,0,1,6,7'");
  94 shouldBe("parsePath('M100,200 a3,4,5,1,0,6,7')", "'M100,200 a3,4,5,1,0,6,7'");
  95 shouldBe("parsePath('M100,200 a3,4,5,1,1,6,7')", "'M100,200 a3,4,5,1,1,6,7'");
  96 shouldBe("parsePath('M100,200 a3,4,5,006,7')", "'M100,200 a3,4,5,0,0,6,7'");
  97 shouldBe("parsePath('M100,200 a3,4,5,016,7')", "'M100,200 a3,4,5,0,1,6,7'");
  98 shouldBe("parsePath('M100,200 a3,4,5,106,7')", "'M100,200 a3,4,5,1,0,6,7'");
  99 shouldBe("parsePath('M100,200 a3,4,5,116,7')", "'M100,200 a3,4,5,1,1,6,7'");
 100 shouldBe("parsePath('M100,200 a3,4,5,2,1,6,7')", "'M100,200'");
 101 shouldBe("parsePath('M100,200 a3,4,5,1,2,6,7')", "'M100,200'");
 102
 103 // FIXME: This uses 'If rx = 0 or ry = 0 then this arc is treated as a straight line segment (a "lineto") joining the endpoints.'
 104 // I think the SVG DOM should still show the arc segment, fix that!
 105 shouldBe("parsePath('M100,200 a0,4,5,0,0,10,0 a4,0,5,0,0,0,10 a0,0,5,0,0,-10,0 z')", "'M100,200 l10,0 l0,10 l-10,0 Z'");
 106
 107 shouldBe("parsePath('M1,2,3,4')", "'M1,2 L3,4'");
 108 shouldBe("parsePath('m100,200,3,4')", "'m100,200 l3,4'");
 109
 110 shouldBe("parsePath('M 100-200')", "'M100,-200'");
 111 shouldBe("parsePath('M 0.6.5')", "'M0.6,0.5'");
 112
 113 shouldBe("parsePath(' M1,2')", "'M1,2'");
 114 shouldBe("parsePath('  M1,2')", "'M1,2'");
 115 shouldBe("parsePath('\\tM1,2')", "'M1,2'");
 116 shouldBe("parsePath('\\nM1,2')", "'M1,2'");
 117 shouldBe("parsePath('\\rM1,2')", "'M1,2'");
 118 shouldBe("parsePath('\\vM1,2')", "''");
 119 shouldBe("parsePath('xM1,2')", "''");
 120 shouldBe("parsePath('M1,2 ')", "'M1,2'");
 121 shouldBe("parsePath('M1,2\\t')", "'M1,2'");
 122 shouldBe("parsePath('M1,2\\n')", "'M1,2'");
 123 shouldBe("parsePath('M1,2\\r')", "'M1,2'");
 124 shouldBe("parsePath('M1,2\\v')", "'M1,2'");
 125 shouldBe("parsePath('M1,2x')", "'M1,2'");
 126 shouldBe("parsePath('M1,2 L40,0#90')", "'M1,2 L40,0'");
 127
 128 shouldBe("parsePath('')", "''");
 129 shouldBe("parsePath(' ')", "''");
 130 shouldBe("parsePath('x')", "''");
 131 shouldBe("parsePath('L1,2')", "''");
 132 shouldBe("parsePath('M.1 .2 L.3 .4 .5 .6')", "'M0.1,0.2 L0.3,0.4 L0.5,0.6'");
 133
 134 successfullyParsed = true;