diff --git a/src/pattern.class.js b/src/pattern.class.js index a5d99971c33..4103f56212f 100644 --- a/src/pattern.class.js +++ b/src/pattern.class.js @@ -133,9 +133,16 @@ patternImgSrc = ''; if (this.repeat === 'repeat-x' || this.repeat === 'no-repeat') { patternHeight = 1; + if (patternOffsetY) { + patternHeight += Math.abs(patternOffsetY); + } } if (this.repeat === 'repeat-y' || this.repeat === 'no-repeat') { patternWidth = 1; + if (patternOffsetX) { + patternWidth += Math.abs(patternOffsetX); + } + } if (patternSource.src) { patternImgSrc = patternSource.src; diff --git a/test/unit/pattern.js b/test/unit/pattern.js index e7585b588d8..0dc6e6a8a0c 100644 --- a/test/unit/pattern.js +++ b/test/unit/pattern.js @@ -143,11 +143,54 @@ }); QUnit.test('toSVG', function(assert) { + fabric.Object.__uid = 0; var pattern = createPattern(); + var rect = new fabric.Rect({ width: 500, height: 500 }); + var expectedSVG = '\n\n\n'; + assert.ok(typeof pattern.toSVG === 'function'); + assert.equal(pattern.toSVG(rect), expectedSVG, 'SVG match'); + }); + + QUnit.test('toSVG repeat-y', function(assert) { + fabric.Object.__uid = 0; + var pattern = createPattern(); + pattern.repeat = 'repeat-y'; + var rect = new fabric.Rect({ width: 500, height: 500 }); + var expectedSVG = '\n\n\n'; + assert.ok(typeof pattern.toSVG === 'function'); + assert.equal(pattern.toSVG(rect), expectedSVG, 'SVG match repeat-y'); + }); + + QUnit.test('toSVG repeat-x', function(assert) { + fabric.Object.__uid = 0; + var pattern = createPattern(); + pattern.repeat = 'repeat-x'; + var rect = new fabric.Rect({ width: 500, height: 500 }); + var expectedSVG = '\n\n\n'; + assert.ok(typeof pattern.toSVG === 'function'); + assert.equal(pattern.toSVG(rect), expectedSVG, 'SVG match repeat-x'); + }); + QUnit.test('toSVG no-repeat', function(assert) { + fabric.Object.__uid = 0; + var pattern = createPattern(); + pattern.repeat = 'no-repeat'; + var rect = new fabric.Rect({ width: 500, height: 500 }); + var expectedSVG = '\n\n\n'; assert.ok(typeof pattern.toSVG === 'function'); + assert.equal(pattern.toSVG(rect), expectedSVG, 'SVG match no-repeat'); + }); - // TODO: test toSVG + QUnit.test('toSVG no-repeat offsetX and offsetY', function(assert) { + fabric.Object.__uid = 0; + var pattern = createPattern(); + pattern.repeat = 'no-repeat'; + pattern.offsetX = 50; + pattern.offsetY = -50; + var rect = new fabric.Rect({ width: 500, height: 500 }); + var expectedSVG = '\n\n\n'; + assert.ok(typeof pattern.toSVG === 'function'); + assert.equal(pattern.toSVG(rect), expectedSVG, 'SVG match no-repat offsetX and offsetY'); }); QUnit.test('initPattern from object', function(assert) {