Add unit tests for fabric.loadSVGFromString.

This commit is contained in:
kangax 2011-08-04 20:48:25 -04:00
parent 044866cf44
commit 27999a327c
5 changed files with 74 additions and 22 deletions

View file

@ -614,6 +614,10 @@
if (objects.length === 1) {
canvas.add(objects[0]);
}
else {
canvas.add(new fabric.PathGroup(objects));
}
canvas.renderAll();
});
};

View file

@ -257,7 +257,26 @@
<input type="color" value="rgb(0,0,0)" id="drawing-color" size="15">
</div>
</li>
<li style="margin-top:10px">
<label for="svg-console">Load SVG:</label>
<textarea rows="15" cols="55" id="svg-console">
&lt;?xml version="1.0" standalone="no"?>
&lt;!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
&lt;svg width="100%" height="100%" version="1.1"
xmlns="http://www.w3.org/2000/svg">
&lt;rect width="300" height="100"
style="fill:rgb(0,0,255);stroke-width:1;stroke:rgb(0,0,0)"/>
&lt;/svg>
</textarea>
<button type="button" id="load-svg">Load</button>
</li>
<li style="margin-top:10px;">
<label for="canvas-console">Execute code:</label>
<textarea rows="15" cols="55" id="canvas-console">
@ -289,24 +308,6 @@ canvas.add(new fabric.Circle({
</textarea>
<button type="button" id="execute">Execute</button>
</li>
<li style="margin-top:10px">
<label for="svg-console">Load SVG:</label>
<textarea rows="15" cols="55" id="svg-console">
&lt;?xml version="1.0" standalone="no"?>
&lt;!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
&lt;svg width="100%" height="100%" version="1.1"
xmlns="http://www.w3.org/2000/svg">
&lt;rect width="300" height="100"
style="fill:rgb(0,0,255);stroke-width:1;stroke:rgb(0,0,0)"/>
&lt;/svg>
</textarea>
<button type="button" id="load-svg">Load</button>
</li>
</ul>
</div>
</div>

11
dist/all.js vendored
View file

@ -1767,7 +1767,7 @@ fabric.Observable = {
};
/**
* Takes url corresponding to an SVG document, and parses it to a set of objects
* Takes url corresponding to an SVG document, and parses it into a set of fabric objects
* @method loadSVGFromURL
* @param {String} url
* @param {Function} callback
@ -1799,8 +1799,6 @@ fabric.Observable = {
var doc = xml.documentElement;
if (!doc) return;
console.log(doc);
fabric.parseSVGDocument(doc, function (results, options) {
svgCache.set(url, {
objects: fabric.util.array.invoke(results, 'toObject'),
@ -1826,7 +1824,14 @@ fabric.Observable = {
return ({ objects: objects, options: options });
}
/**
* Takes string corresponding to an SVG document, and parses it into a set of fabric objects
* @method loadSVGFromString
* @param {String} string
* @param {Function} callback
*/
function loadSVGFromString(string, callback) {
string = string.trim();
var doc;
if (typeof DOMParser !== 'undefined') {
var parser = new DOMParser();

View file

@ -213,6 +213,7 @@
* @param {Function} callback
*/
function loadSVGFromString(string, callback) {
string = string.trim();
var doc;
if (typeof DOMParser !== 'undefined') {
var parser = new DOMParser();

View file

@ -282,4 +282,45 @@
equals('none', el.userSelect);
}
});
test('fabric.loadSVGFromURL', function() {
equal("function", typeof fabric.loadSVGFromURL);
});
var SVG_DOC_AS_STRING = '<?xml version="1.0"?>\
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">\
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">\
<polygon fill="red" stroke="blue" stroke-width="10" points="350, 75 379,161 469,161\
397,215 423,301 350,250 277,301 303,215 231,161 321,161" />\
</svg>';
asyncTest('fabric.loadSVGFromString', function() {
equal("function", typeof fabric.loadSVGFromString);
var loadedObjects = [ ];
fabric.loadSVGFromString(SVG_DOC_AS_STRING, function(objects) {
loadedObjects = objects;
});
setTimeout(function() {
ok(loadedObjects[0] instanceof fabric.Polygon);
equals('red', loadedObjects[0].fill);
start();
}, 1000);
});
asyncTest('fabric.loadSVGFromString with surrounding whitespace', function() {
var loadedObjects = [ ];
fabric.loadSVGFromString(' \n\n ' + SVG_DOC_AS_STRING + ' ', function(objects) {
loadedObjects = objects;
});
setTimeout(function() {
ok(loadedObjects[0] instanceof fabric.Polygon);
equals('red', loadedObjects[0] && loadedObjects[0].fill);
start();
}, 1000);
});
})();