Source code
Revision control
Copy as Markdown
Other Tools
SVG Preview (Scaled)
<?xml version="1.0" encoding="UTF-8"?>
<metadata>
</metadata>
<h:script src="/resources/testharness.js"/>
<h:script src="/resources/testharnessreport.js"/>
<path id="track" d="m 10 20 h 30"/>S
<script><![CDATA[
test(function() {
let track = document.getElementById('track');
assert_equals(Object.getPrototypeOf(track), SVGPathElement.prototype);
assert_not_equals(track.getPathData, undefined);
assert_not_equals(track.setPathData, undefined);
assert_not_equals(track.getPathSegmentAtLength, undefined);
}, "SVGPathSegment interface exists");
function checkObjects(actual, expected, epsilon) {
if (Array.isArray(expected)) {
if (actual.length != expected.length) {
return false;
}
for (let i = 0; i < expected.length; i++) {
if (!checkObjects(actual[i], expected[i], epsilon) ) {
return false;
}
}
return true;
}
if (typeof expected == "object") {
for (let key in expected) {
if (!checkObjects(actual[key], expected[key], epsilon)) {
return false;
}
}
return true;
}
if (typeof expected == "number") {
if (epsilon === undefined) {
epsilon = 0;
}
return Math.abs(actual - expected) <= epsilon;
}
return actual == expected;
}
function ToString(value) {
let output = "";
if (Array.isArray(value)) {
let arrayAsString = [];
for (let i = 0; i < value.length; i++) {
arrayAsString.push(ToString(value[i]));
}
return arrayAsString.join(' ');
}
if (typeof value == "object") {
let objectAsArray = [];
for (let key in value) {
objectAsArray.push(ToString(value[key]));
}
return objectAsArray.join(' ');
}
if (typeof value == "number") {
return "" + +value.toFixed(3);
}
return value;
}
var checkPathData = function(actual, expected, epsilon) {
assert_true(checkObjects(actual, expected, epsilon), "actual:" + ToString(actual) + " expected:" + ToString(expected));
};
let getPathDataTests = [
{
description: "straight lines",
input: "M 0 0 H 100 V 100 H 0 Z",
output: [
{ type: "M", values: [0, 0] },
{ type: "H", values: [100] },
{ type: "V", values: [100] },
{ type: "H", values: [0] },
{ type: "Z", values: [] }
]
},
{
description: "cubic",
input: "M 413 140 C 413 140 438 40 302 44",
output: [
{ type: "M", values: [413, 140] },
{ type: "C", values: [413, 140, 438, 40, 302, 44] }
]
}
];
getPathDataTests.forEach(t => {
test(_ => {
path.setAttribute("d", t.input);
let pathData = path.getPathData();
checkPathData(pathData, t.output);
}, "Test path.getPathData() " + t.description)
});
let getNormalizedPathDataTests = [
{
description: "straight lines",
input: "M 0 0 H 100 V 100 H 0 Z",
output: [
{ type: "M", values: [0, 0] },
{ type: "L", values: [100, 0] },
{ type: "L", values: [100, 100] },
{ type: "L", values: [0, 100] },
{ type: "Z", values: [] }
]
},
{
description: "cubic",
input: "M 0 0 C 30,90 25,10 50,10 S 70,90 90,90",
output: [
{ type: "M", values: [0, 0] },
{ type: "C", values: [30, 90, 25, 10, 50, 10] },
{ type: "C", values: [75, 10, 70, 90, 90, 90] },
]
},
{
description: "quadratic",
input: "M 0 0 Q 30 30 30 60 t 30 0 30 0 30 0 30 0 30 0",
output: [
{ type: "M", values: [0, 0] },
{ type: "C", values: [20, 20, 30, 40, 30, 60] },
{ type: "C", values: [30, 80, 40, 80, 60, 60] },
{ type: "C", values: [80, 40, 90, 40, 90, 60] },
{ type: "C", values: [90, 80, 100, 80, 120, 60] },
{ type: "C", values: [140, 40, 150, 40, 150, 60] },
{ type: "C", values: [150, 80, 160, 80, 180, 60] },
]
},
{
description: "elliptical arc",
input: "M 6 10 A 10 10 10 0 0 15 10",
output: [
{ type: "M", values: [6, 10] },
{ type: "C", values: [8.83, 11.426, 12.169, 11.426, 15, 10] },
],
epsilon: 0.01,
},
];
getNormalizedPathDataTests.forEach(t => {
test(_ => {
path.setAttribute("d", t.input);
let pathData = path.getPathData({normalize: true});
checkPathData(pathData, t.output, t.epsilon);
}, "Test path.getPathData({normalize: true}) " + t.description)
});
let setPathDataTests = [
{
description: "lines",
input: [
{ type: "M", values: [0, 0] },
{ type: "L", values: [10, 10] },
{ type: "Z", values: [] }
],
output: "M 0 0 L 10 10 Z"
},
{
description: "empty",
input: [],
output: ""
},
];
setPathDataTests.forEach(t => {
test(_ => {
path.setAttribute("d", t.output);
let segments = path.getPathData();
path.removeAttribute("d");
path.setPathData(segments);
assert_equals(path.getAttribute("d"), t.output);
}, "Test path.setPathData()" + t.description);
});
]]></script>
</svg>