From dea22aca702dd138c8f2e5c77457dd1b20c4016a Mon Sep 17 00:00:00 2001 From: Andrea Bogazzi Date: Sun, 4 Feb 2018 22:42:32 +0100 Subject: [PATCH] Fixes (#4674) * default no retina for dataurl * make num_fraction_digits variable * restored aborted changes * mispelled param * added test for SVG * added test for toDataUrl * how it could even run * simpler test * i hope they will pass now * fed up * completely cheating * fallback on dumb test * test also this * test also this * more tests --- src/mixins/canvas_dataurl_exporter.mixin.js | 5 +- src/mixins/itext.svg_export.js | 7 +- src/mixins/object.svg_export.js | 5 +- src/shapes/object.class.js | 2 +- src/shapes/polyline.class.js | 6 +- test/unit/canvas_static.js | 32 +++++- test/unit/text.js | 102 ++++++++++++++++++++ 7 files changed, 146 insertions(+), 13 deletions(-) diff --git a/src/mixins/canvas_dataurl_exporter.mixin.js b/src/mixins/canvas_dataurl_exporter.mixin.js index 6774ccce..b74b29db 100644 --- a/src/mixins/canvas_dataurl_exporter.mixin.js +++ b/src/mixins/canvas_dataurl_exporter.mixin.js @@ -9,11 +9,12 @@ * @param {Object} [options] Options object * @param {String} [options.format=png] The format of the output image. Either "jpeg" or "png" * @param {Number} [options.quality=1] Quality level (0..1). Only used for jpeg. - * @param {Number} [options.multiplier=1] Multiplier to scale by + * @param {Number} [options.multiplier=1] Multiplier to scale by, to have consistent * @param {Number} [options.left] Cropping left offset. Introduced in v1.2.14 * @param {Number} [options.top] Cropping top offset. Introduced in v1.2.14 * @param {Number} [options.width] Cropping width. Introduced in v1.2.14 * @param {Number} [options.height] Cropping height. Introduced in v1.2.14 + * @param {Boolean} [options.enableRetinaScaling] Enable retina scaling for clone image. Introduce in 2.0.0 * @return {String} Returns a data: URL containing a representation of the object in the format specified by options.format * @see {@link http://jsfiddle.net/fabricjs/NfZVb/|jsFiddle demo} * @example Generate jpeg dataURL with lower quality @@ -40,7 +41,7 @@ var format = options.format || 'png', quality = options.quality || 1, - multiplier = options.multiplier || 1, + multiplier = options.multiplier || options.enableRetinaScaling ? 1 : 1 / this.getRetinaScaling(), cropping = { left: options.left || 0, top: options.top || 0, diff --git a/src/mixins/itext.svg_export.js b/src/mixins/itext.svg_export.js index d17910c8..c0eee030 100644 --- a/src/mixins/itext.svg_export.js +++ b/src/mixins/itext.svg_export.js @@ -1,7 +1,6 @@ /* _TO_SVG_START_ */ (function() { - var toFixed = fabric.util.toFixed, - NUM_FRACTION_DIGITS = fabric.Object.NUM_FRACTION_DIGITS; + var toFixed = fabric.util.toFixed; fabric.util.object.extend(fabric.Text.prototype, /** @lends fabric.Text.prototype */ { @@ -88,7 +87,8 @@ */ _createTextCharSpan: function(_char, styleDecl, left, top) { var styleProps = this.getSvgSpanStyles(styleDecl, _char !== _char.trim()), - fillStyles = styleProps ? 'style="' + styleProps + '"' : ''; + fillStyles = styleProps ? 'style="' + styleProps + '"' : '', + NUM_FRACTION_DIGITS = fabric.Object.NUM_FRACTION_DIGITS; return [ ' SVG_1.length, 'SVG 2 has more decimal'); + // put back to 2 or break all tests + fabric.Object.NUM_FRACTION_DIGITS = 2; + }); + + QUnit.test('getSvgSpanStyles produces correct output', function(assert) { + var iText = new fabric.IText('test foo bar-baz'); + var styleObject = { + fill: 'red', + strokeWidth: 30, + fontFamily: 'Verdana', + fontSize: 25, + }; + var styleString = iText.getSvgSpanStyles(styleObject); + var expected = 'stroke-width: 30; font-family: Verdana; font-size: 25px; fill: rgb(255,0,0); '; + assert.equal(styleString, expected, 'style is as expected'); + }); + QUnit.test('getSvgSpanStyles produces correct output with useWhiteSpace', function(assert) { + var iText = new fabric.IText('test foo bar-baz'); + var styleObject = { + fill: 'red', + strokeWidth: 30, + fontFamily: 'Verdana', + fontSize: 25, + }; + var styleString = iText.getSvgSpanStyles(styleObject, true); + var expected = 'stroke-width: 30; font-family: Verdana; font-size: 25px; fill: rgb(255,0,0); white-space: pre; '; + assert.equal(styleString, expected, 'style is as expected'); + }); + QUnit.test('getSvgTextDecoration with overline true produces correct output', function(assert){ + var iText = new fabric.IText('test foo bar-baz'); + var styleObject = { + overline: true, + }; + var styleString = iText.getSvgTextDecoration(styleObject); + var expected = 'overline '; + assert.equal(styleString, expected, 'style is as expected'); + }); + QUnit.test('getSvgTextDecoration with overline underline true produces correct output', function(assert){ + var iText = new fabric.IText('test foo bar-baz'); + var styleObject = { + overline: true, + underline: true, + }; + var styleString = iText.getSvgTextDecoration(styleObject); + var expected = 'overline underline '; + assert.equal(styleString, expected, 'style is as expected with overline underline'); + }); + QUnit.test('getSvgTextDecoration with overline underline true produces correct output', function(assert){ + var iText = new fabric.IText('test foo bar-baz'); + var styleObject = { + overline: true, + underline: true, + linethrough: true, + }; + var styleString = iText.getSvgTextDecoration(styleObject); + var expected = 'overline underline line-through '; + assert.equal(styleString, expected, 'style is as expected with overline underline'); + }); + QUnit.test('getSvgTextDecoration with overline underline true produces correct output', function(assert){ + var iText = new fabric.IText('test foo bar-baz'); + var styleObject = { + overline: true, + underline: true, + linethrough: true, + }; + var styleString = iText.getSvgTextDecoration(styleObject); + var expected = 'overline underline line-through '; + assert.equal(styleString, expected, 'style is as expected with overline underline'); + }); })();