- Linting (HTML): Use double-quotes for attributes, remove redundant type=text/css,
indent/lbs, consistent non-use of HTML namespace, consistent indents, consistent charset
casing
- Linting (Markdown): Add `.remarkrc`, use proper hierarchical headings, use consistent
heading format, trailing spaces
- `composer.json`: consistent property spacing
- License: Add `.txt` extension, update copyright date, and reflect type (MIT) in file name
- Credits: Add self
- npm: Add `package.json` (version 3.0.0-alpha.1 for npm release only; just reserving name)
This commit is contained in:
Brett Zamir
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>Unit Tests for SvgCanvas</title>
|
||||
<link rel="stylesheet" href="qunit/qunit.css" type="text/css"/>
|
||||
<link rel="stylesheet" href="qunit/qunit.css"/>
|
||||
<script src="../editor/jquery.js"></script>
|
||||
<script src="../editor/jquerybbq/jquery.bbq.min.js"></script>
|
||||
<script src="../editor/jquery-ui/jquery-ui-1.8.custom.min.js"></script>
|
||||
@@ -17,7 +17,7 @@
|
||||
<script src="../editor/svgutils.js"></script>
|
||||
<script src="../editor/sanitize.js"></script>
|
||||
<script src="../editor/history.js"></script>
|
||||
<script src='../editor/coords.js'></script>
|
||||
<script src="../editor/coords.js"></script>
|
||||
<script src="../editor/recalculate.js"></script>
|
||||
<script src="../editor/select.js"></script>
|
||||
<script src="../editor/draw.js"></script>
|
||||
@@ -74,9 +74,9 @@
|
||||
expect(1);
|
||||
equal(typeof {}, typeof svgCanvas);
|
||||
});
|
||||
|
||||
|
||||
module("Path Module");
|
||||
|
||||
|
||||
test("Test path conversion from absolute to relative", function() {
|
||||
expect(6);
|
||||
var convert = svgCanvas.pathActions.convertPath;
|
||||
@@ -85,22 +85,22 @@
|
||||
// "m400.00491,625.01379a1.78688,1.78688 0 1 1-3.57373,0a1.78688,1.78688 0 1 13.57373,0z"
|
||||
// "m36.812,15.8566c-28.03099,0 -26.28099,12.15601 -26.28099,12.15601l0.03099,12.59399h26.75v3.781h-37.37399c0,0 -17.938,-2.034 -133.00001,26.25c115.06201,28.284 130.71801,27.281 130.71801,27.281h9.34399v-13.125c0,0 -0.504,-15.656 15.40601,-15.656h26.532c0,0 14.90599,0.241 14.90599,-14.406v-24.219c0,0 2.263,-14.65601 -27.032,-14.65601zm-14.75,8.4684c2.662,0 4.813,2.151 4.813,4.813c0,2.661 -2.151,4.812 -4.813,4.812c-2.661,0 -4.812,-2.151 -4.812,-4.812c0,-2.662 2.151,-4.813 4.812,-4.813z"
|
||||
// "m 0,0 l 200,0 l 0,100 L 0,100"
|
||||
|
||||
|
||||
svgCanvas.setSvgString("<svg xmlns='http://www.w3.org/2000/svg' width='400' x='300'>" +
|
||||
"<path id='p1' d='M100,100 L200,100 L100,100Z'/>" +
|
||||
"<path id='p2' d='m 0,0 l 200,0 l 0,100 L 0,100'/>" +
|
||||
"</svg>");
|
||||
|
||||
|
||||
var p1 = document.getElementById("p1"),
|
||||
p2 = document.getElementById("p2"),
|
||||
d_abs = p1.getAttribute("d"),
|
||||
seglist = p1.pathSegList,
|
||||
curseg = null;
|
||||
|
||||
|
||||
equal(p1.nodeName, "path", "Expected 'path', got");
|
||||
|
||||
|
||||
equal(seglist.numberOfItems, 4, "Number of segments before conversion");
|
||||
|
||||
|
||||
// verify segments before conversion
|
||||
curseg = seglist.getItem(0);
|
||||
equal(curseg.pathSegTypeAsLetter.toUpperCase(), "M", "Before conversion, segment #1 type");
|
||||
@@ -108,54 +108,54 @@
|
||||
equal(curseg.pathSegTypeAsLetter.toUpperCase(), "L", "Before conversion, segment #2 type");
|
||||
curseg = seglist.getItem(3);
|
||||
equal(curseg.pathSegTypeAsLetter.toUpperCase(), "Z", "Before conversion, segment #3 type" + d_abs);
|
||||
|
||||
|
||||
// convert and verify segments
|
||||
var d = convert(p1, true);
|
||||
equal(d, "m100,100l100,0l-100,0z", "Converted path to relative string");
|
||||
|
||||
|
||||
// TODO: see why this isn't working in SVG-edit
|
||||
d = convert(p2, true);
|
||||
QUnit.log({result: d});
|
||||
d = convert(p2, false);
|
||||
QUnit.log({result: d});
|
||||
});
|
||||
|
||||
|
||||
module("Import Module");
|
||||
|
||||
|
||||
test("Test import use", function() {
|
||||
expect(3);
|
||||
|
||||
|
||||
svgCanvas.setSvgString("<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='400' x='300'>" +
|
||||
"<rect id='the-rect' width='200' height='200'/>" +
|
||||
"<use id='the-use' xlink:href='#the-rect'/>" +
|
||||
"<use id='foreign-use' xlink:href='somefile.svg#the-rect'/>" +
|
||||
"<use id='no-use'/>" +
|
||||
"</svg>");
|
||||
|
||||
|
||||
var u = document.getElementById("the-use"),
|
||||
fu = document.getElementById("foreign-use"),
|
||||
nfu = document.getElementById("no-use");
|
||||
|
||||
|
||||
equal((u && u.nodeName == "use"), true, "Did not import <use> element");
|
||||
equal(fu, null, "Removed <use> element that had a foreign href");
|
||||
equal(nfu, null, "Removed <use> element that had no href");
|
||||
});
|
||||
|
||||
|
||||
// This test shows that an element with an invalid attribute is still parsed in properly
|
||||
// and only the attribute is not imported
|
||||
test("Test invalid attribute", function() {
|
||||
expect(2);
|
||||
|
||||
|
||||
svgCanvas.setSvgString('<svg width="640" height="480" xmlns="http://www.w3.org/2000/svg">'+
|
||||
'<text x="182.75" y="173.5" id="the-text" fill="#008000" font-size="150" font-family="serif" text-anchor="middle" d="M116,222 L110,108">words</text>' +
|
||||
'</svg>');
|
||||
|
||||
|
||||
var t = document.getElementById("the-text");
|
||||
|
||||
|
||||
equal(true, (t && t.nodeName == "text"), "Did not import <text> element");
|
||||
equal(null, t.getAttribute("d"), "Imported a <text> with a d attribute");
|
||||
});
|
||||
|
||||
|
||||
// This test makes sure import/export properly handles namespaced attributes
|
||||
test("Test importing/exporting namespaced attributes", function() {
|
||||
expect(5);
|
||||
@@ -164,7 +164,7 @@
|
||||
'<polyline id="se_test_elem" se:foo="bar" foo:bar="baz"/>' +
|
||||
'</svg>');
|
||||
var attrVal = document.getElementById('se_test_elem').getAttributeNS("http://svg-edit.googlecode.com", "foo");
|
||||
|
||||
|
||||
equal(attrVal === "bar", true, "Preserved namespaced attribute on import");
|
||||
//
|
||||
//console.log('getSvgString' in svgCanvas)
|
||||
@@ -176,13 +176,13 @@
|
||||
var has_se = output.indexOf('xmlns:se=') !== -1;
|
||||
var has_foo = output.indexOf('xmlns:foo=') !== -1;
|
||||
var has_attr = output.indexOf('se:foo="bar"') !== -1;
|
||||
|
||||
|
||||
equal(has_attr, true, "Preserved namespaced attribute on export");
|
||||
equal(has_xlink, true, "Included xlink: xmlns");
|
||||
equal(has_se, true, "Included se: xmlns");
|
||||
equal(has_foo, false, "Did not include foo: xmlns");
|
||||
});
|
||||
|
||||
|
||||
test("Test import math elements inside a foreignObject", function() {
|
||||
expect(4);
|
||||
var set = svgCanvas.setSvgString('<svg width="640" height="480" xmlns="http://www.w3.org/2000/svg" xmlns:se="http://svg-edit.googlecode.com" xmlns:xlink="http://www.w3.org/1999/xlink">'+
|
||||
@@ -198,28 +198,28 @@
|
||||
// we cannot use getElementById('math') because not all browsers understand MathML and do not know to use the @id attribute
|
||||
// see Bug https://bugs.webkit.org/show_bug.cgi?id=35042
|
||||
var math = fo.firstChild;
|
||||
|
||||
|
||||
equal(!!math, true, "Math element exists");
|
||||
equal(math.nodeName, 'math', "Math element has the proper nodeName");
|
||||
equal(math.getAttribute('id'), 'm', "Math element has an id");
|
||||
equal(math.namespaceURI, "http://www.w3.org/1998/Math/MathML", "Preserved MathML namespace");
|
||||
});
|
||||
|
||||
|
||||
test("Test importing SVG into existing drawing", function() {
|
||||
expect(3);
|
||||
|
||||
|
||||
var doc = svgCanvas.setSvgString('<svg width="640" height="480" xmlns="http://www.w3.org/2000/svg">'+
|
||||
'<g><title>Layer 1</title>'+
|
||||
'<circle cx="200" cy="200" r="50" fill="blue"/>'+
|
||||
'<ellipse cx="300" cy="100" rx="40" ry="30" fill="green"/>'+
|
||||
'</g>'+
|
||||
'</svg>');
|
||||
|
||||
|
||||
svgCanvas.importSvgString('<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg">'+
|
||||
'<circle cx="50" cy="50" r="40" fill="yellow"/>'+
|
||||
'<rect width="20" height="20" fill="blue"/>'+
|
||||
'</svg>');
|
||||
|
||||
|
||||
var svgcontent = document.getElementById("svgcontent"),
|
||||
circles = svgcontent.getElementsByTagNameNS(svgns, "circle"),
|
||||
rects = svgcontent.getElementsByTagNameNS(svgns, "rect"),
|
||||
@@ -231,7 +231,7 @@
|
||||
|
||||
test("Test importing SVG remaps IDs", function() {
|
||||
expect(6);
|
||||
|
||||
|
||||
var doc = svgCanvas.setSvgString('<svg width="640" height="480" xmlns="http://www.w3.org/2000/svg">'+
|
||||
'<g><title>Layer 1</title>'+
|
||||
'<ellipse id="svg_1" cx="200" cy="200" rx="50" ry="20" fill="blue"/>'+
|
||||
@@ -239,7 +239,7 @@
|
||||
'<ellipse id="svg_3" cx="300" cy="100" rx="40" ry="30" fill="green"/>'+
|
||||
'</g>'+
|
||||
'</svg>');
|
||||
|
||||
|
||||
svgCanvas.importSvgString('<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg" xmlns:xl="http://www.w3.org/1999/xlink">'+
|
||||
'<defs>'+
|
||||
'<linearGradient id="svg_2">'+
|
||||
@@ -251,7 +251,7 @@
|
||||
'<circle id="svg_1" cx="50" cy="50" r="40" fill="url(#svg_2)"/>'+
|
||||
'<use id="svg_4" width="30" height="30" xl:href="#svg_3"/>'+
|
||||
'</svg>');
|
||||
|
||||
|
||||
var svgcontent = document.getElementById("svgcontent"),
|
||||
circles = svgcontent.getElementsByTagNameNS(svgns, "circle"),
|
||||
rects = svgcontent.getElementsByTagNameNS(svgns, "rect"),
|
||||
@@ -269,11 +269,11 @@
|
||||
notEqual(rects.item(0).getAttribute("stroke"), "url(#svg_2)", "Rectangle stroke value not remapped");
|
||||
notEqual(uses.item(0).getAttributeNS(xlinkns, "href"), "#svg_3");
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
</head>
|
||||
<body>
|
||||
<h1 id="qunit-header">Unit Tests for SvgCanvas</h1>
|
||||
<h2 id="qunit-banner"></h2>
|
||||
<h2 id="qunit-userAgent"></h2>
|
||||
@@ -285,5 +285,5 @@
|
||||
<div id="tools_left"></div>
|
||||
<div class="tools_flyout"></div>
|
||||
</div>
|
||||
</body>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user