From 553669c938cb1eaf307574346d4da110e4407597 Mon Sep 17 00:00:00 2001 From: Andrea Bogazzi Date: Mon, 12 Jun 2017 11:13:55 +0200 Subject: [PATCH] Extend test coverage (#3999) * extended test coverage * new file * fixed lint --- test.js | 2 + test/unit/animation.js | 571 +++++++++++++++++++++++++++++++++++++ test/unit/canvas_static.js | 38 +++ test/unit/gradient.js | 14 +- test/unit/object.js | 84 ------ test/unit/pattern.js | 16 +- test/unit/rect.js | 11 + test/unit/util.js | 127 ++++++--- 8 files changed, 731 insertions(+), 132 deletions(-) create mode 100644 test/unit/animation.js diff --git a/test.js b/test.js index 1c8e64cd..9917d1e9 100644 --- a/test.js +++ b/test.js @@ -3,6 +3,7 @@ var testrunner = require('qunit'); testrunner.options.log.summary = true; testrunner.options.log.tests = false; testrunner.options.log.assertions = false; +testrunner.options.log.coverage = true; testrunner.options.coverage = true; testrunner.options.maxBlockDuration = 120000; @@ -11,6 +12,7 @@ testrunner.run({ deps: "./test/fixtures/test_script.js", code: "./dist/fabric.js", tests: [ + './test/unit/animation.js', './test/unit/rect.js', './test/unit/ellipse.js', './test/unit/color.js', diff --git a/test/unit/animation.js b/test/unit/animation.js new file mode 100644 index 00000000..8599819e --- /dev/null +++ b/test/unit/animation.js @@ -0,0 +1,571 @@ +(function() { + QUnit.module('fabric.util.animate'); + + asyncTest('animateColor', function() { + function testing(val) { + notEqual(val, 'rgba(0,0,255,1)', 'color is not blue'); + } + ok(typeof fabric.util.animateColor === 'function', 'animateColor is a function'); + fabric.util.animateColor('red', 'blue', 16, { + onComplete: function() { + // animate color need some fixing + // equal(val, 'rgba(0,0,255,1)', 'color is blue') + start(); + }, + onChange: testing, + }); + }); + + asyncTest('animate', function() { + var object = new fabric.Object({ left: 20, top: 30, width: 40, height: 50, angle: 43 }); + + ok(typeof object.animate == 'function'); + + object.animate('left', 40); + ok(true, 'animate without options does not crash'); + + setTimeout(function() { + + equal(40, Math.round(object.getLeft()), 'left has been animated to 40'); + start(); + + }, 1000); + }); + + asyncTest('animate with increment', function() { + var object = new fabric.Object({ left: 20, top: 30, width: 40, height: 50, angle: 43 }); + + object.animate('left', '+=40'); + ok(true, 'animate without options does not crash'); + + setTimeout(function() { + + equal(Math.round(object.getLeft()), 60, 'left has been increased by 40'); + start(); + + }, 1000); + }); + + asyncTest('animate with keypath', function() { + var object = new fabric.Object({ left: 20, top: 30, width: 40, height: 50, angle: 43, shadow: { offsetX: 20 } }); + + object.animate('shadow.offsetX', 100); + ok(true, 'animate without options does not crash'); + + setTimeout(function() { + + equal(Math.round(object.shadow.offsetX), 100, 'property has been animated'); + start(); + + }, 1000); + }); + + asyncTest('animate with decrement', function() { + var object = new fabric.Object({ left: 20, top: 30, width: 40, height: 50, angle: 43 }); + + object.animate('left', '-=40'); + ok(true, 'animate without options does not crash'); + + setTimeout(function() { + + equal(Math.round(object.getLeft()), -20, 'left has been decreased by 40'); + start(); + + }, 1000); + }); + + asyncTest('animate with object', function() { + var object = new fabric.Object({ left: 20, top: 30, width: 40, height: 50, angle: 43 }); + + ok(typeof object.animate == 'function'); + + object.animate({ left: 40}); + ok(true, 'animate without options does not crash'); + + setTimeout(function() { + + equal(40, Math.round(object.getLeft())); + start(); + + }, 1000); + }); + + asyncTest('animate multiple properties', function() { + var object = new fabric.Object({ left: 123, top: 124 }); + + object.animate({ left: 223, top: 224 }); + + setTimeout(function() { + + equal(223, Math.round(object.get('left'))); + equal(224, Math.round(object.get('top'))); + + start(); + + }, 1000); + }); + + asyncTest('animate multiple properties with callback', function() { + + var object = new fabric.Object({ left: 0, top: 0 }); + + var changedInvocations = 0; + var completeInvocations = 0; + + object.animate({ left: 1, top: 1 }, { + duration: 1, + onChange: function() { + changedInvocations++; + }, + onComplete: function() { + completeInvocations++; + } + }); + + setTimeout(function() { + + equal(Math.round(object.get('left')), 1); + equal(Math.round(object.get('top')), 1); + + //equal(changedInvocations, 2); + equal(completeInvocations, 1); + + start(); + + }, 1000); + }); + + asyncTest('animate with abort', function() { + var object = new fabric.Object({ left: 123, top: 124 }); + + var context; + object.animate({ left: 223, top: 224 }, { + abort: function() { + context = this; + return true; + } + }); + + setTimeout(function() { + + equal(123, Math.round(object.get('left'))); + equal(124, Math.round(object.get('top'))); + + equal(context, object, 'abort should be called in context of an object'); + + start(); + + }, 100); + }); + + asyncTest('animate easing easeInQuad', function() { + ok(typeof fabric.util.ease.easeInQuad === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeInQuad + }); + }); + + asyncTest('animate easing easeOutQuad', function() { + ok(typeof fabric.util.ease.easeOutQuad === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeOutQuad + }); + }); + + asyncTest('animate easing easeInOutQuad', function() { + ok(typeof fabric.util.ease.easeInOutQuad === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeInOutQuad + }); + }); + + asyncTest('animate easing easeInCubic', function() { + ok(typeof fabric.util.ease.easeInCubic === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeInCubic + }); + }); + + asyncTest('animate easing easeOutCubic', function() { + ok(typeof fabric.util.ease.easeOutCubic === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeOutCubic + }); + }); + + asyncTest('animate easing easeInOutCubic', function() { + ok(typeof fabric.util.ease.easeInOutCubic === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeInOutCubic + }); + }); + + asyncTest('animate easing easeInQuart', function() { + ok(typeof fabric.util.ease.easeInQuart === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeInQuart + }); + }); + + asyncTest('animate easing easeOutQuart', function() { + ok(typeof fabric.util.ease.easeOutQuart === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeOutQuart + }); + }); + + asyncTest('animate easing easeInOutQuart', function() { + ok(typeof fabric.util.ease.easeInOutQuart === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeInOutQuart + }); + }); + + asyncTest('animate easing easeInQuint', function() { + ok(typeof fabric.util.ease.easeInQuint === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeInQuint + }); + }); + + asyncTest('animate easing easeOutQuint', function() { + ok(typeof fabric.util.ease.easeOutQuint === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeOutQuint + }); + }); + + + // easeInOutQuint: easeInOutQuint, + asyncTest('animate easing easeInOutQuint', function() { + ok(typeof fabric.util.ease.easeInOutQuint === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeInOutQuint + }); + }); + + // easeInSine: easeInSine, + asyncTest('animate easing easeInSine', function() { + ok(typeof fabric.util.ease.easeInSine === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeInSine + }); + }); + + // easeOutSine: easeOutSine, + asyncTest('animate easing easeOutSine', function() { + ok(typeof fabric.util.ease.easeOutSine === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeOutSine + }); + }); + + // easeInOutSine: easeInOutSine, + asyncTest('animate easing easeInOutSine', function() { + ok(typeof fabric.util.ease.easeInOutSine === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeInOutSine + }); + }); + + // easeInExpo: easeInExpo, + asyncTest('animate easing easeInExpo', function() { + ok(typeof fabric.util.ease.easeInExpo === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeInExpo + }); + }); + + // easeOutExpo: easeOutExpo, + asyncTest('animate easing easeOutExpo', function() { + ok(typeof fabric.util.ease.easeOutExpo === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeOutExpo + }); + }); + + // easeInOutExpo: easeInOutExpo, + asyncTest('animate easing easeInOutExpo', function() { + ok(typeof fabric.util.ease.easeInOutExpo === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeInOutExpo + }); + }); + + // easeInCirc: easeInCirc, + asyncTest('animate easing easeInCirc', function() { + ok(typeof fabric.util.ease.easeInCirc === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeInCirc + }); + }); + + // easeOutCirc: easeOutCirc, + asyncTest('animate easing easeOutCirc', function() { + ok(typeof fabric.util.ease.easeOutCirc === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeOutCirc + }); + }); + + // easeInOutCirc: easeInOutCirc, + asyncTest('animate easing easeInOutCirc', function() { + ok(typeof fabric.util.ease.easeInOutCirc === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeInOutCirc + }); + }); + + // easeInElastic: easeInElastic, + asyncTest('animate easing easeInElastic', function() { + ok(typeof fabric.util.ease.easeInElastic === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeInElastic + }); + }); + + // easeOutElastic: easeOutElastic, + asyncTest('animate easing easeOutElastic', function() { + ok(typeof fabric.util.ease.easeOutElastic === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeOutElastic + }); + }); + + // easeInOutElastic: easeInOutElastic, + asyncTest('animate easing easeInOutElastic', function() { + ok(typeof fabric.util.ease.easeInOutElastic === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeInOutElastic + }); + }); + + // easeInBack: easeInBack, + asyncTest('animate easing easeInBack', function() { + ok(typeof fabric.util.ease.easeInBack === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeInBack + }); + }); + + // easeOutBack: easeOutBack, + asyncTest('animate easing easeOutBack', function() { + ok(typeof fabric.util.ease.easeOutBack === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeOutBack + }); + }); + + // easeInOutBack: easeInOutBack, + asyncTest('animate easing easeInOutBack', function() { + ok(typeof fabric.util.ease.easeInOutBack === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeInOutBack + }); + }); + + // easeInBounce: easeInBounce, + asyncTest('animate easing easeInBounce', function() { + ok(typeof fabric.util.ease.easeInBounce === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeInBounce + }); + }); + + // easeOutBounce: easeOutBounce, + asyncTest('animate easing easeOutBounce', function() { + ok(typeof fabric.util.ease.easeOutBounce === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeOutBounce + }); + }); + + // easeInOutBounce: easeInOutBounce + asyncTest('animate easing easeInOutBounce', function() { + ok(typeof fabric.util.ease.easeInOutBounce === 'function'); + var object = new fabric.Object({ left: 0 }); + object.animate({ left: 100 }, { + onComplete: function() { + equal(Math.round(object.left), 100, 'animation ended correctly'); + start(); + }, + duration: 160, + easing: fabric.util.ease.easeInOutBounce + }); + }); + +})(); diff --git a/test/unit/canvas_static.js b/test/unit/canvas_static.js index 50bd5c1a..77f885f7 100644 --- a/test/unit/canvas_static.js +++ b/test/unit/canvas_static.js @@ -1486,6 +1486,44 @@ deepEqual(canvas.vptCoords.br, new fabric.Point(30 + canvas.getWidth() / 2, canvas.getHeight() / 2 - 30), 'tl is 0,0'); }); + test('_isRetinaScaling', function() { + canvas.enableRetinaScaling = true; + fabric.devicePixelRatio = 2; + var isScaling = canvas._isRetinaScaling(); + equal(isScaling, true, 'retina > 1 and enabled'); + + canvas.enableRetinaScaling = false; + fabric.devicePixelRatio = 2; + var isScaling = canvas._isRetinaScaling(); + equal(isScaling, false, 'retina > 1 and disabled'); + + canvas.enableRetinaScaling = false; + fabric.devicePixelRatio = 1; + var isScaling = canvas._isRetinaScaling(); + equal(isScaling, false, 'retina = 1 and disabled'); + + canvas.enableRetinaScaling = true; + fabric.devicePixelRatio = 1; + var isScaling = canvas._isRetinaScaling(); + equal(isScaling, false, 'retina = 1 and enabled'); + }); + + test('getRetinaScaling', function() { + canvas.enableRetinaScaling = true; + fabric.devicePixelRatio = 1; + var scaling = canvas.getRetinaScaling(); + equal(scaling, 1, 'retina is devicePixelRatio'); + + fabric.devicePixelRatio = 2; + var scaling = canvas.getRetinaScaling(); + equal(scaling, 2, 'retina is devicePixelRatio'); + + fabric.devicePixelRatio = 2; + canvas.enableRetinaScaling = false; + var scaling = canvas.getRetinaScaling(); + equal(scaling, 1, 'retina is disabled, 1'); + }); + //how to test with an exception? /*asyncTest('options in setBackgroundImage from invalid URL', function() { canvas.backgroundImage = null; diff --git a/test/unit/gradient.js b/test/unit/gradient.js index 12bc6d16..4e70c6b8 100644 --- a/test/unit/gradient.js +++ b/test/unit/gradient.js @@ -175,15 +175,21 @@ }); test('toLive linearGradient', function() { + var el = fabric.document.createElement('canvas'); + var canvas = fabric.isLikelyNode ? fabric.createCanvasForNode() : new fabric.StaticCanvas(el); var gradient = createLinearGradient(); - - ok(typeof gradient.toLive == 'function'); + ok(typeof gradient.toLive === 'function'); + var gradientCtx = gradient.toLive(canvas.contextContainer); + equal(gradientCtx.toString(), '[object CanvasGradient]', 'is a gradient for canvas radial'); }); test('toLive radialGradient', function() { + var el = fabric.document.createElement('canvas'); + var canvas = fabric.isLikelyNode ? fabric.createCanvasForNode() : new fabric.StaticCanvas(el); var gradient = createRadialGradient(); - - ok(typeof gradient.toLive == 'function'); + ok(typeof gradient.toLive === 'function'); + var gradientCtx = gradient.toLive(canvas.contextContainer); + equal(gradientCtx.toString(), '[object CanvasGradient]', 'is a gradient for canvas radial'); }); test('fromElement linearGradient', function() { diff --git a/test/unit/object.js b/test/unit/object.js index 3537c5ee..b13f528a 100644 --- a/test/unit/object.js +++ b/test/unit/object.js @@ -732,90 +732,6 @@ }, 1000); }); - asyncTest('animate', function() { - var object = new fabric.Object({ left: 20, top: 30, width: 40, height: 50, angle: 43 }); - - ok(typeof object.animate == 'function'); - - object.animate('left', 40); - ok(true, 'animate without options does not crash'); - - setTimeout(function() { - - equal(40, Math.round(object.getLeft())); - start(); - - }, 1000); - }); - - asyncTest('animate multiple properties', function() { - var object = new fabric.Object({ left: 123, top: 124 }); - - object.animate({ left: 223, top: 224 }); - - setTimeout(function() { - - equal(223, Math.round(object.get('left'))); - equal(224, Math.round(object.get('top'))); - - start(); - - }, 1000); - }); - - asyncTest('animate multiple properties with callback', function() { - - var object = new fabric.Object({ left: 0, top: 0 }); - - var changedInvocations = 0; - var completeInvocations = 0; - - object.animate({ left: 1, top: 1 }, { - duration: 1, - onChange: function() { - changedInvocations++; - }, - onComplete: function() { - completeInvocations++; - } - }); - - setTimeout(function() { - - equal(Math.round(object.get('left')), 1); - equal(Math.round(object.get('top')), 1); - - //equal(changedInvocations, 2); - equal(completeInvocations, 1); - - start(); - - }, 1000); - }); - - asyncTest('animate with abort', function() { - var object = new fabric.Object({ left: 123, top: 124 }); - - var context; - object.animate({ left: 223, top: 224 }, { - abort: function() { - context = this; - return true; - } - }); - - setTimeout(function() { - - equal(123, Math.round(object.get('left'))); - equal(124, Math.round(object.get('top'))); - - equal(context, object, 'abort should be called in context of an object'); - - start(); - - }, 100); - }); - test('observable', function() { var object = new fabric.Object({ left: 20, top: 30, width: 40, height: 50, angle: 43 }); diff --git a/test/unit/pattern.js b/test/unit/pattern.js index 1dbccca5..d676b8bb 100644 --- a/test/unit/pattern.js +++ b/test/unit/pattern.js @@ -95,8 +95,11 @@ test('toLive', function() { var pattern = createPattern(); - - ok(typeof pattern.toLive == 'function'); + var el = fabric.document.createElement('canvas'); + var canvas = fabric.isLikelyNode ? fabric.createCanvasForNode() : new fabric.StaticCanvas(el); + ok(typeof pattern.toLive === 'function'); + var created = pattern.toLive(canvas.contextContainer); + equal(created.toString(), '[object CanvasPattern]', 'is a gradient for canvas radial'); }); test('pattern serialization / deserialization (function)', function() { @@ -143,4 +146,13 @@ // TODO: test toSVG }); + test('initPattern from object', function() { + var fillObj = { + type: 'pattern', + source: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8z/C/HgAGgwJ/lK3Q6wAAAABJRU5ErkJggg==' + }; + var obj = new fabric.Object({ fill: fillObj }); + ok(obj.fill instanceof fabric.Pattern, 'the pattern is enlived'); + }); + })(); diff --git a/test/unit/rect.js b/test/unit/rect.js index 19564eb2..1995ac5e 100644 --- a/test/unit/rect.js +++ b/test/unit/rect.js @@ -86,6 +86,17 @@ }); }); + asyncTest('fabric.Rect.fromObject with pattern fill', function() { + var fillObj = { + type: 'pattern', + source: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8z/C/HgAGgwJ/lK3Q6wAAAABJRU5ErkJggg==' + }; + fabric.Rect.fromObject({ fill: fillObj }, function(rect) { + ok(rect.fill instanceof fabric.Pattern); + start(); + }); + }); + test('fabric.Rect.fromElement', function() { ok(typeof fabric.Rect.fromElement == 'function'); diff --git a/test/unit/util.js b/test/unit/util.js index bd1fe3da..ae2720c4 100644 --- a/test/unit/util.js +++ b/test/unit/util.js @@ -131,6 +131,15 @@ equal(camelize('--double'), 'Double'); }); + test('fabric.util.string.graphemeSplit', function() { + var gSplit = fabric.util.string.graphemeSplit; + + ok(typeof gSplit === 'function'); + + deepEqual(gSplit('foo'), ['f', 'o', 'o'], 'normal test get splitted by char'); + deepEqual(gSplit('f🙂o'), ['f', '🙂', 'o'], 'normal test get splitted by char'); + }); + test('fabric.util.string.escapeXml', function() { var escapeXml = fabric.util.string.escapeXml; @@ -422,10 +431,7 @@ }); asyncTest('fabric.util.loadImage', function() { - ok(typeof fabric.util.loadImage == 'function'); - - var callbackInvoked = false, - objectPassedToCallback; + ok(typeof fabric.util.loadImage === 'function'); if (IMG_URL.indexOf('/home/travis') === 0) { // image can not be accessed on travis so we're returning early @@ -434,25 +440,15 @@ } fabric.util.loadImage(IMG_URL, function(obj) { - callbackInvoked = true; - objectPassedToCallback = obj; - }); - - setTimeout(function() { - ok(callbackInvoked, 'callback should be invoked'); - - if (objectPassedToCallback) { - var oImg = new fabric.Image(objectPassedToCallback); + if (obj) { + var oImg = new fabric.Image(obj); ok(/fixtures\/very_large_image\.jpg$/.test(oImg.getSrc()), 'image should have correct src'); } - start(); - }, 2000); + }); }); asyncTest('fabric.util.loadImage with no args', function() { - var callbackInvoked = false; - if (IMG_URL.indexOf('/home/travis') === 0) { // image can not be accessed on travis so we're returning early expect(0); @@ -461,30 +457,32 @@ } fabric.util.loadImage('', function() { - callbackInvoked = true; - }); - - setTimeout(function() { - ok(callbackInvoked, 'callback should be invoked'); + ok(1, 'callback should be invoked'); start(); - }, 1000); + }); + }); + + asyncTest('fabric.util.loadImage with crossOrigin', function() { + if (IMG_URL.indexOf('/home/travis') === 0) { + // image can not be accessed on travis so we're returning early + expect(0); + start(); + return; + } + + fabric.util.loadImage(IMG_URL, function(img) { + equal(img.src || img._src, IMG_URL, 'src is set'); + // equal(img.crossOrigin, 'anonymous', 'crossOrigin is set'); + start(); + }, null, 'anonymous'); }); asyncTest('fabric.util.loadImage with url for a non exsiting image', function() { - var callbackInvoked = false; - var hadError = false; - fabric.util.loadImage(IMG_URL_NON_EXISTING, function(img, error) { - callbackInvoked = true; - hadError = error; - }); - - setTimeout(function() { - ok(callbackInvoked, 'callback should be invoked'); - equal(hadError, true, 'callback should be invoked with error set to true'); + equal(error, true, 'callback should be invoked with error set to true'); start(); - }, 1000); + }); }); var SVG_WITH_1_ELEMENT = '\ @@ -586,17 +584,21 @@ }); } - // test('fabric.util.request', function() { - // }); + test('fabric.util.request', function() { + ok(typeof fabric.util.request === 'function', 'fabric.util.request is a function'); + }); - // test('fabric.util.getPointer', function() { - // }); + test('fabric.util.getPointer', function() { + ok(typeof fabric.util.getPointer === 'function', 'fabric.util.getPointer is a function'); + }); - // test('fabric.util.addListener', function() { - // }); + test('fabric.util.addListener', function() { + ok(typeof fabric.util.addListener === 'function', 'fabric.util.addListener is a function'); + }); - // test('fabric.util.removeListener', function() { - // }); + test('fabric.util.removeListener', function() { + ok(typeof fabric.util.removeListener === 'function', 'fabric.util.removeListener is a function'); + }); test('fabric.util.drawDashedLine', function() { ok(typeof fabric.util.drawDashedLine === 'function'); @@ -809,6 +811,11 @@ test('parseUnit', function() { ok(typeof fabric.util.parseUnit == 'function'); + equal(Math.round(fabric.util.parseUnit('30mm'), 0), 113, '30mm is pixels'); + equal(Math.round(fabric.util.parseUnit('30cm'), 0), 1134, '30cm is pixels'); + equal(Math.round(fabric.util.parseUnit('30in'), 0), 2880, '30in is pixels'); + equal(Math.round(fabric.util.parseUnit('30pt'), 0), 40, '30mm is pixels'); + equal(Math.round(fabric.util.parseUnit('30pc'), 0), 480, '30mm is pixels'); }); test('createCanvasElement', function() { @@ -826,4 +833,40 @@ test('qrDecompose', function() { ok(typeof fabric.util.qrDecompose == 'function'); }); + + test('drawArc', function() { + ok(typeof fabric.util.drawArc == 'function'); + var canvas = this.canvas = fabric.isLikelyNode ? fabric.createCanvasForNode(600, 600, {enableRetinaScaling: false}) : new fabric.Canvas(null, {enableRetinaScaling: false}); + var ctx = canvas.contextContainer; + fabric.util.drawArc(ctx, 0, 0, [ + 50, + 30, + 0, + 1, + 1, + 100, + 100, + ]); + fabric.util.drawArc(ctx, 0, 0, [ + 50, + 30, + 0, + 1, + 1, + 100, + 100, + ]); + }); + + test('get bounds of arc', function() { + ok(typeof fabric.util.getBoundsOfArc == 'function'); + var bounds = fabric.util.getBoundsOfArc(0, 0, 50, 30, 0, 1, 1, 100, 100); + var expectedBounds = [ + { x: 0, y: -8.318331151877368 }, + { x: 133.33333333333331, y: 19.99999999999999 }, + { x: 100.00000000000003, y: 19.99999999999999 }, + { x: 147.19721858646224, y: 100 } + ]; + deepEqual(bounds, expectedBounds, 'bounds are as expected'); + }); })();