From bafc28d3fc1020730cee2e38bd461f68fa03df1c Mon Sep 17 00:00:00 2001 From: Andrea Bogazzi Date: Tue, 29 May 2018 10:28:02 +0200 Subject: [PATCH] Svg import improvements (#4984) * test * svg-import-fixes * svg-import-fixes * ok done * adapted tests to new values --- src/parser.js | 29 +++++++++++++++++++++++++---- src/shapes/object.class.js | 2 +- src/shapes/text.class.js | 5 ++++- test/unit/activeselection.js | 2 +- test/unit/canvas.js | 6 +++--- test/unit/canvas_static.js | 10 +++++----- test/unit/circle.js | 2 +- test/unit/ellipse.js | 2 +- test/unit/group.js | 4 ++-- test/unit/image.js | 6 +++--- test/unit/image_filters.js | 2 +- test/unit/itext.js | 6 +++--- test/unit/line.js | 2 +- test/unit/object.js | 4 ++-- test/unit/path.js | 6 +++--- test/unit/polygon.js | 2 +- test/unit/polyline.js | 2 +- test/unit/rect.js | 12 ++++++------ test/unit/text.js | 10 +++++----- test/unit/text_to_svg.js | 10 +++++----- test/unit/textbox.js | 2 +- 21 files changed, 75 insertions(+), 51 deletions(-) diff --git a/src/parser.js b/src/parser.js index 5cf70afb..82edc8ab 100644 --- a/src/parser.js +++ b/src/parser.js @@ -542,7 +542,7 @@ || !(viewBoxAttr = viewBoxAttr.match(reViewBoxAttrValue))), missingDimAttr = (!widthAttr || !heightAttr || widthAttr === '100%' || heightAttr === '100%'), toBeParsed = missingViewBox && missingDimAttr, - parsedDim = { }, translateMatrix = ''; + parsedDim = { }, translateMatrix = '', widthDiff = 0, heightDiff = 0; parsedDim.width = 0; parsedDim.height = 0; @@ -578,7 +578,28 @@ preserveAspectRatio = fabric.util.parsePreserveAspectRatioAttribute(preserveAspectRatio); if (preserveAspectRatio.alignX !== 'none') { //translate all container for the effect of Mid, Min, Max - scaleY = scaleX = (scaleX > scaleY ? scaleY : scaleX); + if (preserveAspectRatio.meetOrSlice === 'meet') { + scaleY = scaleX = (scaleX > scaleY ? scaleY : scaleX); + // calculate additional translation to move the viewbox + } + if (preserveAspectRatio.meetOrSlice === 'slice') { + scaleY = scaleX = (scaleX > scaleY ? scaleX : scaleY); + // calculate additional translation to move the viewbox + } + widthDiff = parsedDim.width - viewBoxWidth * scaleX; + heightDiff = parsedDim.height - viewBoxHeight * scaleX; + if (preserveAspectRatio.alignX === 'Mid') { + widthDiff /= 2; + } + if (preserveAspectRatio.alignY === 'Mid') { + heightDiff /= 2; + } + if (preserveAspectRatio.alignX === 'Min') { + widthDiff = 0; + } + if (preserveAspectRatio.alignY === 'Min') { + heightDiff = 0; + } } if (scaleX === 1 && scaleY === 1 && minX === 0 && minY === 0 && x === 0 && y === 0) { @@ -593,8 +614,8 @@ ' 0' + ' 0 ' + scaleY + ' ' + - (minX * scaleX) + ' ' + - (minY * scaleY) + ') '; + (minX * scaleX + widthDiff) + ' ' + + (minY * scaleY + heightDiff) + ') '; if (element.nodeName === 'svg') { el = element.ownerDocument.createElement('g'); diff --git a/src/shapes/object.class.js b/src/shapes/object.class.js index 8fbd5087..1e069bcd 100644 --- a/src/shapes/object.class.js +++ b/src/shapes/object.class.js @@ -340,7 +340,7 @@ * @type Number * @default */ - strokeMiterLimit: 10, + strokeMiterLimit: 4, /** * Shadow object representing shadow of this shape diff --git a/src/shapes/text.class.js b/src/shapes/text.class.js index f5b082e5..19bf49de 100644 --- a/src/shapes/text.class.js +++ b/src/shapes/text.class.js @@ -1387,6 +1387,8 @@ } textContent = textContent.replace(/^\s+|\s+$|\n+/g, '').replace(/\s+/g, ' '); + var originalStrokeWidth = options.strokeWidth; + options.strokeWidth = 0; var text = new fabric.Text(textContent, options), textHeightScaleFactor = text.getScaledHeight() / text.height, @@ -1407,7 +1409,8 @@ } text.set({ left: text.left - offX, - top: text.top - (textHeight - text.fontSize * (0.18 + text._fontSizeFraction)) / text.lineHeight + top: text.top - (textHeight - text.fontSize * (0.07 + text._fontSizeFraction)) / text.lineHeight, + strokeWidth: typeof originalStrokeWidth !== 'undefined' ? originalStrokeWidth : 1, }); callback(text); }; diff --git a/test/unit/activeselection.js b/test/unit/activeselection.js index b8ca45a1..0257beda 100644 --- a/test/unit/activeselection.js +++ b/test/unit/activeselection.js @@ -67,7 +67,7 @@ 'strokeDashArray': null, 'strokeLineCap': 'butt', 'strokeLineJoin': 'miter', - 'strokeMiterLimit': 10, + 'strokeMiterLimit': 4, 'scaleX': 1, 'scaleY': 1, 'shadow': null, diff --git a/test/unit/canvas.js b/test/unit/canvas.js index 3401bd40..040b5c14 100644 --- a/test/unit/canvas.js +++ b/test/unit/canvas.js @@ -55,12 +55,12 @@ '13.99], ["z", null]]}'; var PATH_DATALESS_JSON = '{"version":"' + fabric.version + '","objects":[{"type":"path","version":"' + fabric.version + '","originX":"left","originY":"top","left":100,"top":100,"width":200,"height":200,"fill":"rgb(0,0,0)",' + - '"stroke":null,"strokeWidth":1,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":10,' + + '"stroke":null,"strokeWidth":1,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":4,' + '"scaleX":1,"scaleY":1,"angle":0,"flipX":false,"flipY":false,"opacity":1,' + '"shadow":null,"visible":true,"clipTo":null,"backgroundColor":"","fillRule":"nonzero","paintFirst":"fill","globalCompositeOperation":"source-over","transformMatrix":null,"skewX":0,"skewY":0,"sourcePath":"http://example.com/"}]}'; var RECT_JSON = '{"version":"' + fabric.version + '","objects":[{"type":"rect","version":"' + fabric.version + '","originX":"left","originY":"top","left":0,"top":0,"width":10,"height":10,"fill":"rgb(0,0,0)",' + - '"stroke":null,"strokeWidth":1,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":10,"scaleX":1,"scaleY":1,"angle":0,"flipX":false,"flipY":false,"opacity":1,' + + '"stroke":null,"strokeWidth":1,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":4,"scaleX":1,"scaleY":1,"angle":0,"flipX":false,"flipY":false,"opacity":1,' + '"shadow":null,' + '"visible":true,"clipTo":null,"backgroundColor":"","fillRule":"nonzero","paintFirst":"fill","globalCompositeOperation":"source-over","transformMatrix":null,"skewX":0,"skewY":0,"rx":0,"ry":0}],"background":"#ff5555","overlay":"rgba(0,0,0,0.2)"}'; @@ -1344,7 +1344,7 @@ QUnit.test('loadFromJSON with custom properties on Canvas with image', function(assert) { var done = assert.async(); - var JSON_STRING = '{"objects":[{"type":"image","originX":"left","originY":"top","left":13.6,"top":-1.4,"width":3000,"height":3351,"fill":"rgb(0,0,0)","stroke":null,"strokeWidth":0,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":10,"scaleX":0.05,"scaleY":0.05,"angle":0,"flipX":false,"flipY":false,"opacity":1,"shadow":null,"visible":true,"clipTo":null,"backgroundColor":"","fillRule":"nonzero","globalCompositeOperation":"source-over","transformMatrix":null,"skewX":0,"skewY":0,"src":"' + IMG_SRC + '","filters":[],"crossOrigin":""}],' + var JSON_STRING = '{"objects":[{"type":"image","originX":"left","originY":"top","left":13.6,"top":-1.4,"width":3000,"height":3351,"fill":"rgb(0,0,0)","stroke":null,"strokeWidth":0,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":4,"scaleX":0.05,"scaleY":0.05,"angle":0,"flipX":false,"flipY":false,"opacity":1,"shadow":null,"visible":true,"clipTo":null,"backgroundColor":"","fillRule":"nonzero","globalCompositeOperation":"source-over","transformMatrix":null,"skewX":0,"skewY":0,"src":"' + IMG_SRC + '","filters":[],"crossOrigin":""}],' + '"background":"green"}'; var serialized = JSON.parse(JSON_STRING); serialized.controlsAboveOverlay = true; diff --git a/test/unit/canvas_static.js b/test/unit/canvas_static.js index 70db1344..d55895da 100644 --- a/test/unit/canvas_static.js +++ b/test/unit/canvas_static.js @@ -41,17 +41,17 @@ '13.99], ["z", null]]}], "background": "#ff5555","overlay": "rgba(0,0,0,0.2)"}'; var PATH_DATALESS_JSON = '{"version":"' + fabric.version + '","objects":[{"type":"path","version":"' + fabric.version + '","originX":"left","originY":"top","left":100,"top":100,"width":200,"height":200,"fill":"rgb(0,0,0)",' + - '"stroke":null,"strokeWidth":1,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":10,' + + '"stroke":null,"strokeWidth":1,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":4,' + '"scaleX":1,"scaleY":1,"angle":0,"flipX":false,"flipY":false,"opacity":1,' + '"shadow":null,"visible":true,"clipTo":null,"backgroundColor":"","fillRule":"nonzero","paintFirst":"fill","globalCompositeOperation":"source-over","transformMatrix":null,"skewX":0,"skewY":0,"sourcePath":"http://example.com/"}]}'; var RECT_JSON = '{"version":"' + fabric.version + '","objects":[{"type":"rect","version":"' + fabric.version + '","originX":"left","originY":"top","left":0,"top":0,"width":10,"height":10,"fill":"rgb(0,0,0)",' + - '"stroke":null,"strokeWidth":1,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":10,' + + '"stroke":null,"strokeWidth":1,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":4,' + '"scaleX":1,"scaleY":1,"angle":0,"flipX":false,"flipY":false,"opacity":1,' + '"shadow":null,"visible":true,"clipTo":null,"backgroundColor":"","fillRule":"nonzero","paintFirst":"fill","globalCompositeOperation":"source-over","transformMatrix":null,"skewX":0,"skewY":0,"rx":0,"ry":0}],"background":"#ff5555","overlay":"rgba(0,0,0,0.2)"}'; var RECT_JSON_WITH_PADDING = '{"version":"' + fabric.version + '","objects":[{"type":"rect","version":"' + fabric.version + '","originX":"left","originY":"top","left":0,"top":0,"width":10,"height":20,"fill":"rgb(0,0,0)",' + - '"stroke":null,"strokeWidth":1,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":10,' + + '"stroke":null,"strokeWidth":1,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":4,' + '"scaleX":1,"scaleY":1,"angle":0,"flipX":false,"flipY":false,"opacity":1,' + '"shadow":null,"visible":true,"clipTo":null,"backgroundColor":"","fillRule":"nonzero","paintFirst":"fill","globalCompositeOperation":"source-over","transformMatrix":null,"skewX":0,"skewY":0,"rx":0,"ry":0,"padding":123,"foo":"bar"}]}'; @@ -84,7 +84,7 @@ 'strokeDashArray': null, 'strokeLineCap': 'butt', 'strokeLineJoin': 'miter', - 'strokeMiterLimit': 10, + 'strokeMiterLimit': 4, 'scaleX': 1, 'scaleY': 1, 'angle': 0, @@ -1150,7 +1150,7 @@ var done = assert.async(); var serialized = JSON.parse(PATH_JSON); serialized.background = 'green'; - serialized.backgroundImage = JSON.parse('{"type":"image","originX":"left","originY":"top","left":13.6,"top":-1.4,"width":3000,"height":3351,"fill":"rgb(0,0,0)","stroke":null,"strokeWidth":0,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":10,"scaleX":0.05,"scaleY":0.05,"angle":0,"flipX":false,"flipY":false,"opacity":1,"shadow":null,"visible":true,"clipTo":null,"backgroundColor":"","fillRule":"nonzero","globalCompositeOperation":"source-over","transformMatrix":null,"skewX":0,"skewY":0,"src":"' + IMG_SRC + '","filters":[],"crossOrigin":""}'); + serialized.backgroundImage = JSON.parse('{"type":"image","originX":"left","originY":"top","left":13.6,"top":-1.4,"width":3000,"height":3351,"fill":"rgb(0,0,0)","stroke":null,"strokeWidth":0,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":4,"scaleX":0.05,"scaleY":0.05,"angle":0,"flipX":false,"flipY":false,"opacity":1,"shadow":null,"visible":true,"clipTo":null,"backgroundColor":"","fillRule":"nonzero","globalCompositeOperation":"source-over","transformMatrix":null,"skewX":0,"skewY":0,"src":"' + IMG_SRC + '","filters":[],"crossOrigin":""}'); canvas.loadFromJSON(serialized, function() { assert.ok(!canvas.isEmpty(), 'canvas is not empty'); assert.equal(canvas.backgroundColor, 'green'); diff --git a/test/unit/circle.js b/test/unit/circle.js index a2ed574f..a6b9e593 100644 --- a/test/unit/circle.js +++ b/test/unit/circle.js @@ -100,7 +100,7 @@ 'strokeDashArray': null, 'strokeLineCap': 'butt', 'strokeLineJoin': 'miter', - 'strokeMiterLimit': 10, + 'strokeMiterLimit': 4, 'scaleX': 1, 'scaleY': 1, 'angle': 0, diff --git a/test/unit/ellipse.js b/test/unit/ellipse.js index 38cf9a0e..b57203f4 100644 --- a/test/unit/ellipse.js +++ b/test/unit/ellipse.js @@ -36,7 +36,7 @@ 'strokeDashArray': null, 'strokeLineCap': 'butt', 'strokeLineJoin': 'miter', - 'strokeMiterLimit': 10, + 'strokeMiterLimit': 4, 'scaleX': 1, 'scaleY': 1, 'angle': 0, diff --git a/test/unit/group.js b/test/unit/group.js index 165208c9..76a94f21 100644 --- a/test/unit/group.js +++ b/test/unit/group.js @@ -169,7 +169,7 @@ 'strokeDashArray': null, 'strokeLineCap': 'butt', 'strokeLineJoin': 'miter', - 'strokeMiterLimit': 10, + 'strokeMiterLimit': 4, 'scaleX': 1, 'scaleY': 1, 'shadow': null, @@ -414,7 +414,7 @@ var group = makeGroupWith2Objects(); assert.ok(typeof group.toSVG === 'function'); - var expectedSVG = '\n\t\n\t\n\n'; + var expectedSVG = '\n\t\n\t\n\n'; assert.equal(group.toSVG(), expectedSVG); }); diff --git a/test/unit/image.js b/test/unit/image.js index b6299389..c34c0ece 100644 --- a/test/unit/image.js +++ b/test/unit/image.js @@ -44,7 +44,7 @@ 'strokeDashArray': null, 'strokeLineCap': 'butt', 'strokeLineJoin': 'miter', - 'strokeMiterLimit': 10, + 'strokeMiterLimit': 4, 'scaleX': 1, 'scaleY': 1, 'angle': 0, @@ -232,7 +232,7 @@ image.width -= 2; image.height -= 2; fabric.Object.__uid = 1; - var expectedSVG = '\n\t\n\n\n\t\n\n'; + var expectedSVG = '\n\t\n\n\n\t\n\n'; assert.equal(image.toSVG(), expectedSVG); done(); }); @@ -261,7 +261,7 @@ var done = assert.async(); createImageObject(function(image) { assert.ok(typeof image.toSVG === 'function'); - var expectedSVG = '\n\t\n\n'; + var expectedSVG = '\n\t\n\n'; assert.equal(image.toSVG(), expectedSVG); done(); }); diff --git a/test/unit/image_filters.js b/test/unit/image_filters.js index d270da02..0265b5e5 100644 --- a/test/unit/image_filters.js +++ b/test/unit/image_filters.js @@ -31,7 +31,7 @@ // 'strokeDashArray': null, // 'strokeLineCap': 'butt', // 'strokeLineJoin': 'miter', - // 'strokeMiterLimit': 10, + // 'strokeMiterLimit': 4, // 'scaleX': 1, // 'scaleY': 1, // 'angle': 0, diff --git a/test/unit/itext.js b/test/unit/itext.js index 01e2f982..a06e5a80 100644 --- a/test/unit/itext.js +++ b/test/unit/itext.js @@ -22,7 +22,7 @@ 'strokeDashArray': null, 'strokeLineCap': 'butt', 'strokeLineJoin': 'miter', - 'strokeMiterLimit': 10, + 'strokeMiterLimit': 4, 'scaleX': 1, 'scaleY': 1, 'angle': 0, @@ -746,10 +746,10 @@ // }); // assert.equal(typeof iText.toSVG, 'function'); // if (fabric.isLikelyNode) { - // assert.equal(iText.toSVG(), '\t\n\t\t\n\t\t\tt\n\t\t\te\n\t\t\ts\n\t\t\tt\n\t\t\n\t\n'); + // assert.equal(iText.toSVG(), '\t\n\t\t\n\t\t\tt\n\t\t\te\n\t\t\ts\n\t\t\tt\n\t\t\n\t\n'); // } // else { - // assert.equal(iText.toSVG(), '\t\n\t\t\n\t\t\tt\n\t\t\te\n\t\t\ts\n\t\t\tt\n\t\t\n\t\n'); + // assert.equal(iText.toSVG(), '\t\n\t\t\n\t\t\tt\n\t\t\te\n\t\t\ts\n\t\t\tt\n\t\t\n\t\n'); // } // }); diff --git a/test/unit/line.js b/test/unit/line.js index a55e6c90..dda60283 100644 --- a/test/unit/line.js +++ b/test/unit/line.js @@ -15,7 +15,7 @@ 'strokeDashArray': null, 'strokeLineCap': 'butt', 'strokeLineJoin': 'miter', - 'strokeMiterLimit': 10, + 'strokeMiterLimit': 4, 'scaleX': 1, 'scaleY': 1, 'angle': 0, diff --git a/test/unit/object.js b/test/unit/object.js index d974f865..8caa1192 100644 --- a/test/unit/object.js +++ b/test/unit/object.js @@ -148,7 +148,7 @@ QUnit.test('toJSON', function(assert) { var emptyObjectJSON = '{"type":"object","version":"' + fabric.version + '","originX":"left","originY":"top","left":0,"top":0,"width":0,"height":0,"fill":"rgb(0,0,0)",' + - '"stroke":null,"strokeWidth":1,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":10,' + + '"stroke":null,"strokeWidth":1,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":4,' + '"scaleX":1,"scaleY":1,"angle":0,"flipX":false,"flipY":false,"opacity":1,' + '"shadow":null,"visible":true,"clipTo":null,"backgroundColor":"","fillRule":"nonzero","paintFirst":"fill","globalCompositeOperation":"source-over",' + '"transformMatrix":null,"skewX":0,"skewY":0}'; @@ -191,7 +191,7 @@ 'strokeDashArray': null, 'strokeLineCap': 'butt', 'strokeLineJoin': 'miter', - 'strokeMiterLimit': 10, + 'strokeMiterLimit': 4, 'scaleX': 1, 'scaleY': 1, 'angle': 0, diff --git a/test/unit/path.js b/test/unit/path.js index f574d3cd..c21ec004 100644 --- a/test/unit/path.js +++ b/test/unit/path.js @@ -15,7 +15,7 @@ 'strokeDashArray': null, 'strokeLineCap': 'butt', 'strokeLineJoin': 'miter', - 'strokeMiterLimit': 10, + 'strokeMiterLimit': 4, 'scaleX': 1, 'scaleY': 1, 'angle': 0, @@ -43,7 +43,7 @@ el.setAttribute('stroke-width', 1); el.setAttribute('stroke-linecap', 'butt'); el.setAttribute('stroke-linejoin', 'miter'); - el.setAttribute('stroke-miterlimit', 10); + el.setAttribute('stroke-miterlimit', 4); return el; } @@ -124,7 +124,7 @@ var done = assert.async(); makePathObject(function(path) { assert.ok(typeof path.toSVG === 'function'); - assert.deepEqual(path.toSVG(), '\n'); + assert.deepEqual(path.toSVG(), '\n'); done(); }); }); diff --git a/test/unit/polygon.js b/test/unit/polygon.js index 13058c4f..bc3c4bb6 100644 --- a/test/unit/polygon.js +++ b/test/unit/polygon.js @@ -22,7 +22,7 @@ 'strokeDashArray': null, 'strokeLineCap': 'butt', 'strokeLineJoin': 'miter', - 'strokeMiterLimit': 10, + 'strokeMiterLimit': 4, 'scaleX': 1, 'scaleY': 1, 'angle': 0, diff --git a/test/unit/polyline.js b/test/unit/polyline.js index d4f9bc1e..cd8e6d01 100644 --- a/test/unit/polyline.js +++ b/test/unit/polyline.js @@ -22,7 +22,7 @@ 'strokeDashArray': null, 'strokeLineCap': 'butt', 'strokeLineJoin': 'miter', - 'strokeMiterLimit': 10, + 'strokeMiterLimit': 4, 'scaleX': 1, 'scaleY': 1, 'angle': 0, diff --git a/test/unit/rect.js b/test/unit/rect.js index 6600ff99..eb6474e7 100644 --- a/test/unit/rect.js +++ b/test/unit/rect.js @@ -15,7 +15,7 @@ 'strokeDashArray': null, 'strokeLineCap': 'butt', 'strokeLineJoin': 'miter', - 'strokeMiterLimit': 10, + 'strokeMiterLimit': 4, 'scaleX': 1, 'scaleY': 1, 'angle': 0, @@ -172,31 +172,31 @@ var rect = new fabric.Rect({ width: 100, height: 100, rx: 20, ry: 30, strokeWidth: 0 }); var svg = rect.toSVG(); - assert.equal(svg, '\n'); + assert.equal(svg, '\n'); }); QUnit.test('toSVG with alpha colors fill', function(assert) { var rect = new fabric.Rect({ width: 100, height: 100, strokeWidth: 0, fill: 'rgba(255, 0, 0, 0.5)' }); var svg = rect.toSVG(); - assert.equal(svg, '\n'); + assert.equal(svg, '\n'); }); QUnit.test('toSVG with id', function(assert) { var rect = new fabric.Rect({id: 'myRect', width: 100, height: 100, strokeWidth: 0, fill: 'rgba(255, 0, 0, 0.5)' }); var svg = rect.toSVG(); - assert.equal(svg, '\n'); + assert.equal(svg, '\n'); }); QUnit.test('toSVG with alpha colors stroke', function(assert) { var rect = new fabric.Rect({ width: 100, height: 100, strokeWidth: 0, fill: '', stroke: 'rgba(255, 0, 0, 0.5)' }); var svg = rect.toSVG(); - assert.equal(svg, '\n'); + assert.equal(svg, '\n'); }); QUnit.test('toSVG with paintFirst set to stroke', function(assert) { var rect = new fabric.Rect({ width: 100, height: 100, paintFirst: 'stroke' }); var svg = rect.toSVG(); - assert.equal(svg, '\n'); + assert.equal(svg, '\n'); }); QUnit.test('toObject without default values', function(assert) { diff --git a/test/unit/text.js b/test/unit/text.js index fb72a46b..6d6140ba 100644 --- a/test/unit/text.js +++ b/test/unit/text.js @@ -23,7 +23,7 @@ 'strokeDashArray': null, 'strokeLineCap': 'butt', 'strokeLineJoin': 'miter', - 'strokeMiterLimit': 10, + 'strokeMiterLimit': 4, 'scaleX': 1, 'scaleY': 1, 'angle': 0, @@ -191,7 +191,7 @@ assert.ok(text instanceof fabric.Text); var expectedObject = fabric.util.object.extend(fabric.util.object.clone(REFERENCE_TEXT_OBJECT), { left: 0, - top: -14.59, + top: -14.05, width: 8, height: 18.08, fontSize: 16, @@ -233,7 +233,7 @@ var expectedObject = fabric.util.object.extend(fabric.util.object.clone(REFERENCE_TEXT_OBJECT), { /* left varies slightly due to node-canvas rendering */ left: fabric.util.toFixed(textWithAttrs.left + '', 2), - top: -82.43, + top: -88.03, width: CHAR_WIDTH, height: 138.99, fill: 'rgb(255,255,255)', @@ -598,11 +598,11 @@ }); fabric.Object.NUM_FRACTION_DIGITS = 1; var SVG_1 = iText.toSVG(); - // var SVG_1_EXPECTED = '\t\n\t\ttest foo bar-baz\n\t\n'; + // var SVG_1_EXPECTED = '\t\n\t\ttest foo bar-baz\n\t\n'; //assert.equal(SVG_1, SVG_1_EXPECTED, 'numbers have max 1 decimal'); fabric.Object.NUM_FRACTION_DIGITS = 3; var SVG_2 = iText.toSVG(); - // var SVG_2_EXPECTED = '\t\n\t\ttest foo bar-baz\n\t\n'; + // var SVG_2_EXPECTED = '\t\n\t\ttest foo bar-baz\n\t\n'; //assert.equal(SVG_2, SVG_2_EXPECTED, 'numbers have max 3 decimal'); assert.ok(SVG_2.length > SVG_1.length, 'SVG 2 has more decimal'); // put back to 2 or break all tests diff --git a/test/unit/text_to_svg.js b/test/unit/text_to_svg.js index 0a01aea9..590aa693 100644 --- a/test/unit/text_to_svg.js +++ b/test/unit/text_to_svg.js @@ -4,14 +4,14 @@ } QUnit.module('fabric.Text'); QUnit.test('toSVG', function(assert) { - var TEXT_SVG = '\t\n\t\tx\n\t\n'; + var TEXT_SVG = '\t\n\t\tx\n\t\n'; var text = new fabric.Text('x'); assert.equal(removeTranslate(text.toSVG()), removeTranslate(TEXT_SVG)); text.set('fontFamily', 'Arial'); assert.equal(removeTranslate(text.toSVG()), removeTranslate(TEXT_SVG.replace('font-family="Times New Roman"', 'font-family="Arial"'))); }); QUnit.test('toSVG justified', function(assert) { - var TEXT_SVG_JUSTIFIED = '\t\n\t\txxxxxxx y\n\t\n'; + var TEXT_SVG_JUSTIFIED = '\t\n\t\txxxxxxx y\n\t\n'; var text = new fabric.Text('xxxxxx\nx y', { textAlign: 'justify', }); @@ -19,13 +19,13 @@ assert.equal(removeTranslate(text.toSVG()), removeTranslate(TEXT_SVG_JUSTIFIED)); }); QUnit.test('toSVG with multiple spaces', function(assert) { - var TEXT_SVG_MULTIPLESPACES = '\t\n\t\tx y\n\t\n'; + var TEXT_SVG_MULTIPLESPACES = '\t\n\t\tx y\n\t\n'; var text = new fabric.Text('x y'); assert.equal(removeTranslate(text.toSVG()), removeTranslate(TEXT_SVG_MULTIPLESPACES)); }); QUnit.test('toSVG with deltaY', function(assert) { fabric.Object.NUM_FRACTION_DIGITS = 0; - var TEXT_SVG = '\t\n\t\txx\n\t\n'; + var TEXT_SVG = '\t\n\t\txx\n\t\n'; var text = new fabric.Text('xx', { styles: { 0: { @@ -41,7 +41,7 @@ }); QUnit.test('toSVG with font', function(assert) { - var TEXT_SVG_WITH_FONT = '\t\n\t\txxxxxxx y\n\t\n'; + var TEXT_SVG_WITH_FONT = '\t\n\t\txxxxxxx y\n\t\n'; var text = new fabric.Text('xxxxxx\nx y', { textAlign: 'justify', styles: {0: { diff --git a/test/unit/textbox.js b/test/unit/textbox.js index 77754da8..dddca473 100644 --- a/test/unit/textbox.js +++ b/test/unit/textbox.js @@ -21,7 +21,7 @@ strokeDashArray: null, strokeLineCap: 'butt', strokeLineJoin: 'miter', - strokeMiterLimit: 10, + strokeMiterLimit: 4, scaleX: 1, scaleY: 1, angle: 0,