diff options
| author | Ulrich-Matthias Schäfer <ulima.ums@googlemail.com> | 2020-05-04 21:35:21 +1000 |
|---|---|---|
| committer | Ulrich-Matthias Schäfer <ulima.ums@googlemail.com> | 2020-05-04 21:35:21 +1000 |
| commit | c8cb22863bf8c3ac157f6098be9154908aea9ec2 (patch) | |
| tree | b27b1bf6ec4c90bbd0cb335e26bb9ece504285d2 /spec | |
| parent | 59f09a1a2317e57d13bbe8f60e1949cc82199ead (diff) | |
| download | svg.js-c8cb22863bf8c3ac157f6098be9154908aea9ec2.tar.gz svg.js-c8cb22863bf8c3ac157f6098be9154908aea9ec2.zip | |
Fixed IE Polyfills, got rid of ArrayPolyfill in favour of babels own transforms, updated dependencies, finished tests, removed old es5 tests
Diffstat (limited to 'spec')
47 files changed, 251 insertions, 9028 deletions
diff --git a/spec/RAFPlugin.js b/spec/RAFPlugin.js index c644ee4..61eed46 100644 --- a/spec/RAFPlugin.js +++ b/spec/RAFPlugin.js @@ -1,3 +1,4 @@ +/* globals jasmine */ /** * Jasmine RequestAnimationFrame: a set of helpers for testing funcionality * that uses requestAnimationFrame under the Jasmine BDD framework for JavaScript. @@ -83,9 +84,4 @@ function RAFPlugin (jasmine) { jasmine.RequestAnimationFrame = new MockRAF() } -// if (!module) { RAFPlugin(jasmine) -// } else { -// module.exports.RAFPlugin = RAFPlugin - -// } diff --git a/spec/SpecRunner.html b/spec/SpecRunner.html index d5b20af..56a8885 100644 --- a/spec/SpecRunner.html +++ b/spec/SpecRunner.html @@ -14,91 +14,14 @@ <link rel="stylesheet" href="fixtures/fixture.css"> - <!-- include source files here... --> - <script src="../dist/polyfills.js" charset="utf-8"></script> - <script src="../dist/polyfillsIE.js" charset="utf-8"></script> - <script src="../dist/svg.js" charset="utf-8"></script> - </head> <body> - <svg height="0" width="0" id="inlineSVG"> - <defs> - <linearGradient> - <stop offset="5%" stop-color="green"/> - <stop offset="95%" stop-color="gold"/> - </linearGradient> - <radialGradient> - <stop offset="10%" stop-color="gold"/> - <stop offset="95%" stop-color="green"/> - </radialGradient> - </defs> - <desc>Some description</desc> - <path id="lineAB" d="M 100 350 l 150 -300" stroke="red" stroke-width="3" fill="none" /> - <path id="lineBC" d="M 250 50 l 150 300" stroke="red" stroke-width="3" fill="none" /> - <path d="M 175 200 l 150 0" stroke="green" stroke-width="3" fill="none" /> - <path d="M 100 350 q 150 -300 300 0" stroke="blue" stroke-width="5" fill="none" /> - <g stroke="black" stroke-width="3" fill="black" id="pointGroup"> - <circle id="pointA" cx="100" cy="350" r="3" /> - <circle id="pointB" cx="250" cy="50" r="3" /> - <circle id="pointC" cx="400" cy="350" r="3" /> - </g> - <g font-size="30" font="sans-serif" fill="black" stroke="none" text-anchor="middle" id="labelGroup"> - <text x="100" y="350" dx="-30">A</text> - <text x="250" y="50" dy="-10">B</text> - <text x="400" y="350" dx="30">C</text> - </g> - <polygon points="200,10 250,190 160,210" /> - <polyline points="20,20 40,25 60,40 80,120 120,140 200,180" /> - </svg> - <!-- include spec files here... --> - <script src="spec/adopter.js"></script> - <script src="spec/arrange.js"></script> - <script src="spec/array.js"></script> - <script src="spec/bare.js"></script> - <script src="spec/boxes.js"></script> - <script src="spec/circle.js"></script> - <script src="spec/clip.js"></script> - <script src="spec/color.js"></script> - <script src="spec/container.js"></script> - <script src="spec/defs.js"></script> - <script src="spec/doc.js"></script> - <script src="spec/easing.js"></script> - <script src="spec/element.js"></script> - <script src="spec/ellipse.js"></script> - <script src="spec/event.js"></script> - <script src="spec/fx.js"></script> - <script src="spec/gradient.js"></script> - <script src="spec/helper.js"></script> - <script src="spec/image.js"></script> - <script src="spec/line.js"></script> - <script src="spec/mask.js"></script> - <script src="spec/matrix.js"></script> - <script src="spec/memory.js"></script> - <script src="spec/number.js"></script> - <script src="spec/path.js"></script> - <script src="spec/pattern.js"></script> - <script src="spec/point.js"></script> - <script src="spec/polygon.js"></script> - <script src="spec/polyline.js"></script> - <script src="spec/rect.js"></script> - <script src="spec/regex.js"></script> - <script src="spec/selector.js"></script> - <script src="spec/sugar.js"></script> - <script src="spec/svg.js"></script> - <script src="spec/symbol.js"></script> - <script src="spec/textpath.js"></script> - <script src="spec/transformations.js"></script> - <script src="spec/use.js"></script> - <script src="spec/utils.js"></script> - <script src="spec/morphing.js"></script> - <script src="spec/animator.js"></script> - <script src="spec/runner.js"></script> - <script src="spec/queue.js"></script> - <script src="spec/timeline.js"></script> + <script src="../dist/polyfillsIE.js"></script> + <script src="es5TestBundle.js"></script> </body> </html> diff --git a/spec/spec/adopter.js b/spec/spec/adopter.js deleted file mode 100644 index 05c1517..0000000 --- a/spec/spec/adopter.js +++ /dev/null @@ -1,79 +0,0 @@ -describe('Adopter', function() { - var path, polyline, polygon, linearGradient, radialGradient - - beforeEach(function() { - path = SVG('#lineAB') - polyline = SVG('#inlineSVG').find('polyline')[0] - polygon = SVG('#inlineSVG').find('polygon')[0] - linearGradient = SVG('#inlineSVG').find('linearGradient')[0] - radialGradient = SVG('#inlineSVG').find('radialGradient')[0] - }) - - describe('with SVG.Svg instance', function() { - it('adopts the main svg document when parent() method is called on first level children', function() { - expect(path.parent() instanceof SVG.Svg).toBeTruthy() - }) - it('defines a xmlns attribute', function() { - expect(path.parent().node.getAttribute('xmlns')).toBe(SVG.namespaces.ns) - }) - it('defines a version attribute', function() { - expect(path.parent().node.getAttribute('version')).toBe('1.1') - }) - it('defines a xmlns:xlink attribute', function() { - expect(path.parent().node.getAttribute('xmlns:xlink')).toBe(SVG.namespaces.xlink) - }) - it('initializes a defs node', function() { - expect(path.defs() instanceof SVG.Defs).toBe(true) - }) - }) - - describe('with SVG.Path instance', function() { - it('adopts an exiting path element', function() { - expect(path instanceof SVG.Path).toBeTruthy() - }) - it('modifies an adopted element', function() { - path.fill('#f06') - expect(path.node.getAttribute('fill')).toBe('#ff0066') - }) - it('parses d attribute to SVG.PathArray', function() { - expect(path.array() instanceof SVG.PathArray).toBeTruthy() - }) - }) - - describe('with SVG.Polyline instance', function() { - it('parses points attribute to SVG.PointArray', function() { - expect(polyline.array() instanceof SVG.PointArray).toBeTruthy() - }) - }) - - describe('with SVG.Polygon instance', function() { - it('parses points attribute to SVG.PointArray', function() { - expect(polygon.array() instanceof SVG.PointArray).toBeTruthy() - }) - }) - - describe('with linear SVG.Gradient instance', function() { - it('is instance of SVG.Gradient', function() { - expect(linearGradient instanceof SVG.Gradient).toBeTruthy() - }) - it('has type of linearGradient', function() { - expect(linearGradient.type).toBe('linearGradient') // actually it should be 'linear'. see #606 - }) - }) - - describe('with radial SVG.Gradient instance', function() { - it('is instance of SVG.Gradient', function() { - expect(radialGradient instanceof SVG.Gradient).toBeTruthy() - }) - it('has type of radialGradient', function() { - expect(radialGradient.type).toBe('radialGradient') // actually it should be 'radial'. see #606 - }) - }) - - describe('with node that has no matching svg.js class', function() { - it('wraps the node in the Dom class', function() { - var desc = SVG('#inlineSVG').find('desc')[0] - expect(desc instanceof SVG.Dom).toBeTruthy() - }) - }) -}) diff --git a/spec/spec/animation/Morphable.js b/spec/spec/animation/Morphable.js index f703f97..510398c 100644 --- a/spec/spec/animation/Morphable.js +++ b/spec/spec/animation/Morphable.js @@ -360,5 +360,14 @@ describe('Morphable.js', () => { expect(bag.valueOf()).toEqual({ fill: objectContaining(new Color()), bar: 2 }) }) }) + + describe('align()', () => { + it('aligns color spaces between two object bags', () => { + const bag1 = new ObjectBag({ x: 1, y: '#fff' }) + const bag2 = new ObjectBag({ x: 2, y: new Color().hsl() }) + bag1.align(bag2.toArray()) + expect(bag1.toArray()).toEqual([ 'x', SVGNumber, 2, 1, '', 'y', Color, 5, 0, 0, 100, 0, 'hsl' ]) + }) + }) }) }) diff --git a/spec/spec/animation/Runner.js b/spec/spec/animation/Runner.js index 08fdbdc..b22bdcc 100644 --- a/spec/spec/animation/Runner.js +++ b/spec/spec/animation/Runner.js @@ -1,6 +1,6 @@ /* globals describe, expect, it, beforeEach, afterEach, spyOn, jasmine */ -import { Runner, defaults, Ease, Controller, SVG, Timeline, Rect, Morphable, Animator, Queue, Matrix, Color, Box, Polygon, PathArray, PointArray } from '../../../src/main.js' +import { Runner, defaults, Ease, Controller, SVG, Timeline, Rect, Morphable, Animator, Queue, Matrix, Color, Box, Polygon, PointArray } from '../../../src/main.js' import { FakeRunner, RunnerArray } from '../../../src/animation/Runner.js' import { getWindow } from '../../../src/utils/window.js' import SVGNumber from '../../../src/types/SVGNumber.js' diff --git a/spec/spec/arrange.js b/spec/spec/arrange.js deleted file mode 100644 index ea0ea2b..0000000 --- a/spec/spec/arrange.js +++ /dev/null @@ -1,172 +0,0 @@ -describe('Arrange', function() { - var e1, e2, e3 - - beforeEach(function() { - draw.clear() - - e1 = draw.rect(100,100).move(10,10).attr('id', 'e1') - e2 = draw.ellipse(100,100).move(20,20).attr('id', 'e2') - e3 = draw.line(0,0,100,100).move(30,30).attr('id', 'e3') - }) - - describe('siblings()', function() { - it('returns all siblings of targeted element', function() { - expect(e1.siblings().length).toBe(3+parserInDoc) - expect(parser.concat([e1,e2,e3])).toEqual(e2.siblings()) - }) - }) - - describe('position()', function() { - it('returns the index position within it\'s parent', function() { - expect(e1.siblings().length).toBe(3+parserInDoc) - expect(e1.position()).toBe(0+parserInDoc) - expect(e2.position()).toBe(1+parserInDoc) - expect(e3.position()).toBe(2+parserInDoc) - }) - }) - - describe('next()', function() { - it('returns the next sibling within the parent element', function() { - expect(e1.next()).toBe(e2) - expect(e2.next()).toBe(e3) - expect(e3.next()).toBe(undefined) - }) - }) - - describe('prev()', function() { - it('returns the previous sibling within the parent element', function() { - expect(e1.prev()).toBe(parser[0]) - expect(e2.prev()).toBe(e1) - expect(e3.prev()).toBe(e2) - }) - }) - - describe('forward()', function() { - it('returns the element itself', function() { - expect(e1.forward()).toBe(e1) - }) - it('moves the element one step forward within its parent', function() { - e1.forward() - expect(e1.position()).toBe(1+parserInDoc) - expect(e2.position()).toBe(0+parserInDoc) - expect(e3.position()).toBe(2+parserInDoc) - }) - it('keeps the last element at the same position', function() { - e3.forward() - expect(e3.position()).toBe(2+parserInDoc) - }) - it('keeps the defs on top of the stack', function() { - draw.defs() - e3.forward() - - expect(draw.node.childNodes[2+parserInDoc]).toBe(e3.node) - expect(draw.node.childNodes[3+parserInDoc]).toBe(draw.defs().node) - }) - }) - - describe('backward()', function() { - it('returns the element itself', function() { - if(parserInDoc){ - expect(parser[0].backward()).toBe(parser[0]) - }else{ - expect(e1.backward()).toBe(e1) - } - }) - it('moves the element one step backwards within its parent', function() { - e3.backward() - expect(e1.position()).toBe(0+parserInDoc) - expect(e2.position()).toBe(2+parserInDoc) - expect(e3.position()).toBe(1+parserInDoc) - }) - it('keeps the first element at the same position', function() { - e3.backward() - expect(e1.position()).toBe(0+parserInDoc) - }) - }) - - describe('front()', function() { - it('returns the element itself', function() { - expect(e3.front()).toBe(e3) - }) - it('moves the element to the top of the stack within its parent', function() { - e1.front() - expect(e1.position()).toBe(2+parserInDoc) - expect(e2.position()).toBe(0+parserInDoc) - expect(e3.position()).toBe(1+parserInDoc) - }) - it('keeps the last element at the same position', function() { - e3.front() - expect(e3.position()).toBe(2+parserInDoc) - }) - it('keeps the defs on top of the stack', function() { - e1.front() - expect(draw.node.childNodes[2+parserInDoc]).toBe(e1.node) - expect(draw.node.childNodes[3+parserInDoc]).toBe(draw.defs().node) - }) - }) - - describe('back()', function() { - it('returns the element itself', function() { - expect(e3.back()).toBe(e3) - }) - it('moves the element to the bottom of the stack within its parent', function() { - e3.back() - expect(e1.position()).toBe(1+parserInDoc) - expect(e2.position()).toBe(2+parserInDoc) - expect(e3.position()).toBe(0) - }) - it('keeps the first element at the same position', function() { - e1.back() - expect(e1.position()).toBe(0) - }) - }) - - describe('before()', function() { - it('returns the targeted element itself', function() { - expect(e3.before(e1)).toBe(e3) - }) - it('inserts a given element before the targeted element', function() { - e3.before(e1) - expect(e1.position()).toBe(1+parserInDoc) - expect(e2.position()).toBe(0+parserInDoc) - expect(e3.position()).toBe(2+parserInDoc) - }) - it('moves elements between containers', function() { - var group = draw.group() - , e4 = group.rect(80,120) - , e5 = group.rect(80,120) - , e6 = group.rect(80,120) - - e2.before(e5) - expect(e1.position()).toBe(0+parserInDoc) - expect(e2.position()).toBe(2+parserInDoc) - expect(e3.position()).toBe(3+parserInDoc) - expect(e5.position()).toBe(1+parserInDoc) - }) - }) - - describe('after()', function() { - it('returns the targeted element itself', function() { - expect(e3.after(e1)).toBe(e3) - }) - it('inserts a given element after the targeted element', function() { - e3.after(e1) - expect(e1.position()).toBe(2+parserInDoc) - expect(e2.position()).toBe(0+parserInDoc) - expect(e3.position()).toBe(1+parserInDoc) - }) - it('moves elements between containers', function() { - var group = draw.group() - , e4 = group.rect(80,120) - , e5 = group.rect(80,120) - , e6 = group.rect(80,120) - - e2.after(e5) - expect(e1.position()).toBe(0+parserInDoc) - expect(e2.position()).toBe(1+parserInDoc) - expect(e3.position()).toBe(3+parserInDoc) - expect(e5.position()).toBe(2+parserInDoc) - }) - }) - -}) diff --git a/spec/spec/array.js b/spec/spec/array.js deleted file mode 100644 index 03cffa3..0000000 --- a/spec/spec/array.js +++ /dev/null @@ -1,324 +0,0 @@ -describe('Array', function () { - var array, arr1, arr2 - - it('parses a matrix array correctly to string', function() { - array = new SVG.Array([ .343, .669, .119, 0, 0 - , .249, -.626, .130, 0, 0 - , .172, .334, .111, 0, 0 - , .000, .000, .000, 1, -0 ]) - - expect(array + '').toBe('0.343 0.669 0.119 0 0 0.249 -0.626 0.13 0 0 0.172 0.334 0.111 0 0 0 0 0 1 0') - }) - it('parses space seperated string and converts it to array', function() { - expect((new SVG.Array('1 2 3 4')).valueOf()).toEqual([1,2,3,4]) - }) - it('parses comma seperated string and converts it to array', function() { - expect((new SVG.Array('1,2,3,4')).valueOf()).toEqual([1,2,3,4]) - }) - describe('reverse()', function() { - it('reverses the array', function() { - array = new SVG.Array([1 ,2 ,3, 4, 5]).reverse() - expect(array.valueOf()).toEqual([5, 4, 3, 2, 1]) - }) - it('returns itself', function() { - array = new SVG.Array() - expect(array.reverse()).toBe(array) - }) - }) - describe('clone()', function() { - it('creates a deep clone of the array', function() { - array = new SVG.Array([1, 2, 3, 4, 5]) - - clone = array.clone() - - expect(array).toEqual(clone) - expect(array).not.toBe(clone) - - array = new SVG.Array([[1,2], [3, 4], [5]]) - clone = array.clone() - - expect(array).toEqual(array) - for(var i = 0, len = array.length; i; ++i){ - expect(array[i]).not.toBe(clone[i]) - } - }) - it('also works with PointArray', function() { - array = new SVG.PointArray([1,2,3,4,5,6]) - clone = array.clone() - - expect(array).toEqual(clone) - expect(array).not.toBe(clone) - - for(var i = 0, len = array.length; i; ++i){ - expect(array[i]).not.toBe(clone[i]) - } - }) - it('also works with PathArray', function() { - array = new SVG.PathArray([['M',1,2],['L',3,4],['L',5,6]]) - clone = array.clone() - - expect(array).toEqual(clone) - expect(array).not.toBe(clone) - - for(var i = 0, len = array.length; i; ++i){ - expect(array[i]).not.toBe(clone[i]) - } - }) - }) -}) - - -describe('PointArray', function () { - it('parses a string to a point array', function() { - var array = new SVG.PointArray('0,1 -.05,7.95 1000.0001,-200.222') - - expect(array.valueOf()).toEqual([[0, 1], [-0.05, 7.95], [1000.0001, -200.222]]) - }) - it('parses a points array correctly to string', function() { - var array = new SVG.PointArray([[0,.15], [-100,-3.141592654], [50,100]]) - - expect(array + '').toBe('0,0.15 -100,-3.141592654 50,100') - }) - it('parses a flat array of x/y coordinates to a point array', function() { - var array = new SVG.PointArray([1,4, 5,68, 12,24]) - - expect(array.valueOf()).toEqual([[1,4], [5,68], [12,24]]) - }) - it('parses points with space delimitered x/y coordinates', function() { - var array = new SVG.PointArray('221.08 191.79 0.46 191.79 0.46 63.92 63.8 0.46 284.46 0.46 284.46 128.37 221.08 191.79') - - expect(array + '').toBe('221.08,191.79 0.46,191.79 0.46,63.92 63.8,0.46 284.46,0.46 284.46,128.37 221.08,191.79') - }) - it('parses points with comma delimitered x/y coordinates', function() { - var array = new SVG.PointArray('221.08,191.79,0.46,191.79,0.46,63.92,63.8,0.46,284.46,0.46,284.46,128.37,221.08,191.79') - - expect(array + '').toBe('221.08,191.79 0.46,191.79 0.46,63.92 63.8,0.46 284.46,0.46 284.46,128.37 221.08,191.79') - }) - it('parses points with comma and space delimitered x/y coordinates', function() { - var array = new SVG.PointArray('221.08, 191.79, 0.46, 191.79, 0.46, 63.92, 63.8, 0.46, 284.46, 0.46, 284.46, 128.37, 221.08, 191.79') - - expect(array + '').toBe('221.08,191.79 0.46,191.79 0.46,63.92 63.8,0.46 284.46,0.46 284.46,128.37 221.08,191.79') - }) - it('parses points with space and comma delimitered x/y coordinates', function() { - var array = new SVG.PointArray('221.08 ,191.79 ,0.46 ,191.79 ,0.46 ,63.92 ,63.8 ,0.46 ,284.46 ,0.46 ,284.46 ,128.37 ,221.08 ,191.79') - - expect(array + '').toBe('221.08,191.79 0.46,191.79 0.46,63.92 63.8,0.46 284.46,0.46 284.46,128.37 221.08,191.79') - }) - it('parses points with redundant spaces at the end', function() { - var array = new SVG.PointArray('2176.6,1708.8 2176.4,1755.8 2245.8,1801.5 2297,1787.8 ') - - expect(array + '').toBe('2176.6,1708.8 2176.4,1755.8 2245.8,1801.5 2297,1787.8') - }) - it('parses points with space delimitered x/y coordinates - even with leading or trailing space', function() { - var array = new SVG.PointArray(' 1 2 3 4 ') - - expect(array + '').toBe('1,2 3,4') - }) - it('parses odd number of points with space delimitered x/y coordinates and silently remove the odd point', function() { - // this is according to spec: https://svgwg.org/svg2-draft/shapes.html#DataTypePoints - - var array = new SVG.PointArray('1 2 3') - - expect(array + '').toBe('1,2') - }) - it('parses odd number of points in a flat array of x/y coordinates and silently remove the odd point', function() { - // this is according to spec: https://svgwg.org/svg2-draft/shapes.html#DataTypePoints - - var array = new SVG.PointArray([1, 2, 3]) - - expect(array.valueOf()).toEqual([[1,2]]) - }) - - describe('size()', function() { - it('correctly sizes the points over the whole area', function() { - var array = new SVG.PointArray([10, 10, 20, 20, 30, 30]) - expect(array.size(60, 60).valueOf()).toEqual([[10,10], [40, 40], [70, 70]]) - }) - - it('let coordinates untouched when width/height is zero', function() { - var array = new SVG.PointArray([10, 10, 10, 20, 10, 30]) - expect(array.size(60, 60).valueOf()).toEqual([[10,10], [10, 40], [10, 70]]) - - array = new SVG.PointArray([10, 10, 20, 10, 30, 10]) - expect(array.size(60, 60).valueOf()).toEqual([[10,10], [40, 10], [70, 10]]) - }) - - }) -}) - -describe('PathArray', function () { - var p1, p2, p3, p4, p5, p6, p7 - - beforeEach(function() { - p1 = new SVG.PathArray('m10 10 h 80 v 80 h -80 l 300 400 z') - p2 = new SVG.PathArray('m10 80 c 40 10 65 10 95 80 s 150 150 180 80 t 300 300 q 52 10 95 80 z') - p3 = new SVG.PathArray('m80 80 A 45 45, 0, 0, 0, 125 125 L 125 80 z') - p4 = new SVG.PathArray('M215.458,245.23c0,0,77.403,0,94.274,0S405,216.451,405,138.054S329.581,15,287.9,15c-41.68,0-139.924,0-170.688,0C86.45,15,15,60.65,15,134.084c0,73.434,96.259,112.137,114.122,112.137C146.984,246.221,215.458,245.23,215.458,245.23z') - p5 = new SVG.PathArray('M10 10-45-30.5.5 .89L2e-2.5.5.5-.5C.5.5.5.5.5.5L-3-4z') - p6 = new SVG.PathArray('m 0,0 0,3189 2209,0 0,-3189 -2209,0 z m 154,154 1901,0 0,2881 -1901,0 0,-2881 z') - - }) - - it('converts to absolute values', function() { - expect(p1.toString()).toBe('M10 10H90V90H10L310 490Z ') - expect(p2.toString()).toBe('M10 80C50 90 75 90 105 160S255 310 285 240T585 540Q637 550 680 620Z ') - expect(p3.toString()).toBe('M80 80A45 45 0 0 0 125 125L125 80Z ') - expect(p4.toString()).toBe('M215.458 245.23C215.458 245.23 292.861 245.23 309.73199999999997 245.23S405 216.451 405 138.054S329.581 15 287.9 15C246.21999999999997 15 147.97599999999997 15 117.21199999999999 15C86.45 15 15 60.65 15 134.084C15 207.518 111.259 246.221 129.122 246.221C146.984 246.221 215.458 245.23 215.458 245.23Z ') - expect(p6.toString()).toBe('M0 0L0 3189L2209 3189L2209 0L0 0ZM154 154L2055 154L2055 3035L154 3035L154 154Z ') - }) - - it('parses difficult syntax correctly', function() { - expect(p5.toString()).toBe('M10 10L-45 -30.5L0.5 0.89L0.02 0.5L0.5 -0.5C0.5 0.5 0.5 0.5 0.5 0.5L-3 -4Z ') - }) - - it('parses flat arrays correctly', function() { - p6 = new SVG.PathArray([ 'M', 0, 0, 'L', 100, 100, 'z' ]) - expect(p6.toString()).toBe('M0 0L100 100Z ') - }) - - it('parses nested arrays correctly', function() { - p7 = new SVG.PathArray([ ['M', 0, 0], ['L', 100, 100], ['z'] ]) - expect(p7.toString()).toBe('M0 0L100 100Z ') - }) - - // this test is designed to cover a certain line but it doesnt work because of #608 - it('returns the valueOf when PathArray is given', function() { - var p = new SVG.PathArray('m10 10 h 80 v 80 h -80 l 300 400 z') - - expect((new SVG.PathArray(p))).toEqual(p) - }) - - it('can handle all formats which can be used', function() { - // when no command is specified after move, line is used automatically (specs say so) - expect(new SVG.PathArray('M10 10 80 80 30 30 Z').toString()).toBe('M10 10L80 80L30 30Z ') - - // parsing can handle 0.5.3.3.2 stuff - expect(new SVG.PathArray('M10 10L.5.5.3.3Z').toString()).toBe('M10 10L0.5 0.5L0.3 0.3Z ') - }) - - describe('move()', function() { - it('moves all points in a straight path', function() { - expect(p1.move(100,200).toString()).toBe('M100 200H180V280H100L400 680Z ') - }) - it('moves all points in a curved path', function() { - expect(p2.move(100,200).toString()).toBe('M100 200C140 210 165 210 195 280S345 430 375 360T675 660Q727 670 770 740Z ') - }) - it('moves all points in a arc path', function() { - expect(p3.move(100,200).toString()).toBe('M100 200A45 45 0 0 0 145 245L145 200Z ') - }) - }) - - describe('size()', function() { - it('resizes all points in a straight path', function() { - expect(p1.size(600,200).toString()).toBe('M10 10H170V43.333333333333336H10L610 210Z ') - }) - it('resizes all points in a curved path', function() { - expect(p2.size(600,200).toString()).toBe('M10 80C45.82089552238806 83.70370370370371 68.2089552238806 83.70370370370371 95.07462686567165 109.62962962962963S229.40298507462686 165.1851851851852 256.2686567164179 139.25925925925927T524.9253731343283 250.37037037037038Q571.4925373134329 254.07407407407408 610 280Z ') - }) - it('resizes all points in a arc path', function() { - var expected = [ - ['M', 80, 80], - ['A', 600, 200, 0, 0, 0, 680, 280], - ['L', 680, 80], - ['Z'] - ] - - var toBeTested = p3.size(600,200) - - for(var i = toBeTested.length; i--;) { - expect(toBeTested[i].shift().toUpperCase()).toBe(expected[i].shift().toUpperCase()) - for(var j = toBeTested[i].length; j--;) { - expect(toBeTested[i][j]).toBeCloseTo(expected[i][j]) - } - } - }) - }) - - describe('equalCommands()', function() { - it('return true if the passed path array use the same commands', function() { - var pathArray1 = new SVG.PathArray('m -1500,-478 a 292,195 0 0 1 262,205 l -565,319 c 0,0 -134,-374 51,-251 185,122 251,-273 251,-273 z') - , pathArray2 = new SVG.PathArray('m -680, 527 a 292,195 0 0 1 262,205 l -565,319 c 0,0 -134,-374 51,-251 185,122 251,-273 251,-273 z') - - expect(pathArray1.equalCommands(pathArray2)).toBe(true) - }) - it('return false if the passed path array does not use the same commands', function() { - var pathArray1 = new SVG.PathArray('m -1500,-478 a 292,195 0 0 1 262,205 l -565,319 c 0,0 -134,-374 51,-251 185,122 251,-273 251,-273 z') - , pathArray2 = new SVG.PathArray('m - 663, 521 c 147,178 118,-25 245,210 l -565,319 c 0,0 -134,-374 51,-251 185,122 268,-278 268,-278 z') - - expect(pathArray1.equalCommands(pathArray2)).toBe(false) - }) - }) - // - // describe('morph()', function() { - // it('should set the attribute destination to the passed path array when it have the same comands as this path array', function() { - // var pathArray1 = new SVG.PathArray('m -1500,-478 a 292,195 0 0 1 262,205 l -565,319 c 0,0 -134,-374 51,-251 185,122 251,-273 251,-273 z') - // , pathArray2 = new SVG.PathArray('m -680, 527 a 292,195 0 0 1 262,205 l -565,319 c 0,0 -134,-374 51,-251 185,122 251,-273 251,-273 z') - // - // pathArray1.morph(pathArray2) - // expect(pathArray1.destination).toEqual(pathArray2) - // }) - // it('should set the attribute destination to null when the passed path array does not have the same comands as this path array', function() { - // var pathArray1 = new SVG.PathArray('m -1500,-478 a 292,195 0 0 1 262,205 l -565,319 c 0,0 -134,-374 51,-251 185,122 251,-273 251,-273 z') - // , pathArray2 = new SVG.PathArray('m - 663, 521 c 147,178 118,-25 245,210 l -565,319 c 0,0 -134,-374 51,-251 185,122 268,-278 268,-278 z') - // - // pathArray1.morph(pathArray2) - // expect(pathArray1.destination).toBeNull() - // }) - // }) - // - // describe('at()', function() { - // it('returns a morphed path array at a given position', function() { - // var pathArray1 = new SVG.PathArray("M 63 25 A 15 15 0 0 1 73 40 A 15 15 0 0 1 61 53 C 49 36 50 59 50 59 L 33 55 Z") - // , pathArray2 = new SVG.PathArray("M 132 40 A 15 15 0 0 1 141 54 A 15 15 0 0 1 130 67 C 118 51 119 73 119 73 L 103 69 Z") - // , morphedPathArray = pathArray1.morph(pathArray2).at(0.5) - // , sourceArray = pathArray1, destinationArray = pathArray1.destination - // , morphedArray = morphedPathArray - // , i, il, j, jl - // - // expect(morphedArray.length).toBe(sourceArray.length) - // - // // For all the commands - // for(i = 0, il = sourceArray.length; i < il; i++) { - // // Expect the current command to be the same - // expect(morphedArray[i][0]).toBe(sourceArray[i][0]) - // expect(morphedArray[i].length).toBe(sourceArray[i].length) - // - // // For all the parameters of the current command - // for(j = 1, jl = sourceArray[i].length; j < jl; j++) { - // expect(morphedArray[i][j]).toBe((sourceArray[i][j] + destinationArray[i][j]) / 2) - // } - // } - // }) - // it('should interpolate flags and booleans as fractions between zero and one, with any non-zero value considered to be a value of one/true', function() { - // // Only the Elliptical arc command use flags, it has the following form: - // // A rx ry x-axis-rotation large-arc-flag sweep-flag x y - // var pathArray1 = new SVG.PathArray('M 13 13 A 25 37 0 0 1 43 25') - // , pathArray2 = new SVG.PathArray('M 101 55 A 25 37 0 1 0 130 67') - // , morphedPathArray - // - // pathArray1.morph(pathArray2) - // - // // The morphedPathArray contain 2 commands: [['M', ...], ['A', ...]] - // // Elliptical arc command in a path array followed by corresponding indexes: - // // ['A', rx, ry, x-axis-rotation, large-arc-flag, sweep-flag, x, y] - // // 0 1 2 3 4 5 6 7 - // morphedPathArray = pathArray1.at(0) - // expect(morphedPathArray[1][4]).toBe(0) - // expect(morphedPathArray[1][5]).toBe(1) - // - // morphedPathArray = pathArray1.at(0.5) - // expect(morphedPathArray[1][4]).toBe(1) - // expect(morphedPathArray[1][5]).toBe(1) - // - // morphedPathArray = pathArray1.at(1) - // expect(morphedPathArray[1][4]).toBe(1) - // expect(morphedPathArray[1][5]).toBe(0) - // }) - // it('return itself if the destination attribute is null', function(){ - // var pathArray = new SVG.PathArray('M 13 13 A 25 37 0 0 1 43 25') - // pathArray.destination = null - // expect(pathArray.at(0.45)).toBe(pathArray) - // }) - // }) - -}) diff --git a/spec/spec/boxes.js b/spec/spec/boxes.js deleted file mode 100644 index d5581b2..0000000 --- a/spec/spec/boxes.js +++ /dev/null @@ -1,237 +0,0 @@ -describe('Box', function() { - describe('initialization', function() { - var box - - it('creates a new box with default values', function() { - box = new SVG.Box - - expect(box instanceof SVG.Box).toBe(true) - expect(box).toEqual(jasmine.objectContaining({ - x:0, y:0, cx:0, cy:0, width:0, height:0 - })) - }) - - it('creates a new box from parsed string', function() { - box = new SVG.Box('10. 100 200 300') - expect(box.x).toBe(10) - expect(box.y).toBe(100) - expect(box.width).toBe(200) - expect(box.height).toBe(300) - expect(box.cx).toBe(110) - expect(box.cy).toBe(250) - expect(box.x2).toBe(210) - expect(box.y2).toBe(400) - }) - - it('creates a new box from parsed string with comma as delimiter', function() { - box = new SVG.Box('10,100, 200 , 300') - expect(box.x).toBe(10) - expect(box.y).toBe(100) - expect(box.width).toBe(200) - expect(box.height).toBe(300) - }) - - it('creates a new box from array', function() { - box = new SVG.Box([10, 100, 200, 300]) - - expect(box.x).toBe(10) - expect(box.y).toBe(100) - expect(box.width).toBe(200) - expect(box.height).toBe(300) - }) - - it('creates a new box from object', function() { - box = new SVG.Box({x:10, y:100, width:200, height:300}) - - expect(box.x).toBe(10) - expect(box.y).toBe(100) - expect(box.width).toBe(200) - expect(box.height).toBe(300) - }) - - it('creates a new box from object width left and top instead of x and y', function() { - box = new SVG.Box({left:10, top:100, width:200, height:300}) - - expect(box.x).toBe(10) - expect(box.y).toBe(100) - expect(box.width).toBe(200) - expect(box.height).toBe(300) - }) - - it('creates a new viewbox from 4 arguments', function() { - box = new SVG.Box(10, 100, 200, 300) - - expect(box.x).toBe(10) - expect(box.y).toBe(100) - expect(box.width).toBe(200) - expect(box.height).toBe(300) - }) - - it('creates a new box from parsed string with exponential values', function() { - box = new SVG.Box('-1.12e1 1e-2 +2e2 +.3e+4') - - expect(box.x).toBe(-11.2) - expect(box.y).toBe(0.01) - expect(box.width).toBe(200) - expect(box.height).toBe(3000) - }) - - }) - - describe('merge()', function() { - it('merges various bounding boxes', function() { - var box1 = new SVG.Box(50, 50, 100, 100) - var box2 = new SVG.Box(300, 400, 100, 100) - var box3 = new SVG.Box(500, 100, 100, 100) - var merged = box1.merge(box2).merge(box3) - - expect(merged).toEqual(jasmine.objectContaining({ - x: 50, y: 50, cx: 325, cy: 275, width: 550, height: 450 - })) - }) - it('returns a new instance', function() { - var box1 = new SVG.Box(50, 50, 100, 100) - var box2 = new SVG.Box(300, 400, 100, 100) - var merged = box1.merge(box2) - expect(box1).not.toBe(merged) - expect(box2).not.toBe(merged) - - expect(merged instanceof SVG.Box).toBe(true) - }) - }) - - describe('transform()', function() { - it('transforms the box with given matrix', function() { - var box1 = new SVG.Box(50, 50, 100, 100).transform(new SVG.Matrix(1,0,0,1,20,20)) - var box2 = new SVG.Box(50, 50, 100, 100).transform(new SVG.Matrix(2,0,0,2,0,0)) - var box3 = new SVG.Box(-200, -200, 100, 100).transform(new SVG.Matrix(1,0,0,1,-20,-20)) - - expect(box1).toEqual(jasmine.objectContaining({ - x: 70, y: 70, cx: 120, cy: 120, width: 100, height: 100 - })) - - expect(box2).toEqual(jasmine.objectContaining({ - x: 100, y: 100, cx: 200, cy: 200, width: 200, height: 200 - })) - - expect(box3).toEqual(jasmine.objectContaining({ - x: -220, y: -220, cx: -170, cy: -170, width: 100, height: 100 - })) - }) - }) -}) - - -describe('Boxes', function() { - var rect, nested, offset - - beforeEach(function() { - offset = draw.screenCTM() - draw.viewbox(100,100, 200, 200) - nested = draw.nested().size(200, 200).move(100,100).viewbox(0, 0, 100, 100) - rect = nested.rect(50, 180).stroke({width:0}).move(25, 90).transform({scale: 2, origin: [0, 0]}).relative(10, 10) - }) - afterEach(function() { - draw.clear().attr('viewBox', null) - }) - - describe('bbox()', function() { - it('returns an instance of SVG.Box', function() { - expect(rect.bbox() instanceof SVG.Box).toBeTruthy() - }) - it('matches the size of the target element, ignoring transformations', function() { - var box = rect.bbox() - - expect(box).toEqual(jasmine.objectContaining({ - x: 25, y: 90, cx: 50, cy: 180, width: 50, height: 180 - })) - }) - it('returns a box even if the element is not in the dom', function() { - var line = new SVG.Line().plot(0, 0, 50, 50) - var box = line.bbox() - - expect(box).toEqual(jasmine.objectContaining({ - x: 0, y: 0, width: 50, height: 50 - })) - - expect('Should not result into infinite loop').toBe('Should not result into infinite loop') - }) - it('returns a box even if the element is not in the dom and invisible', function() { - var line = new SVG.Line().plot(0, 0, 50, 50).hide() - var box = line.bbox() - - expect(box).toEqual(jasmine.objectContaining({ - x: 0, y: 0, width: 50, height: 50 - })) - - expect('Should not result into infinite loop').toBe('Should not result into infinite loop') - }) - }) - - describe('rbox()', function() { - it('returns an instance of SVG.Box', function() { - expect(rect.rbox() instanceof SVG.Box).toBeTruthy() - }) - - it('returns the elements box in absolute screen coordinates by default', function() { - var box = rect.rbox() - - expect(window.roundBox(box)).toEqual(jasmine.objectContaining(window.roundBox({ - x: 70 + offset.e, y: 200 + offset.f, width: 100, height: 360 - }))) - - }) - - it('returns the elements box in coordinates of given element (root)', function() { - var box = rect.rbox(draw) - - expect(window.roundBox(box)).toEqual(jasmine.objectContaining({ - x: 240, y: 500, width: 200, height: 720 - })) - }) - - it('returns the elements box in coordinates of given element (nested)', function() { - var box = rect.rbox(nested) - - expect(window.roundBox(box)).toEqual(jasmine.objectContaining({ - x: 70, y: 200, width: 100, height: 360 - })) - }) - }) - - describe('viewbox()', function() { - - beforeEach(function() { - draw.attr('viewBox', null) - }) - - it('should set the viewbox when four arguments are provided', function() { - draw.viewbox(0,0,100,100) - expect(draw.node.getAttribute('viewBox')).toBe('0 0 100 100') - }) - it('should set the viewbox when an object is provided as first argument', function() { - draw.viewbox({ x: 0, y: 0, width: 50, height: 50 }) - expect(draw.node.getAttribute('viewBox')).toBe('0 0 50 50') - }) - it('should set the viewbox when a string is provided as first argument', function() { - draw.viewbox('0 0 50 50') - expect(draw.node.getAttribute('viewBox')).toBe('0 0 50 50') - }) - it('should set the viewbox when an array is provided as first argument', function() { - draw.viewbox([0, 0, 50, 50]) - expect(draw.node.getAttribute('viewBox')).toBe('0 0 50 50') - }) - it('should accept negative values', function() { - draw.size(100,100).viewbox(-100, -100, 50, 50) - expect(draw.node.getAttribute('viewBox')).toEqual('-100 -100 50 50') - }) - it('should get the viewbox if no arguments are given', function() { - draw.viewbox(0, 0, 100, 100) - expect(draw.viewbox()).toEqual(new SVG.Box(0,0,100,100)) - }) - it('should get a nulled viewbox when no viewbox attribute is set', function() { - expect(draw.viewbox()).toEqual(new SVG.Box()) - }) - }) - -}) diff --git a/spec/spec/circle.js b/spec/spec/circle.js deleted file mode 100644 index 0f2c8f4..0000000 --- a/spec/spec/circle.js +++ /dev/null @@ -1,177 +0,0 @@ - -describe('Circle', function() { - var circle - - beforeEach(function() { - circle = draw.circle(240) - }) - - afterEach(function() { - draw.clear() - }) - - describe('x()', function() { - it('returns the value of x without an argument', function() { - expect(circle.x()).toBe(0) - }) - it('sets the value of x with the first argument', function() { - circle.x(123) - var box = circle.bbox() - expect(box.x).toBeCloseTo(123) - }) - }) - - describe('y()', function() { - it('returns the value of y without an argument', function() { - expect(circle.y()).toBe(0) - }) - it('sets the value of cy with the first argument', function() { - circle.y(345) - var box = circle.bbox() - expect(box.y).toBe(345) - }) - }) - - describe('cx()', function() { - it('returns the value of cx without an argument', function() { - expect(circle.cx()).toBe(120) - }) - it('sets the value of cx with the first argument', function() { - circle.cx(123) - var box = circle.bbox() - expect(box.cx).toBe(123) - }) - }) - - describe('cy()', function() { - it('returns the value of cy without an argument', function() { - expect(circle.cy()).toBe(120) - }) - it('sets the value of cy with the first argument', function() { - circle.cy(345) - var box = circle.bbox() - expect(box.cy).toBe(345) - }) - }) - - describe('radius()', function() { - it('sets the r attribute with the first argument', function() { - circle.radius(10) - expect(circle.node.getAttribute('r')).toBe('10') - }) - }) - - describe('rx()', function() { - it('sets the r attribute with the first argument', function() { - circle.rx(11) - expect(circle.node.getAttribute('r')).toBe('11') - }) - it('gets the r attribute without and argument', function() { - circle.rx() - expect(circle.node.getAttribute('r')).toBe('120') - }) - }) - - describe('ry()', function() { - it('sets the r attribute with the first argument', function() { - circle.ry(12) - expect(circle.node.getAttribute('r')).toBe('12') - }) - it('gets the r attribute without and argument', function() { - circle.ry() - expect(circle.node.getAttribute('r')).toBe('120') - }) - }) - - describe('move()', function() { - it('sets the x and y position', function() { - circle.move(123, 456) - var box = circle.bbox() - expect(box.x).toBeCloseTo(123) - expect(box.y).toBe(456) - }) - }) - - describe('dx()', function() { - it('moves the x positon of the element relative to the current position', function() { - circle.move(50, 60) - circle.dx(100) - expect(circle.node.getAttribute('cx')).toBe('270') - }) - }) - - describe('dy()', function() { - it('moves the y positon of the element relative to the current position', function() { - circle.move(50, 60) - circle.dy(120) - expect(circle.node.getAttribute('cy')).toBe('300') - }) - }) - - describe('dmove()', function() { - it('moves the x and y positon of the element relative to the current position', function() { - circle.move(50,60) - circle.dmove(80, 25) - expect(circle.node.getAttribute('cx')).toBe('250') - expect(circle.node.getAttribute('cy')).toBe('205') - }) - }) - - describe('center()', function() { - it('sets the cx and cy position', function() { - circle.center(321,567) - var box = circle.bbox() - expect(box.cx).toBe(321) - expect(box.cy).toBe(567) - }) - }) - - describe('width()', function() { - it('sets the width and height of the element', function() { - circle.width(82) - expect(circle.node.getAttribute('r')).toBe('41') - }) - it('gets the width and height of the element if the argument is null', function() { - expect((circle.width() / 2).toString()).toBe(circle.node.getAttribute('r')) - }) - }) - - describe('height()', function() { - it('sets the height and width of the element', function() { - circle.height(1236) - expect(circle.node.getAttribute('r')).toBe('618') - }) - it('gets the height and width of the element if the argument is null', function() { - expect((circle.height() / 2).toString()).toBe(circle.node.getAttribute('r')) - }) - }) - - describe('size()', function() { - it('defines the r of the element', function() { - circle.size(987) - expect(circle.node.getAttribute('r')).toBe((987 / 2).toString()) - }) - }) - - describe('scale()', function() { - it('should scale the element universally with one argument', function() { - var box = circle.scale(2).rbox() - - expect(box.width).toBe(circle.attr('r') * 2 * 2) - expect(box.height).toBe(circle.attr('r') * 2 * 2) - }) - it('should scale the element over individual x and y axes with two arguments', function() { - var box = circle.scale(2, 3.5).rbox() - - expect(box.width).toBe(circle.attr('r') * 2 * 2) - expect(box.height).toBe(circle.attr('r') * 2 * 3.5) - }) - }) - - describe('translate()', function() { - it('sets the translation of an element', function() { - circle.transform({ tx: 12, ty: 12 }) - expect(window.matrixStringToArray(circle.node.getAttribute('transform'))).toEqual([1,0,0,1,12,12]) - }) - }) -}) diff --git a/spec/spec/clip.js b/spec/spec/clip.js deleted file mode 100644 index f333039..0000000 --- a/spec/spec/clip.js +++ /dev/null @@ -1,62 +0,0 @@ -describe('ClipPath', function() { - var rect, circle - - beforeEach(function() { - rect = draw.rect(100,100) - circle = draw.circle(100).move(50, 50) - rect.clipWith(circle) - }) - - afterEach(function() { - draw.clear() - }) - - it('moves the clipping element to a new clip node', function() { - expect(circle.parent() instanceof SVG.ClipPath).toBe(true) - }) - - it('creates the clip node in the defs node', function() { - expect(circle.parent().parent()).toBe(draw.defs()) - }) - - it('sets the "clip-path" attribute on the cliped element with the clip id', function() { - expect(rect.attr('clip-path')).toBe('url("#' + circle.parent().id() + '")') - }) - - it('references the clip element in the masked element', function() { - expect(rect.clipper()).toBe(circle.parent()) - }) - - it('references the clipped element in the clipPath target list', function() { - expect(rect.clipper().targets().indexOf(rect) > -1).toBe(true) - }) - - it('reuses clip element when clip was given', function() { - var clip = rect.clipper() - expect(draw.rect(100,100).clipWith(clip).clipper()).toBe(clip) - }) - - it('unclips all clipped elements when being removed', function() { - rect.clipper().remove() - expect(rect.attr('clip-path')).toBe(undefined) - }) - - describe('unclip()', function() { - - it('clears the "clip-path" attribute on the clipped element', function() { - rect.unclip() - expect(rect.attr('clip-path')).toBe(undefined) - }) - - it('removes the reference to the clipping element', function() { - rect.unclip() - expect(rect.clipper()).toBe(null) - }) - - it('returns the clipPath element', function() { - expect(rect.unclip()).toBe(rect) - }) - - }) - -})
\ No newline at end of file diff --git a/spec/spec/container.js b/spec/spec/container.js deleted file mode 100644 index 6f63ba5..0000000 --- a/spec/spec/container.js +++ /dev/null @@ -1,377 +0,0 @@ -describe('Container', function() { - - beforeEach(function() { - draw.clear() - }) - - describe('rect()', function() { - it('should increase children by 1', function() { - var initial = draw.children().length - draw.rect(100,100) - expect(draw.children().length).toBe(initial + 1) - }) - it('should create a rect', function() { - expect(draw.rect(100,100).type).toBe('rect') - }) - it('should create an instance of SVG.Rect', function() { - expect(draw.rect(100,100) instanceof SVG.Rect).toBe(true) - }) - it('should be an instance of SVG.Shape', function() { - expect(draw.rect(100,100) instanceof SVG.Shape).toBe(true) - }) - it('should be an instance of SVG.Element', function() { - expect(draw.rect(100,100) instanceof SVG.Element).toBe(true) - }) - }) - - describe('ellipse()', function() { - it('should increase children by 1', function() { - var initial = draw.children().length - draw.ellipse(100,100) - expect(draw.children().length).toBe(initial + 1) - }) - it('should create an ellipse', function() { - expect(draw.ellipse(100,100).type).toBe('ellipse') - }) - it('should create an instance of SVG.Ellipse', function() { - expect(draw.ellipse(100,100) instanceof SVG.Ellipse).toBe(true) - }) - it('should be an instance of SVG.Shape', function() { - expect(draw.ellipse(100,100) instanceof SVG.Shape).toBe(true) - }) - it('should be an instance of SVG.Element', function() { - expect(draw.ellipse(100,100) instanceof SVG.Element).toBe(true) - }) - }) - - describe('circle()', function() { - it('should increase children by 1', function() { - var initial = draw.children().length - draw.circle(100) - expect(draw.children().length).toBe(initial + 1) - }) - it('should create an circle', function() { - expect(draw.circle(100).type).toBe('circle') - }) - it('should create an instance of SVG.Circle', function() { - expect(draw.circle(100) instanceof SVG.Circle).toBe(true) - }) - it('should be an instance of SVG.Shape', function() { - expect(draw.circle(100) instanceof SVG.Shape).toBe(true) - }) - it('should be an instance of SVG.Element', function() { - expect(draw.circle(100) instanceof SVG.Element).toBe(true) - }) - }) - - describe('line()', function() { - it('should increase children by 1', function() { - var initial = draw.children().length - draw.line(0,100,100,0) - expect(draw.children().length).toBe(initial + 1) - }) - it('should create a line', function() { - expect(draw.line(0,100,100,0).type).toBe('line') - }) - it('should create an instance of SVG.Line', function() { - expect(draw.line(0,100,100,0) instanceof SVG.Line).toBe(true) - }) - it('should be an instance of SVG.Shape', function() { - expect(draw.line(0,100,100,0) instanceof SVG.Shape).toBe(true) - }) - it('should be an instance of SVG.Element', function() { - expect(draw.line(0,100,100,0) instanceof SVG.Element).toBe(true) - }) - }) - - describe('polyline()', function() { - it('should increase children by 1', function() { - var initial = draw.children().length - draw.polyline('0,0 100,0 100,100 0,100') - expect(draw.children().length).toBe(initial + 1) - }) - it('should create a polyline', function() { - expect(draw.polyline('0,0 100,0 100,100 0,100').type).toBe('polyline') - }) - it('should be an instance of SVG.Polyline', function() { - expect(draw.polyline('0,0 100,0 100,100 0,100') instanceof SVG.Polyline).toBe(true) - }) - it('should be an instance of SVG.Shape', function() { - expect(draw.polyline('0,0 100,0 100,100 0,100') instanceof SVG.Shape).toBe(true) - }) - it('should be an instance of SVG.Element', function() { - expect(draw.polyline('0,0 100,0 100,100 0,100') instanceof SVG.Element).toBe(true) - }) - }) - - describe('polygon()', function() { - it('should increase children by 1', function() { - var initial = draw.children().length - draw.polygon('0,0 100,0 100,100 0,100') - expect(draw.children().length).toBe(initial + 1) - }) - it('should create a polygon', function() { - expect(draw.polygon('0,0 100,0 100,100 0,100').type).toBe('polygon') - }) - it('should be an instance of SVG.Polygon', function() { - expect(draw.polygon('0,0 100,0 100,100 0,100') instanceof SVG.Polygon).toBe(true) - }) - it('should be an instance of SVG.Shape', function() { - expect(draw.polygon('0,0 100,0 100,100 0,100') instanceof SVG.Shape).toBe(true) - }) - it('should be an instance of SVG.Element', function() { - expect(draw.polygon('0,0 100,0 100,100 0,100') instanceof SVG.Element).toBe(true) - }) - }) - - describe('path()', function() { - it('should increase children by 1', function() { - var initial = draw.children().length - draw.path(svgPath) - expect(draw.children().length).toBe(initial + 1) - }) - it('should create a path', function() { - expect(draw.path(svgPath).type).toBe('path') - }) - it('should be an instance of SVG.Path', function() { - expect(draw.path(svgPath) instanceof SVG.Path).toBe(true) - }) - it('should be an instance of SVG.Shape', function() { - expect(draw.path(svgPath) instanceof SVG.Shape).toBe(true) - }) - it('should be an instance of SVG.Element', function() { - expect(draw.path(svgPath) instanceof SVG.Element).toBe(true) - }) - }) - - describe('image()', function() { - it('should increase children by 1', function() { - var initial = draw.children().length - draw.image(imageUrl) - expect(draw.children().length).toBe(initial + 1) - }) - it('should create a rect', function() { - expect(draw.image(imageUrl).type).toBe('image') - }) - it('should create an instance of SVG.Rect', function() { - expect(draw.image(imageUrl) instanceof SVG.Image).toBe(true) - }) - it('should be an instance of SVG.Shape', function() { - expect(draw.image(imageUrl) instanceof SVG.Shape).toBe(true) - }) - it('should be an instance of SVG.Element', function() { - expect(draw.image(imageUrl) instanceof SVG.Element).toBe(true) - }) - }) - - describe('text()', function() { - it('increases children by 1', function() { - var initial = draw.children().length - draw.text(loremIpsum) - expect(draw.children().length).toBe(initial + 1) - }) - it('creates a text element', function() { - expect(draw.text(loremIpsum).type).toBe('text') - }) - it('creates an instance of SVG.Text', function() { - expect(draw.text(loremIpsum) instanceof SVG.Text).toBe(true) - }) - it('is an instance of SVG.Shape', function() { - expect(draw.text(loremIpsum) instanceof SVG.Shape).toBe(true) - }) - it('is an instance of SVG.Element', function() { - expect(draw.text(loremIpsum) instanceof SVG.Element).toBe(true) - }) - }) - - describe('plain()', function() { - it('increases children by 1', function() { - var initial = draw.children().length - draw.plain(loremIpsum) - expect(draw.children().length).toBe(initial + 1) - }) - it('creates a plain element', function() { - expect(draw.plain(loremIpsum).type).toBe('text') - }) - it('creates an instance of SVG.Rect', function() { - expect(draw.plain(loremIpsum) instanceof SVG.Text).toBe(true) - }) - it('is an instance of SVG.Parent', function() { - expect(draw.plain(loremIpsum) instanceof SVG.Shape).toBe(true) - }) - it('is an instance of SVG.Element', function() { - expect(draw.plain(loremIpsum) instanceof SVG.Element).toBe(true) - }) - }) - - describe('clear()', function() { - it('removes all children except the parser if present', function() { - draw.rect(100,100) - draw.clear() - expect(draw.children().length).toBe(parserInDoc) - }) - it('creates a new defs node', function() { - var oldDefs = draw.defs() - draw.rect(100,100).maskWith(draw.circle(100, 100)) - draw.clear() - expect(draw.defs()).not.toBe(oldDefs) - }) - it('clears all children in the defs node', function() { - draw.rect(100,100).maskWith(draw.circle(100, 100)) - draw.clear() - expect(draw.defs().children().length).toBe(0) - }) - }) - - describe('each()', function() { - it('should iterate over all children', function() { - var children = [] - - draw.rect(100,100) - draw.ellipse(100, 100) - draw.polygon() - - draw.each(function() { - children.push(this.type) - }) - expect(children).toEqual((parserInDoc ? [parser[0].type] : []).concat(['rect', 'ellipse', 'polygon'])) - }) - it('should only include its own children', function() { - var children = [] - , group = draw.group() - - draw.rect(100,200) - draw.circle(300) - - group.rect(100,100) - group.ellipse(100, 100) - group.polygon() - - group.each(function() { - children.push(this) - }) - - expect(children).toEqual(group.children()) - }) - it('should traverse recursively when set to deep', function() { - var children = [] - , group = draw.group() - - draw.rect(100,200) - draw.circle(300) - - group.rect(100,100) - group.ellipse(100, 100) - group.polygon() - - draw.each(function() { - children.push(this) - }, true) - - expect(children.length).toEqual(draw.children().length + group.children().length + (parserInDoc ? parser[0].children().length : 0)) - }) - }) - - describe('get()', function() { - it('gets an element at a given index', function() { - draw.clear() - var rect = draw.rect(100,100) - var circle = draw.circle(100) - var line = draw.line(0,0,100,100) - expect(draw.get(0+parserInDoc)).toBe(rect) - expect(draw.get(1+parserInDoc)).toBe(circle) - expect(draw.get(2+parserInDoc)).toBe(line) - expect(draw.get(3+parserInDoc)).toBeNull() - }) - }) - - describe('first()', function() { - it('gets the first child', function() { - draw.clear() - var rect = draw.rect(100,100) - var circle = draw.circle(100) - var line = draw.line(0,0,100,100) - expect(draw.first()).toBe(parserInDoc ? parser[0] : rect) - }) - }) - - describe('last()', function() { - it('gets the last child', function() { - draw.clear() - var rect = draw.rect(100,100) - var circle = draw.circle(100) - var line = draw.line(0,0,100,100) - expect(draw.last()).toBe(line) - }) - }) - - describe('has()', function() { - it('determines if a given element is a child of the parent', function() { - var rect = draw.rect(100,100) - var circle = draw.circle(100) - var group = draw.group() - var line = group.line(0,0,100,100) - expect(draw.has(rect)).toBe(true) - expect(draw.has(circle)).toBe(true) - expect(draw.has(group)).toBe(true) - expect(draw.has(line)).toBe(false) - expect(group.has(line)).toBe(true) - }) - }) - - describe('index()', function() { - it('determines the index of given element', function() { - var rect = draw.rect(100,100) - var circle = draw.circle(100) - var group = draw.group() - var line = group.line(0,0,100,100) - expect(draw.index(rect)).toBe(0+parserInDoc) - expect(draw.index(circle)).toBe(1+parserInDoc) - expect(draw.index(group)).toBe(2+parserInDoc) - expect(draw.index(line)).toBe(-1) - expect(group.index(line)).toBe(0) - }) - }) - - describe('parent()', function() { - it('returns the parent element instance', function() { - var rect = draw.rect(100,100) - expect(rect.parent()).toBe(rect.node.parentNode.instance) - }) - }) - - describe('add()', function() { - it('adds element at the end of the parent element when no position given', function() { - var rect = draw.rect(100,100) - var line = draw.line(100,100, 50, 50) - var group = draw.group() - group.circle(10,10) - - expect(group.add(rect)).toBe(group) - expect(rect.position()).toBe(1) - }) - it('adds element at the given position', function() { - var rect = draw.rect(100,100) - var line = draw.line(100,100, 50, 50) - var group = draw.group() - group.circle(10,10) - - expect(group.add(rect)).toBe(group) - expect(group.add(line, 1)).toBe(group) - expect(line.position()).toBe(1) - }) - }) - - describe('put()', function() { - it('calls add() but returns added element', function() { - var rect = draw.rect(100,100) - var group = draw.group() - - spyOn(group, 'add') - - expect(group.put(rect, 0)).toBe(rect) - expect(group.add).toHaveBeenCalledWith(rect, 0) - }) - }) - -}) diff --git a/spec/spec/defs.js b/spec/spec/defs.js deleted file mode 100644 index 5e5da08..0000000 --- a/spec/spec/defs.js +++ /dev/null @@ -1,12 +0,0 @@ -describe('Defs', function() { - var defs - - beforeEach(function() { - defs = draw.defs() - }) - - it('creates an instance of SVG.Defs', function() { - expect(defs instanceof SVG.Defs).toBeTruthy() - }) - -})
\ No newline at end of file diff --git a/spec/spec/doc.js b/spec/spec/doc.js deleted file mode 100644 index 19dda04..0000000 --- a/spec/spec/doc.js +++ /dev/null @@ -1,66 +0,0 @@ -describe('Svg', function() { - - describe('create()', function(){ - it('doenst alter size when adopting width SVG()', function() { - var svg = SVG('#inlineSVG') - expect(svg.width()).toBe(0) - expect(svg.height()).toBe(0) - }) - }) - - it('is an instance of SVG.Container', function() { - expect(draw instanceof SVG.Container).toBe(true) - }) - - it('is an instance of SVG.Svg', function() { - expect(draw instanceof SVG.Svg).toBe(true) - }) - - it('returns itself as Svg when root', function() { - expect(draw.root()).toBe(draw) - }) - - it('has a defs element when root', function() { - expect(draw.defs() instanceof SVG.Defs).toBe(true) - }) - - describe('defs()', function() { - it('returns defs element', function(){ - expect(draw.defs()).toBe(draw.node.getElementsByTagName('defs')[0].instance) - }) - it('references parent node', function(){ - expect(draw.defs().parent()).toBe(draw) - }) - }) - - describe('isRoot()', function() { - it('returns true when the Svg is not attached to dom', function() { - expect(SVG().isRoot()).toBe(true) - }) - it('returns true when its outer element is not an svg element', function () { - expect(SVG().addTo(document.createElement('div')).isRoot()).toBe(true) - }) - it('returns true when its the root element of the dom', function () { - expect(draw.isRoot()).toBe(true) - }) - it('returns false when parent is svg element', function () { - expect(SVG().addTo(SVG()).isRoot()).toBe(false) - }) - }) - - describe('remove()', function() { - it('removes the Svg from the dom only if Svg is not root element', function() { - var cnt = window.document.querySelectorAll('svg').length - draw.remove() - if(parserInDoc){ - expect(window.document.querySelectorAll('svg').length).toBe(cnt) - }else{ - expect(window.document.querySelectorAll('svg').length).toBe(cnt-1) - } - - draw = SVG().addTo(drawing).size(100,100); - expect(window.document.querySelectorAll('svg').length).toBe(cnt) - }) - }) - -}) diff --git a/spec/spec/element.js b/spec/spec/element.js deleted file mode 100644 index 87f4481..0000000 --- a/spec/spec/element.js +++ /dev/null @@ -1,1090 +0,0 @@ -describe('Element', function () { - - beforeEach(function () { - draw.clear() - draw.attr('viewBox', null) - }) - - it('should create a circular reference on the node', function () { - var rect = draw.rect(100, 100) - expect(rect.node.instance).toBe(rect) - }) - - describe('attr()', function () { - var rect - - beforeEach(function () { - rect = draw.rect(100, 100) - }) - - afterEach(function () { - rect.remove() - // draw.defs().find('pattern').forEach(function(el) { el.remove() }) - draw.defs().clear() - }) - - it('sets one attribute when two arguments are given', function () { - rect.attr('fill', '#ff0066') - expect(rect.node.getAttribute('fill')).toBe('#ff0066') - }) - it('sets various attributes when an object is given', function () { - rect.attr({ fill: '#00ff66', stroke: '#ff2233', 'stroke-width': 10 }) - expect(rect.node.getAttribute('fill')).toBe('#00ff66') - expect(rect.node.getAttribute('stroke')).toBe('#ff2233') - expect(rect.node.getAttribute('stroke-width')).toBe('10') - }) - it('gets the value of the string value given as first argument', function () { - rect.attr('fill', '#ff0066') - expect(rect.attr('fill')).toEqual('#ff0066') - }) - it('gets an object with all attributes without any arguments', function () { - rect.attr({ fill: '#00ff66', stroke: '#ff2233' }) - var attr = rect.attr() - expect(attr.fill).toBe('#00ff66') - expect(attr.stroke).toBe('#ff2233') - }) - it('removes an attribute if the second argument is explicitly set to null', function () { - rect.attr('stroke-width', 10) - expect(rect.node.getAttribute('stroke-width')).toBe('10') - rect.attr('stroke-width', null) - expect(rect.node.getAttribute('stroke-width')).toBe(null) - }) - it('correctly parses numeric values as a getter', function () { - rect.attr('stroke-width', 11) - expect(rect.node.getAttribute('stroke-width')).toBe('11') - expect(rect.attr('stroke-width')).toBe(11) - }) - it('correctly parses negative numeric values as a getter', function () { - rect.attr('x', -120) - expect(rect.node.getAttribute('x')).toBe('-120') - expect(rect.attr('x')).toBe(-120) - }) - it('falls back on default values if attribute is not present', function () { - expect(rect.attr('stroke-linejoin')).toBe('miter') - }) - it('gets the "style" attribute as a string', function () { - rect.css('cursor', 'pointer') - expect(rect.node.style.cursor).toBe('pointer') - }) - it('sets the style attribute correctly', function () { - rect.attr('style', 'cursor:move;') - expect(rect.node.style.cursor).toBe('move') - }) - it('acts as a global getter when no arguments are given', function () { - rect.fill('#ff0066') - expect(rect.attr().fill).toBe('#ff0066') - }) - it('correctly parses numeric values as a global getter', function () { - rect.stroke({ width: 20 }) - expect(rect.attr()['stroke-width']).toBe(20) - }) - it('correctly parses negative numeric values as a global getter', function () { - rect.x(-30) - expect(rect.attr().x).toBe(-30) - }) - it('leaves unit values alone as a global getter', function () { - rect.attr('x', '69%') - expect(rect.attr().x).toBe('69%') - }) - it('acts as getter for an array of values passed', function () { - rect.attr({ - x: 1, - y: 2, - width: 20, - 'fill-opacity': 0.5 - }) - - expect(rect.attr([ 'x', 'fill-opacity' ])).toEqual(jasmine.objectContaining({ - x: 1, - 'fill-opacity': 0.5 - })) - }) - it('creates an image in defs when image path is specified for fill', function () { - rect.attr('fill', imageUrl) - expect(draw.defs().find('pattern').length).toBe(1) - expect(draw.defs().find('pattern image').length).toBe(1) - expect(draw.defs().find('pattern image')[0].attr('href')).toBe(imageUrl) - }) - it('creates pattern in defs when image object is specified for fill', function () { - rect.attr('fill', new SVG.Image().load(imageUrl)) - expect(draw.defs().find('pattern').length).toBe(1) - expect(draw.defs().find('pattern image').length).toBe(1) - expect(draw.defs().find('pattern image')[0].attr('href')).toBe(imageUrl) - }) - it('correctly creates SVG.Array if array given', function () { - rect.attr('something', [ 2, 3, 4 ]) - expect(rect.attr('something')).toBe('2 3 4') - }) - it('redirects to the leading() method when setting leading', function () { - var text = draw.text(loremIpsum) - spyOn(text, 'leading') - - text.attr('leading', 2) - expect(text.leading).toHaveBeenCalled() - text.remove() - }) - }) - - describe('id()', function () { - var rect - - beforeEach(function () { - rect = draw.rect(100, 100) - }) - - it('generates an id when getting if no id is set on the element', function () { - expect(rect.attr('id')).toBe(undefined) - expect(rect.id()).not.toBe(null) - expect(rect.node.id).not.toBe(null) - }) - // it('increases the global id sequence', function() { - // var did = SVG.did - // rect.id() - // - // expect(did + 1).toBe(SVG.did) - // }) - it('adds a unique id containing the node name', function () { - rect.id() - - expect(rect.attr('id').includes('Rect')).toBe(true) - }) - it('gets the value if the id attribute without an argument', function () { - expect(rect.id()).toBe(rect.attr('id')) - }) - it('sets the value of the id', function () { - rect.id('new_id') - expect(rect.id()).toBe('new_id') - }) - }) - - describe('css()', function () { - it('sets the style with key and value arguments', function () { - var rect = draw.rect(100, 100).css('cursor', 'crosshair') - expect(window.stripped(rect.node.style.cssText)).toBe('cursor:crosshair') - }) - it('sets multiple styles with an object as the first argument', function () { - var rect = draw.rect(100, 100).css({ cursor: 'help', display: 'block' }) - expect(window.stripped(rect.node.style.cssText)).toMatch(/cursor:help/) - expect(window.stripped(rect.node.style.cssText)).toMatch(/display:block/) - expect(window.stripped(rect.node.style.cssText).length).toBe(('display:block;cursor:help').length) - }) - it('gets a style with a string key as the first argument', function () { - var rect = draw.rect(100, 100).css({ cursor: 'progress', display: 'block' }) - expect(rect.css('cursor')).toBe('progress') - }) - it('gets multiple sytyles with array as first argument', function () { - var rect = draw.rect(100, 100).css({ cursor: 'progress', display: 'block' }) - expect(rect.css([ 'cursor', 'display' ])).toEqual({ cursor: 'progress', display: 'block' }) - }) - it('gets an object with all styles with zero arguments', function () { - var rect = draw.rect(100, 100).css({ cursor: 's-resize', display: 'none' }) - expect(rect.css()).toEqual({ cursor: 's-resize', display: 'none' }) - }) - it('removes a style if the value is an empty string', function () { - var rect = draw.rect(100, 100).css({ cursor: 'n-resize', display: '' }) - expect(rect.css('display')).toBe('') - }) - it('removes a style if the value explicitly set to null', function () { - var rect = draw.rect(100, 100).css('cursor', 'w-resize') - expect(rect.css()).toEqual({ cursor: 'w-resize' }) - rect.css('cursor', null) - expect(rect.css('cursor')).toBe('') - }) - }) - - describe('transform()', function () { - var rect, ctm - - beforeEach(function () { - rect = draw.rect(100, 100) - }) - - it('gets the current transformation matrix', function () { - expect(rect.transform()).toEqual(jasmine.objectContaining({ - a: 1, - b: 0, - c: 0, - d: 1, - e: 0, - f: 0, - scaleX: 1, - scaleY: 1, - shear: 0, - rotate: 0, - translateX: 0, - translateY: 0 - })) - }) - it('sets the translation of and element', function () { - rect.transform({ translate: [ 10, 11 ] }) - expect(window.matrixStringToArray(rect.node.getAttribute('transform'))).toEqual([ 1, 0, 0, 1, 10, 11 ]) - }) - it('performs an absolute translation', function () { - rect.transform({ translate: [ 10, 11 ] }).transform({ translate: [ 20, 21 ] }) - expect(window.matrixStringToArray(rect.node.getAttribute('transform'))).toEqual([ 1, 0, 0, 1, 20, 21 ]) - }) - it('performs a relative translation with relative flag', function () { - rect.transform({ translate: [ 10, 11 ] }).transform({ translate: [ 20, 21 ] }, true) - expect(window.matrixStringToArray(rect.node.getAttribute('transform'))).toEqual([ 1, 0, 0, 1, 30, 32 ]) - }) - it('sets the scaleX and scaleY of an element', function () { - rect.transform({ scaleX: 0.5, scaleY: 2 }) - expect(window.matrixStringToArray(rect.node.getAttribute('transform'))).toEqual([ 0.5, 0, 0, 2, 25, -50 ]) - }) - it('performs a uniform scale with scale given', function () { - rect.transform({ scale: 3 }) - expect(window.matrixStringToArray(rect.node.getAttribute('transform'))).toEqual([ 3, 0, 0, 3, -100, -100 ]) - }) - it('also works with only skaleX', function () { - rect.transform({ scaleX: 3 }) - expect(window.matrixStringToArray(rect.node.getAttribute('transform'))).toEqual([ 3, 0, 0, 1, -100, 0 ]) - }) - it('also works with only skaleY', function () { - rect.transform({ scaleY: 3 }) - expect(window.matrixStringToArray(rect.node.getAttribute('transform'))).toEqual([ 1, 0, 0, 3, 0, -100 ]) - }) - - it('performs an absolute scale by default', function () { - rect.transform({ scale: 3 }).transform({ scale: 0.5 }) - expect(window.matrixStringToArray(rect.node.getAttribute('transform'))).toEqual([ 0.5, 0, 0, 0.5, 25, 25 ]) - }) - it('performs a relative scale with a relative flag', function () { - rect.transform({ scaleX: 0.5, scaleY: 2 }).transform({ scaleX: 3, scaleY: 4 }, true) - expect(window.matrixStringToArray(rect.node.getAttribute('transform'))).toEqual([ 1.5, 0, 0, 8, -25, -350 ]) - }) - it('sets the skewX of an element with center on the element', function () { - ctm = rect.transform({ skewX: 10 }).ctm() - expect(ctm.a).toBe(1) - expect(ctm.b).toBe(0) - expect(ctm.c).toBeCloseTo(0.17632698070846498) - expect(ctm.d).toBe(1) - expect(ctm.e).toBeCloseTo(-8.81634903542325) - expect(ctm.f).toBe(0) - }) - it('sets the skewX of an element with given center', function () { - ctm = rect.transform({ skewX: 10, ox: 0, oy: 0 }).ctm() - expect(ctm.a).toBe(1) - expect(ctm.b).toBe(0) - expect(ctm.c).toBeCloseTo(0.17632698070846498) - expect(ctm.d).toBe(1) - expect(ctm.e).toBe(0) - expect(ctm.f).toBe(0) - }) - it('sets the skewY of an element', function () { - ctm = rect.transform({ skewY: -10, ox: 0, oy: 0 }).ctm() - expect(ctm.a).toBe(1) - expect(ctm.b).toBeCloseTo(-0.17632698070846498) - expect(ctm.c).toBe(0) - expect(ctm.d).toBe(1) - expect(ctm.e).toBe(0) - expect(ctm.f).toBe(0) - }) - it('sets the skewX and skewY of an element', function () { - ctm = rect.transform({ skewX: 10, skewY: -10, ox: 0, oy: 0 }).ctm() - expect(ctm.a).toBe(1) - expect(ctm.b).toBeCloseTo(-0.17632698070846498) - expect(ctm.c).toBeCloseTo(0.17632698070846498) - expect(ctm.d).toBe(1) - expect(ctm.e).toBe(0) - expect(ctm.f).toBe(0) - }) - it('performs a uniform skew with skew given', function () { - ctm = rect.transform({ skew: 5, ox: 0, oy: 0 }).ctm() - expect(ctm.a).toBe(1) - expect(ctm.b).toBeCloseTo(0.08748866352592401) - expect(ctm.c).toBeCloseTo(0.08748866352592401) - expect(ctm.d).toBe(1) - expect(ctm.e).toBe(0) - expect(ctm.f).toBe(0) - }) - it('rotates the element around its centre if no rotation point is given', function () { - ctm = rect.center(100, 100).transform({ rotate: 45 }).ctm() - expect(ctm.a).toBeCloseTo(0.7071068286895752) - expect(ctm.b).toBeCloseTo(0.7071068286895752) - expect(ctm.c).toBeCloseTo(-0.7071068286895752) - expect(ctm.d).toBeCloseTo(0.7071068286895752) - expect(ctm.e).toBeCloseTo(100) - expect(ctm.f).toBeCloseTo(-41.421356201171875) - }) - it('rotates the element around the given rotation point', function () { - ctm = rect.transform({ rotate: 55, origin: [ 80, 2 ] }).ctm() - expect(ctm.a).toBeCloseTo(0.5735765099525452) - expect(ctm.b).toBeCloseTo(0.8191521167755127) - expect(ctm.c).toBeCloseTo(-0.8191521167755127) - expect(ctm.d).toBeCloseTo(0.5735765099525452) - expect(ctm.e).toBeCloseTo(35.75218963623047) - expect(ctm.f).toBeCloseTo(-64.67931365966797) - }) - it('transforms element using a matrix', function () { - rect.transform({ a: 0.5, c: 0.5 }) - expect(window.matrixStringToArray(rect.node.getAttribute('transform'))).toEqual([ 0.5, 0, 0.5, 1, 0, 0 ]) - }) - it('transforms relative using a matrix', function () { - rect.transform({ a: 0.5, c: 0.5 }).transform(new SVG.Matrix({ e: 20, f: 20 }), true) - expect(window.matrixStringToArray(rect.node.getAttribute('transform'))).toEqual([ 0.5, 0, 0.5, 1, 20, 20 ]) - }) - it('flips the element on x axis', function () { - rect.transform({ flip: 'x' }) - expect(window.matrixStringToArray(rect.node.getAttribute('transform'))).toEqual([ -1, 0, 0, 1, 100, 0 ]) - }) - it('flips the element on x axis with offset', function () { - rect.transform({ flip: 'x', origin: [ 20, 0 ] }) - expect(window.matrixStringToArray(rect.node.getAttribute('transform'))).toEqual([ -1, 0, 0, 1, 40, 0 ]) - }) - it('flips the element on y axis with offset', function () { - rect.transform({ flip: 'y', origin: [ 0, 20 ] }) - expect(window.matrixStringToArray(rect.node.getAttribute('transform'))).toEqual([ 1, 0, 0, -1, 0, 40 ]) - }) - it('flips the element on both axis with offset', function () { - rect.transform({ flip: 'both', origin: [ 20, 20 ] }) - expect(window.matrixStringToArray(rect.node.getAttribute('transform'))).toEqual([ -1, 0, 0, -1, 40, 40 ]) - }) - it('flips the element on both axis', function () { - rect.transform({ flip: 'both' }) - expect(window.matrixStringToArray(rect.node.getAttribute('transform'))).toEqual([ -1, 0, 0, -1, 100, 100 ]) - }) - }) - - describe('untransform()', function () { - var circle - - beforeEach(function () { - circle = draw.circle(100).translate(50, 100) - }) - - it('removes the transform attribute', function () { - expect(window.matrixStringToArray(circle.node.getAttribute('transform'))).toEqual([ 1, 0, 0, 1, 50, 100 ]) - circle.untransform() - expect(circle.node.getAttribute('transform')).toBeNull() - }) - it('resets the current transform matix', function () { - expect(circle.ctm()).toEqual(new SVG.Matrix(1, 0, 0, 1, 50, 100)) - circle.untransform() - expect(circle.ctm()).toEqual(new SVG.Matrix()) - }) - }) - - describe('matrixify', function () { - var rect - - beforeEach(function () { - rect = draw.rect(100, 100) - }) - - it('allow individual transform definitions to be separated by whitespace', function () { - // One space - rect.attr('transform', 'translate(20) translate(20)') - expect(rect.matrixify().toString()).toBe('matrix(1,0,0,1,40,0)') - - // More than one space - rect.attr('transform', 'translate(20) translate(-60)') - expect(rect.matrixify().toString()).toBe('matrix(1,0,0,1,-40,0)') - }) - - it('allow individual transform definitions to be separated by a comma', function () { - rect.attr('transform', 'translate(20,16),translate(20)') - expect(rect.matrixify().toString()).toBe('matrix(1,0,0,1,40,16)') - }) - - it('allow individual transform definitions to be separated by whitespace and a comma', function () { - // Spaces before the comma - rect.attr('transform', 'translate(20,16) ,translate(20)') - expect(rect.matrixify().toString()).toBe('matrix(1,0,0,1,40,16)') - - // Spaces after the comma - rect.attr('transform', 'translate(12), translate(10,14)') - expect(rect.matrixify().toString()).toBe('matrix(1,0,0,1,22,14)') - - // Spaces before and after the comma - rect.attr('transform', 'translate(24,14) , translate(36,6)') - expect(rect.matrixify().toString()).toBe('matrix(1,0,0,1,60,20)') - }) - - it('merges non-commutative transformations correctly', function () { - // Spaces before the comma - rect.attr('transform', 'scale(3, 2) translate(20,16)') - expect(rect.matrixify().toString()).toBe('matrix(3,0,0,2,60,32)') - }) - - it('doesn\'t care if you have matrices there', function () { - // Spaces before the comma - rect.attr('transform', 'matrix(3, 0, 0, 2, 0, 0) translate(20,16)') - expect(rect.matrixify().toString()).toBe('matrix(3,0,0,2,60,32)') - }) - - }) - - describe('toParent()', function () { - var nested, g1, g2, rect1 - - beforeEach(function () { - nested = draw.nested() - g1 = nested.group().translate(20, 20) - g2 = g1.group().translate(100, 100) - rect1 = g2.rect(100, 100).scale(2) - rect2 = nested.rect(100, 100).scale(0.5) - }) - - afterEach(function () { - draw.clear() - }) - - it('returns itself when given parent and it is the same', function () { - expect(g2.toParent(g2)).toBe(g2) - }) - - it('moves the element to other parent while maintaining the same visal representation', function () { - expect(window.roundMatrix(rect1.toParent(nested).matrix())) - .toEqual(new SVG.Matrix(2, 0, 0, 2, 70, 70)) - expect(rect1.parent()).toEqual(nested) - expect(window.roundMatrix(rect2.toParent(g2).matrix())) - .toEqual(new SVG.Matrix(0.5, 0, 0, 0.5, -95, -95)) - expect(rect2.parent()).toEqual(g2) - }) - }) - - describe('toRoot()', function () { - var nested, g1, g2, rect - - beforeEach(function () { - rect = draw.rect(100, 100) - spyOn(rect, 'toParent') - }) - - afterEach(function () { - draw.clear() - }) - - it('redirects to toParent(root)', function () { - rect.toRoot() - expect(rect.toParent).toHaveBeenCalledWith(rect.root(), undefined) - }) - }) - - // FIXME - // describe('flatten()', function() { - // var nested, g1, g2, rect1 - // - // beforeEach(function() { - // draw.defs() - // nested = draw.nested() - // g1 = nested.group().translate(20, 20) - // g2 = g1.group().translate(100, 100) - // rect1 = g2.rect(100,100).scale(2) - // rect2 = g1.rect(100,100).scale(0.5) - // }) - // - // afterEach(function() { - // draw.clear() - // }) - // - // it('returns itself when depths is 0 or this is SVG.Defs', function() { - // expect(draw.defs().flatten()).toBe(draw.defs()) - // expect(g1.flatten(null, 0)).toBe(g1) - // }) - // - // it('breaks up all container and move the elements to the parent', function() { - // g1.flatten() - // expect(rect1.parent()).toBe(nested) - // expect(rect2.parent()).toBe(nested) - // - // expect(g1.node.parentNode).toBeFalsy() - // expect(g2.node.parentNode).toBeFalsy() - // - // expect(window.roundMatrix(rect1.matrix())).toEqual(new SVG.Matrix(2, 0, 0, 2, 70, 70)) - // expect(window.roundMatrix(rect2.matrix())).toEqual(new SVG.Matrix(0.5, 0, 0, 0.5, 45, 45)) - // }) - // - // it('ungroups everything to the doc root when called on SVG.Doc / does not ungroup defs/parser', function() { - // draw.flatten() - // - // expect(rect1.parent()).toBe(draw) - // expect(rect2.parent()).toBe(draw) - // - // expect(g1.node.parentNode).toBeFalsy() - // expect(g2.node.parentNode).toBeFalsy() - // expect(nested.node.parentNode).toBeFalsy() - // - // expect(window.roundMatrix(rect1.matrix())).toEqual(new SVG.Matrix(2, 0, 0, 2, 70, 70)) - // expect(window.roundMatrix(rect2.matrix())).toEqual(new SVG.Matrix(0.5, 0, 0, 0.5, 45, 45)) - // - // expect(draw.children().length).toBe(3+parserInDoc) // 2 * rect + defs - // }) - // }) - - describe('ctm()', function () { - var rect - - beforeEach(function () { - rect = draw.rect(100, 100) - }) - - it('gets the current transform matrix of the element', function () { - rect.translate(10, 20) - expect(rect.ctm().toString()).toBe('matrix(1,0,0,1,10,20)') - }) - it('returns an instance of SVG.Matrix', function () { - expect(rect.ctm() instanceof SVG.Matrix).toBeTruthy() - }) - }) - - describe('data()', function () { - it('sets a data attribute and convert value to json', function () { - var rect = draw.rect(100, 100).data('test', 'value') - expect(rect.node.getAttribute('data-test')).toBe('value') - }) - it('sets a data attribute and not convert value to json if flagged raw', function () { - var rect = draw.rect(100, 100).data('test', 'value', true) - expect(rect.node.getAttribute('data-test')).toBe('value') - }) - it('sets multiple data attributes and convert values to json when an object is passed', function () { - var rect = draw.rect(100, 100).data({ - forbidden: 'fruit', - multiple: { - values: 'in', - an: 'object' - } - }) - expect(rect.node.getAttribute('data-forbidden')).toBe('fruit') - expect(rect.node.getAttribute('data-multiple')).toEqual('{"values":"in","an":"object"}') - }) - it('gets data value if only one argument is passed', function () { - var rect = draw.rect(100, 100).data('test', 101) - expect(rect.data('test')).toBe(101) - }) - it('gets the raw value when value is no valid json', function () { - var rect = draw.rect(100, 100).data('test', '{["sd":12}]', true) - expect(rect.data('test')).toBe('{["sd":12}]') - }) - it('removes data when null given', function () { - var rect = draw.rect(100, 100).data('test', '{"sd":12}', true) - expect(rect.data('test', null).attr('data-test')).toBeFalsy() - }) - it('maintains data type for a number', function () { - var rect = draw.rect(100, 100).data('test', 101) - expect(typeof rect.data('test')).toBe('number') - }) - it('maintains data type for an object', function () { - var rect = draw.rect(100, 100).data('test', { string: 'value', array: [ 1, 2, 3 ] }) - expect(typeof rect.data('test')).toBe('object') - expect(Array.isArray(rect.data('test').array)).toBe(true) - }) - }) - - describe('remove()', function () { - it('removes an element and return it', function () { - var rect = draw.rect(100, 100) - expect(rect.remove()).toBe(rect) - }) - it('removes an element from its parent', function () { - var rect = draw.rect(100, 100) - rect.remove() - expect(draw.has(rect)).toBe(false) - }) - }) - - describe('addTo()', function () { - it('adds an element to a given parent and returns itself', function () { - var rect = draw.rect(100, 100) - var group = draw.group() - - expect(rect.addTo(group)).toBe(rect) - expect(rect.parent()).toBe(group) - }) - }) - - describe('putIn()', function () { - it('adds an element to a given parent and returns parent', function () { - var rect = draw.rect(100, 100) - var group = draw.group() - - expect(rect.putIn(group)).toBe(group) - expect(rect.parent()).toBe(group) - }) - }) - - describe('rbox()', function () { - it('returns an instance of SVG.Box', function () { - var rect = draw.rect(100, 100) - expect(rect.rbox() instanceof SVG.Box).toBe(true) - }) - it('returns the correct rectangular box', function () { - // stroke has to be set in order to get the correct result when calling getBoundingClientRect in IE11 - var rect = draw.size(200, 150).viewbox(0, 0, 200, 150).rect(105, 210).move(2, 12)// .stroke({width:0}) - var box = rect.rbox(draw) - expect(box.x).toBeCloseTo(2) - expect(box.y).toBeCloseTo(12) - expect(box.cx).toBeCloseTo(54.5) - expect(box.cy).toBeCloseTo(117) - expect(box.width).toBeCloseTo(105) - expect(box.height).toBeCloseTo(210) - }) - }) - - describe('root()', function () { - it('returns the parent document', function () { - var rect = draw.rect(100, 100) - expect(rect.root()).toBe(draw) - }) - }) - - describe('parent()', function () { - it('contains the parent svg', function () { - var rect = draw.rect(100, 100) - expect(rect.parent()).toBe(draw) - }) - it('contains the parent group when in a group', function () { - var group = draw.group() - var rect = group.rect(100, 100) - expect(rect.parent()).toBe(group) - }) - it('contains the parent which matches type', function () { - var group = draw.group() - var rect = group.rect(100, 100) - expect(rect.parent(SVG.Svg)).toBe(draw) - }) - it('contains the parent which matches selector', function () { - var group1 = draw.group().addClass('test') - var group2 = group1.group() - var rect = group2.rect(100, 100) - expect(rect.parent('.test')).toBe(group1) - }) - }) - - describe('parents()', function () { - it('returns array of parents until the passed element or root svg', function () { - var group1 = draw.group().addClass('test') - var group2 = group1.group() - var group3 = group2.group() - var rect = group3.rect(100, 100) - - expect(rect.parents('.test')).toEqual([ group3, group2, group1 ]) - expect(rect.parents(group2)).toEqual([ group3, group2 ]) - expect(rect.parents(group1).length).toBe(3) - }) - }) - - describe('clone()', function () { - var rect, group, circle - - beforeEach(function () { - rect = draw.rect(100, 100).center(321, 567).fill('#f06') - group = draw.group().add(rect) - circle = group.circle(100) - }) - - it('makes an exact copy of the element', function () { - clone = rect.clone() - expect(clone.attr('id', null).attr()).toEqual(rect.attr('id', null).attr()) - }) - it('assigns a new id to the cloned element', function () { - clone = rect.clone() - expect(clone.id()).not.toBe(rect.id()) - }) - it('copies all child nodes as well', function () { - clone = group.clone() - expect(clone.children().length).toBe(group.children().length) - }) - it('assigns a new id to cloned child elements', function () { - clone = group.clone() - expect(clone.id()).not.toEqual(group.id()) - expect(clone.get(0).id()).not.toBe(group.get(0).id()) - expect(clone.get(1).id()).not.toBe(group.get(1).id()) - }) - it('deep copies over dom data', function () { - group.dom = { foo: 'bar' } - rect.dom = { foo: 'baz' } - clone = group.clone() - expect(clone.dom.foo).toBe('bar') - expect(clone.get(0).dom.foo).toBe('baz') - }) - }) - - describe('toString()', function () { - it('returns the element id', function () { - var rect = draw.rect(100, 100).center(321, 567).fill('#f06') - expect(rect + '').toBe(rect.id()) - }) - }) - - describe('replace()', function () { - it('replaces the original element by another given element', function () { - var rect = draw.rect(100, 100).center(321, 567).fill('#f06') - var circle = draw.circle(200) - var rectIndex = draw.children().indexOf(rect) - - rect.replace(circle) - - expect(rectIndex).toBe(draw.children().indexOf(circle)) - }) - it('removes the original element', function () { - var rect = draw.rect(100, 100).center(321, 567).fill('#f06') - - rect.replace(draw.circle(200)) - - expect(draw.has(rect)).toBe(false) - }) - it('returns the new element', function () { - var circle = draw.circle(200) - var element = draw.rect(100, 100).center(321, 567).fill('#f06').replace(circle) - - expect(element).toBe(circle) - }) - }) - - describe('classes()', function () { - it('returns an array of classes on the node', function () { - var element = draw.rect(100, 100) - element.node.setAttribute('class', 'one two') - expect(element.classes()).toEqual([ 'one', 'two' ]) - }) - }) - - describe('hasClass()', function () { - it('returns true if the node has the class', function () { - var element = draw.rect(100, 100) - element.node.setAttribute('class', 'one') - expect(element.hasClass('one')).toBeTruthy() - }) - - it('returns false if the node does not have the class', function () { - var element = draw.rect(100, 100) - element.node.setAttribute('class', 'one') - expect(element.hasClass('two')).toBeFalsy() - }) - }) - - describe('addClass()', function () { - it('adds the class to the node', function () { - var element = draw.rect(100, 100) - element.addClass('one') - expect(element.hasClass('one')).toBeTruthy() - }) - - it('does not add duplicate classes', function () { - var element = draw.rect(100, 100) - element.addClass('one') - element.addClass('one') - expect(element.node.getAttribute('class')).toEqual('one') - }) - - it('returns the svg instance', function () { - var element = draw.rect(100, 100) - expect(element.addClass('one')).toEqual(element) - }) - }) - - describe('removeClass()', function () { - it('removes the class from the node when the class exists', function () { - var element = draw.rect(100, 100) - element.addClass('one') - element.removeClass('one') - expect(element.hasClass('one')).toBeFalsy() - }) - - it('does nothing when the class does not exist', function () { - var element = draw.rect(100, 100) - element.removeClass('one') - expect(element.hasClass('one')).toBeFalsy() - }) - - it('returns the element', function () { - var element = draw.rect(100, 100) - expect(element.removeClass('one')).toEqual(element) - }) - }) - - describe('toggleClass()', function () { - it('adds the class when it does not already exist', function () { - var element = draw.rect(100, 100) - element.toggleClass('one') - expect(element.hasClass('one')).toBeTruthy() - }) - it('removes the class when it already exists', function () { - var element = draw.rect(100, 100) - element.addClass('one') - element.toggleClass('one') - expect(element.hasClass('one')).toBeFalsy() - }) - it('returns the svg instance', function () { - var element = draw.rect(100, 100) - expect(element.toggleClass('one')).toEqual(element) - }) - }) - - describe('reference()', function () { - it('gets a referenced element from a given attribute', function () { - var rect = draw.defs().rect(100, 100) - var use = draw.use(rect) - var mark = draw.marker(10, 10) - var path = draw.path(svgPath).marker('end', mark) - - expect(use.reference('href')).toBe(rect) - expect(path.reference('marker-end')).toBe(mark) - }) - }) - - describe('svg()', function () { - describe('without an argument', function () { - it('returns full raw svg when called on the root svg', function () { - draw.size(100, 100).rect(100, 100).id(null) - draw.circle(100).fill('#f06').id(null) - - var toBeTested = draw.svg() - - // Test for different browsers namely Firefox and Chrome - expect( - // IE - toBeTested === '<svg xmlns:svgjs="http://svgjs.com/svgjs" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" xmlns="http://www.w3.org/2000/svg" height="100" width="100"><rect height="100" width="100"></rect><circle fill="#ff0066" cy="50" cx="50" r="50"></circle></svg>' - - // Firefox - || toBeTested === '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs" width="100" height="100"><rect width="100" height="100"></rect><circle r="50" cx="50" cy="50" fill="#ff0066"></circle></svg>' - - // svgdom - || toBeTested === '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs" width="100" height="100"><svg id="SvgjsSvg1002" width="2" height="0" style="overflow: hidden; top: -100%; left: -100%; position: absolute; opacity: 0"><polyline id="SvgjsPolyline1003" points="10,10 20,10 30,10"></polyline><path id="SvgjsPath1004" d="M80 80A45 45 0 0 0 125 125L125 80Z "></path></svg><rect width="100" height="100"></rect><circle r="50" cx="50" cy="50" fill="#ff0066"></circle></svg>' - ).toBeTruthy() - - }) - it('returns partial raw svg when called on a sub group', function () { - var group = draw.group().id(null) - group.rect(100, 100).id(null) - group.circle(100).fill('#f06').id(null) - - var toBeTested = group.svg() - - expect( - toBeTested === '<g><rect width="100" height="100"></rect><circle r="50" cx="50" cy="50" fill="#ff0066"></circle></g>' - || toBeTested === '<g><rect height="100" width="100"></rect><circle fill="#ff0066" cy="50" cx="50" r="50"></circle></g>' - || toBeTested === '<g xmlns="http://www.w3.org/2000/svg"><rect width="100" height="100"></rect><circle r="50" cx="50" cy="50" fill="#ff0066"></circle></g>' - ).toBeTruthy() - }) - it('returns a single element when called on an element', function () { - var group = draw.group().id(null) - group.rect(100, 100).id(null) - var circle = group.circle(100).fill('#f06').id(null) - var toBeTested = circle.svg() - - expect( - toBeTested === '<circle r="50" cx="50" cy="50" fill="#ff0066"></circle>' - || toBeTested === '<circle fill="#ff0066" cy="50" cx="50" r="50"></circle>' - || toBeTested === '<circle xmlns="http://www.w3.org/2000/svg" r="50" cx="50" cy="50" fill="#ff0066"></circle>' - ).toBeTruthy() - }) - }) - describe('with raw svg given', function () { - it('imports a full svg document', function () { - draw.svg('<svg id="SvgjsSvg1000" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="100" height="100" viewBox="0 0 50 50"><rect id="SvgjsRect1183" width="100" height="100"></rect><circle id="SvgjsCircle1184" r="50" cx="25" cy="25" fill="#ff0066"></circle></svg>') - - expect(draw.get(0 + parserInDoc).type).toBe('svg') - expect(draw.get(0 + parserInDoc).children().length).toBe(2) - expect(draw.get(0 + parserInDoc).get(0).type).toBe('rect') - expect(draw.get(0 + parserInDoc).get(1).type).toBe('circle') - expect(draw.get(0 + parserInDoc).get(1).attr('fill')).toBe('#ff0066') - }) - it('imports partial svg content', function () { - draw.svg('<g id="SvgjsG1185"><rect id="SvgjsRect1186" width="100" height="100"></rect><circle id="SvgjsCircle1187" r="50" cx="25" cy="25" fill="#ff0066"></circle></g>') - expect(draw.get(0 + parserInDoc).type).toBe('g') - expect(draw.get(0 + parserInDoc).get(0).type).toBe('rect') - expect(draw.get(0 + parserInDoc).get(1).type).toBe('circle') - expect(draw.get(0 + parserInDoc).get(1).attr('fill')).toBe('#ff0066') - }) - }) - describe('with a modifier function', function () { - var rect, circle, group - beforeEach(function () { - rect = draw.rect(10, 10) - circle = draw.circle(20, 20) - group = draw.group() - - group.add(rect) - group.add(circle) - }) - - it('executes the modifier', function () { - var result = group.svg(function (instance) { - instance.addClass('test') - }) - - expect( - result === '<g class="test"><rect width="10" height="10" class="test"></rect><circle r="10" cx="10" cy="10" class="test"></circle></g>' - || result === '<g class="test"><rect height="10" width="10" class="test"></rect><circle r="10" cx="10" cy="10" class="test"></circle></g>' - || result === '<g class="test" xmlns="http://www.w3.org/2000/svg"><rect width="10" height="10" class="test"></rect><circle r="10" cx="10" cy="10" class="test"></circle></g>' - ).toBeTruthy() - }) - - it('execute the modifier to replace the node', function () { - var result = group.svg(function (instance) { - if (instance instanceof SVG.Circle) { - return draw.rect(15, 15) - } - }) - - expect( - result === '<g><rect width="10" height="10"></rect><rect width="15" height="15"></rect></g>' - || result === '<g><rect height="10" width="10"></rect><rect height="15" width="15"></rect></g>' - || result === '<g xmlns="http://www.w3.org/2000/svg"><rect width="10" height="10"></rect><rect width="15" height="15"></rect></g>' - ).toBeTruthy() - }) - - it('it deletes the node if the modifier returns false', function () { - var result = group.svg(function (instance) { - if (instance instanceof SVG.Circle) { - return false - } - }) - - expect( - result === '<g><rect width="10" height="10"></rect></g>' - || result === '<g><rect height="10" width="10"></rect></g>' - || result === '<g xmlns="http://www.w3.org/2000/svg"><rect width="10" height="10"></rect></g>' - ).toBeTruthy() - }) - }) - }) - - describe('writeDataToDom()', function () { - it('set all properties in el.dom to the svgjs:data attribute', function () { - var rect = draw.rect(100, 100) - rect.dom.foo = 'bar' - rect.dom.number = new SVG.Number('3px') - - rect.writeDataToDom() - - expect(rect.attr('svgjs:data')).toBe('{"foo":"bar","number":"3px"}') - }) - it('recursively dumps the data', function () { - var g = draw.group() - rect = g.rect(100, 100) - g.dom.foo = 'bar' - rect.dom.number = new SVG.Number('3px') - - g.writeDataToDom() - - expect(g.attr('svgjs:data')).toBe('{"foo":"bar"}') - expect(rect.attr('svgjs:data')).toBe('{"number":"3px"}') - }) - }) - - describe('setData()', function () { - it('read all data from the svgjs:data attribute and assign it to el.dom', function () { - var rect = draw.rect(100, 100) - - rect.attr('svgjs:data', '{"foo":"bar","number":"3px"}') - rect.setData(JSON.parse(rect.attr('svgjs:data'))) - - expect(rect.dom.foo).toBe('bar') - expect(rect.dom.number).toBe('3px') - }) - }) - - describe('point()', function () { - it('creates a point from screen coordinates transformed in the elements space', function () { - var rect = draw.rect(100, 100) - - var m = draw.node.getScreenCTM() - // alert([m.a, m.a, m.c, m.d, m.e, m.f].join(', ')) - - var translation = { x: m.e, y: m.f } - var pos = { x: 2, y: 5 } - - expect(rect.point(pos.x, pos.y).x).toBeCloseTo(pos.x - translation.x) - expect(rect.point(pos.x, pos.y).y).toBeCloseTo(pos.y - translation.y) - }) - }) - - describe('inside()', function () { - it('checks whether the given point inside the bounding box of the element', function () { - var rect = draw.rect(100, 100) - expect(rect.inside(50, 50)).toBeTruthy() - expect(rect.inside(150, 150)).toBeFalsy() - }) - }) - describe('show()', function () { - it('sets display property to ""', function () { - var rect = draw.rect(100, 100).show() - expect(rect.css('display')).toBe('') - }) - }) - describe('hide()', function () { - it('sets display property to none', function () { - var rect = draw.rect(100, 100).hide() - expect(rect.css('display')).toBe('none') - }) - }) - describe('visible()', function () { - it('checks if element is hidden or not', function () { - var rect = draw.rect(100, 100).hide() - expect(rect.visible()).toBeFalsy() - rect.show() - expect(rect.visible()).toBeTruthy() - }) - }) - // describe('is()', function() { - // it('checks if element is instance of a certain kind', function() { - // var rect = draw.rect(100,100) - // expect(rect.is(SVG.Rect)).toBeTruthy() - // expect(rect.is(SVG.Element)).toBeTruthy() - // expect(rect.is(SVG.Parent)).toBeFalsy() - // }) - // }) - describe('defs()', function () { - it('returns the defs from the svg', function () { - var g = draw.group() - expect(g.defs()).toBe(draw.root().defs()) - expect(g.defs() instanceof SVG.Defs).toBeTruthy() - }) - }) - describe('round()', function () { - it('round all attribues of a node to a specific precision', function () { - var rect = draw.rect(100.123456, 200.987654) - - expect(rect.round(2).attr()).toEqual(jasmine.objectContaining({ - width: 100.12, - height: 200.99 - })) - }) - it('round specified attributes of a node to a specific precision', function () { - var rect = draw.rect(100.123456, 200.987654) - - expect(rect.round(2, [ 'width' ]).attr()).toEqual(jasmine.objectContaining({ - width: 100.12, - height: 200.987654 - })) - }) - }) - - describe('words()', function () { - it('inserts plain text in a node', function () { - var element = draw.element('title').words('These are some words.').id(null) - var result = element.svg() - expect( - result == '<title>These are some words.</title>' - || result == '<title xmlns="http://www.w3.org/2000/svg">These are some words.</title>' - ).toBe(true) - }) - it('removes all nodes before adding words', function () { - var element = draw.element('title').words('These are some words.').id(null) - element.words('These are some words.') - var result = element.svg() - expect( - result == '<title>These are some words.</title>' - || result == '<title xmlns="http://www.w3.org/2000/svg">These are some words.</title>' - ).toBe(true) - }) - }) - - describe('element()', function () { - var element - - beforeEach(function () { - element = draw.element('rect') - }) - - it('creates an instance of Dom', function () { - expect(element instanceof SVG.Dom).toBeTruthy() - }) - it('creates element in called parent', function () { - expect(element.parent()).toBe(draw) - }) - }) -}) diff --git a/spec/spec/elements/Dom.js b/spec/spec/elements/Dom.js index 2310473..bcf0ed5 100644 --- a/spec/spec/elements/Dom.js +++ b/spec/spec/elements/Dom.js @@ -2,6 +2,7 @@ import { SVG, G, Rect, Svg, Dom, List, Fragment, Circle, Tspan, create } from '../../../src/main.js' import { getWindow } from '../../../src/utils/window.js' +import { svg, html } from '../../../src/modules/core/namespaces.js' const { any, createSpy, objectContaining } = jasmine describe('Dom.js', function () { @@ -58,7 +59,7 @@ describe('Dom.js', function () { it('handles svg strings', () => { const g = new G() - g.add('<rect>') + g.add('<rect />') expect(g.children().length).toBe(1) expect(g.get(0)).toEqual(any(Rect)) }) @@ -98,7 +99,7 @@ describe('Dom.js', function () { it('works with svg strings', () => { const rect = new Rect() - rect.addTo('<g>') + rect.addTo('<g />') expect(rect.parent()).toEqual(any(G)) }) @@ -269,6 +270,15 @@ describe('Dom.js', function () { }) }) + describe('html()', () => { + it('calls xml with the html namespace', () => { + const group = new G() + const spy = spyOn(group, 'xml') + group.html('<foo>') + expect(spy).toHaveBeenCalledWith('<foo>', undefined, html) + }) + }) + describe('id()', () => { it('returns current element when called as setter', () => { const g = new G() @@ -375,7 +385,7 @@ describe('Dom.js', function () { it('creates object from svg string', () => { const g = new G() - const rect = '<rect>' + const rect = '<rect />' const spy = spyOn(g, 'add').and.callThrough() const ret = g.put(rect, 0) expect(ret).toEqual(any(Rect)) @@ -409,7 +419,7 @@ describe('Dom.js', function () { }) it('returns an instance when svg string given', () => { - const g = '<g>' + const g = '<g />' const rect = new Rect() const ret = rect.putIn(g) expect(ret).toEqual(any(G)) @@ -522,93 +532,12 @@ describe('Dom.js', function () { }) describe('svg()', () => { - describe('as setter', () => { - it('returns itself', () => { - const g = new G() - expect(g.svg('<rect>')).toBe(g) - }) - - it('imports a single element', () => { - const g = new G().svg('<rect>') - expect(g.children()).toEqual([ any(Rect) ]) - }) - - it('imports multiple elements', () => { - const g = new G().svg('<rect /><circle />') - expect(g.children()).toEqual([ any(Rect), any(Circle) ]) - }) - - it('replaces the current element with the imported elements with outerHtml = true', () => { - const canvas = new Svg() - const g = canvas.group() - g.svg('<rect /><circle />', true) - expect(canvas.children()).toEqual([ any(Rect), any(Circle) ]) - }) - - it('returns the parent when outerHtml = true', () => { - const canvas = new Svg() - const g = canvas.group() - expect(g.svg('<rect /><circle />', true)).toBe(canvas) - expect(canvas.children()).toEqual([ any(Rect), any(Circle) ]) - }) - - it('works without a parent', () => { - const canvas = new Svg() - expect(canvas.svg('<rect><circle>')).toBe(canvas) - }) - }) - - describe('as getter', () => { - let canvas, group, rect - - beforeEach(() => { - canvas = new Svg().removeNamespace() - group = canvas.group() - rect = group.rect(123.456, 234.567) - }) - - it('returns the svg string of the element by default', () => { - expect(rect.svg()).toBe('<rect width="123.456" height="234.567"></rect>') - expect(canvas.svg()).toBe('<svg><g><rect width="123.456" height="234.567"></rect></g></svg>') - }) - - it('returns the innerHtml when outerHtml = false', () => { - expect(rect.svg(false)).toBe('') - expect(canvas.svg(false)).toBe('<g><rect width="123.456" height="234.567"></rect></g>') - }) - - it('runs a function on every exported node', () => { - expect(rect.svg((el) => el.round(1))).toBe('<rect width="123.5" height="234.6"></rect>') - }) - - it('runs a function on every exported node and replaces node with returned node if return value is not falsy', () => { - expect(rect.svg((el) => new Circle())).toBe('<circle></circle>') - expect(canvas.svg((el) => new G())).toBe('<g></g>') // outer <svg> was replaced by an empty g - expect(canvas.svg((el) => { - if (el instanceof Rect) return new Circle() - if (el instanceof Svg) el.removeNamespace() - })).toBe('<svg><g><circle></circle></g></svg>') - }) - - it('runs a function on every exported node and removes node if return value is false', () => { - expect(group.svg(() => false)).toBe('') - expect(canvas.svg(() => false)).toBe('') - expect(canvas.svg((el) => { - if (el instanceof Svg) { - el.removeNamespace() - } else { - return false - } - })).toBe('<svg></svg>') - }) - - it('runs a function on every inner node and exports it when outerHtml = false', () => { - expect(canvas.svg(() => false), false).toBe('') - expect(canvas.svg(() => undefined, false)).toBe('<g><rect width="123.456" height="234.567"></rect></g>') - }) - + it('calls xml with the svg namespace', () => { + const group = new G() + const spy = spyOn(group, 'xml') + group.svg('<foo>') + expect(spy).toHaveBeenCalledWith('<foo>', undefined, svg) }) - }) describe('toString()', () => { @@ -662,20 +591,20 @@ describe('Dom.js', function () { }) it('allows to pass an svg string as element', () => { - rect.wrap('<g>') + rect.wrap('<g />') expect(rect.parent()).toEqual(any(G)) expect(rect.parent().parent()).toBe(canvas) }) it('allows to pass an svg string as element', () => { - rect.wrap('<g>') + rect.wrap('<g />') expect(rect.parent()).toEqual(any(G)) expect(rect.parent().parent()).toBe(canvas) }) it('allows to pass an svg string as element when element not in the dom', () => { var rect = new Rect() - rect.wrap(SVG('<g>')) + rect.wrap(SVG('<g />')) expect(rect.parent()).toEqual(any(G)) expect(rect.parent().parent()).toBe(null) }) @@ -692,4 +621,95 @@ describe('Dom.js', function () { describe('writeDataToDom()', () => { // not really testable }) + + describe('xml()', () => { + describe('as setter', () => { + it('returns itself', () => { + const g = new G() + expect(g.xml('<rect />', undefined, svg)).toBe(g) + }) + + it('imports a single element', () => { + const g = new G().xml('<rect />', undefined, svg) + expect(g.children()).toEqual([ any(Rect) ]) + expect(g.children()[0].node.namespaceURI).toBe(svg) + }) + + it('imports multiple elements', () => { + const g = new G().xml('<rect /><circle />', undefined, svg) + expect(g.children()).toEqual([ any(Rect), any(Circle) ]) + }) + + it('replaces the current element with the imported elements with outerHtml = true', () => { + const canvas = new Svg() + const g = canvas.group() + g.xml('<rect /><circle />', true, svg) + expect(canvas.children()).toEqual([ any(Rect), any(Circle) ]) + }) + + it('returns the parent when outerHtml = true', () => { + const canvas = new Svg() + const g = canvas.group() + expect(g.xml('<rect /><circle />', true, svg)).toBe(canvas) + expect(canvas.children()).toEqual([ any(Rect), any(Circle) ]) + }) + + it('works without a parent', () => { + const canvas = new Svg() + expect(canvas.xml('<rect /><circle>', undefined, svg)).toBe(canvas) + }) + }) + + describe('as getter', () => { + let canvas, group, rect + + beforeEach(() => { + canvas = new Svg().removeNamespace() + group = canvas.group() + rect = group.rect(123.456, 234.567) + }) + + it('returns the svg string of the element by default', () => { + expect(rect.xml(), svg).toBe('<rect width="123.456" height="234.567"></rect>') + expect(canvas.xml(), svg).toBe('<svg><g><rect width="123.456" height="234.567"></rect></g></svg>') + }) + + it('returns the innerHtml when outerHtml = false', () => { + expect(rect.xml(false, svg)).toBe('') + expect(canvas.xml(false, svg)).toBe('<g><rect width="123.456" height="234.567"></rect></g>') + }) + + it('runs a function on every exported node', () => { + expect(rect.xml((el) => el.round(1))).toBe('<rect width="123.5" height="234.6"></rect>') + }) + + it('runs a function on every exported node and replaces node with returned node if return value is not falsy', () => { + expect(rect.xml((el) => new Circle(), svg)).toBe('<circle></circle>') + expect(canvas.xml((el) => new G(), svg)).toBe('<g></g>') // outer <svg> was replaced by an empty g + expect(canvas.xml((el) => { + if (el instanceof Rect) return new Circle() + if (el instanceof Svg) el.removeNamespace() + }, svg)).toBe('<svg><g><circle></circle></g></svg>') + }) + + it('runs a function on every exported node and removes node if return value is false', () => { + expect(group.xml(() => false, svg)).toBe('') + expect(canvas.xml(() => false, svg)).toBe('') + expect(canvas.xml((el) => { + if (el instanceof Svg) { + el.removeNamespace() + } else { + return false + } + }, svg)).toBe('<svg></svg>') + }) + + it('runs a function on every inner node and exports it when outerHtml = false', () => { + expect(canvas.xml(() => false, false, svg)).toBe('') + expect(canvas.xml(() => undefined, false, svg)).toBe('<g><rect width="123.456" height="234.567"></rect></g>') + }) + + }) + + }) }) diff --git a/spec/spec/elements/Fragment.js b/spec/spec/elements/Fragment.js index c0f5f0f..8e6503d 100644 --- a/spec/spec/elements/Fragment.js +++ b/spec/spec/elements/Fragment.js @@ -2,6 +2,7 @@ import { Fragment, Dom } from '../../../src/main.js' import { getWindow } from '../../../src/utils/window.js' +import { svg } from '../../../src/modules/core/namespaces.js' const { any } = jasmine @@ -25,13 +26,13 @@ describe('Fragment.js', () => { }) }) - describe('svg()', () => { + describe('xml()', () => { describe('as setter', () => { it('calls parent method with outerHtml = false', () => { const frag = new Fragment() - const spy = spyOn(Dom.prototype, 'svg').and.callThrough() - frag.svg('<rect>', true) - expect(spy).toHaveBeenCalledWith('<rect>', false) + const spy = spyOn(Dom.prototype, 'xml').and.callThrough() + frag.xml('<rect />', true, svg) + expect(spy).toHaveBeenCalledWith('<rect />', false, svg) }) }) @@ -40,20 +41,20 @@ describe('Fragment.js', () => { const frag = new Fragment() const group = frag.group() group.rect(123.456, 234.567) - const spy = spyOn(Dom.prototype, 'svg').and.callThrough() + const spy = spyOn(Dom.prototype, 'xml').and.callThrough() - expect(frag.svg(false)).toBe('<g><rect width="123.456" height="234.567"></rect></g>') - expect(spy).toHaveBeenCalledWith(null, false) + expect(frag.xml(false, svg)).toBe('<g><rect width="123.456" height="234.567"></rect></g>') + expect(spy).toHaveBeenCalledWith(false, svg) }) it('calls parent method with outerHtml = false - 2', () => { const frag = new Fragment() const group = frag.group() group.rect(123.456, 234.567) - const spy = spyOn(Dom.prototype, 'svg').and.callThrough() + const spy = spyOn(Dom.prototype, 'xml').and.callThrough() - expect(frag.svg(null, true)).toBe('<g><rect width="123.456" height="234.567"></rect></g>') - expect(spy).toHaveBeenCalledWith(null, false) + expect(frag.xml(true, svg)).toBe('<g><rect width="123.456" height="234.567"></rect></g>') + expect(spy).toHaveBeenCalledWith(false, svg) }) }) diff --git a/spec/spec/elements/G.js b/spec/spec/elements/G.js index e9f803f..2cd73fe 100644 --- a/spec/spec/elements/G.js +++ b/spec/spec/elements/G.js @@ -147,6 +147,7 @@ describe('G.js', () => { expect(g.y()).toBe(g.bbox().y) expect(g.y()).toBe(20) }) + it('calls move with the paramater as y', () => { const canvas = SVG().addTo(container) const g = canvas.group() diff --git a/spec/spec/elements/Svg.js b/spec/spec/elements/Svg.js index 1fa6fd5..990992a 100644 --- a/spec/spec/elements/Svg.js +++ b/spec/spec/elements/Svg.js @@ -54,12 +54,12 @@ describe('Svg.js', () => { describe('namespace()', () => { it('returns itself', () => { - const svg = SVG('<svg>') + const svg = SVG('<svg />') expect(svg.namespace()).toBe(svg) }) it('creates the namespace attributes on the svg', () => { - const svg = SVG('<svg>') + const svg = SVG('<svg />') expect(svg.attr('xmlns')).toBe(undefined) diff --git a/spec/spec/elements/Use.js b/spec/spec/elements/Use.js new file mode 100644 index 0000000..b1b4464 --- /dev/null +++ b/spec/spec/elements/Use.js @@ -0,0 +1,42 @@ +/* globals describe, expect, it, jasmine, container */ + +import { Use, Rect, SVG } from '../../../src/main.js' + +const { any } = jasmine + +describe('Use.js', () => { + describe('()', () => { + it('creates a new object of type Use', () => { + expect(new Use()).toEqual(any(Use)) + }) + + it('sets passed attributes on the element', () => { + expect(new Use({ id: 'foo' }).id()).toBe('foo') + }) + }) + + describe('use()', () => { + it('links an element', () => { + const rect = new Rect() + const use = new Use().use(rect) + expect(use.attr('href')).toBe('#' + rect.id()) + }) + + it('links an element from a different file', () => { + const use = new Use().use('id', 'file') + expect(use.attr('href')).toBe('file#id') + }) + }) + + describe('Container', () => { + describe('use()', () => { + it('creates a use element linked to the given element', () => { + const canvas = new SVG().addTo(container) + const rect = canvas.rect(100, 100) + const use = canvas.use(rect) + expect(use.attr('href')).toBe('#' + rect.id()) + expect(use.reference('href')).toBe(rect) + }) + }) + }) +}) diff --git a/spec/spec/ellipse.js b/spec/spec/ellipse.js deleted file mode 100644 index 76f16e6..0000000 --- a/spec/spec/ellipse.js +++ /dev/null @@ -1,179 +0,0 @@ -describe('Ellipse', function() { - var ellipse - - beforeEach(function() { - ellipse = draw.ellipse(240,90) - }) - - afterEach(function() { - draw.clear() - }) - - describe('x()', function() { - it('returns the value of x without an argument', function() { - expect(ellipse.x()).toBe(0) - }) - it('sets the value of x with the first argument', function() { - ellipse.x(123) - var box = ellipse.bbox() - expect(box.x).toBeCloseTo(123) - }) - }) - - describe('y()', function() { - it('returns the value of y without an argument', function() { - expect(ellipse.y()).toBe(0) - }) - it('sets the value of cy with the first argument', function() { - ellipse.y(345) - var box = ellipse.bbox() - expect(box.y).toBe(345) - }) - }) - - describe('cx()', function() { - it('returns the value of cx without an argument', function() { - expect(ellipse.cx()).toBe(120) - }) - it('sets the value of cx with the first argument', function() { - ellipse.cx(123) - var box = ellipse.bbox() - expect(box.cx).toBe(123) - }) - }) - - describe('cy()', function() { - it('returns the value of cy without an argument', function() { - expect(ellipse.cy()).toBe(45) - }) - it('sets the value of cy with the first argument', function() { - ellipse.cy(345) - var box = ellipse.bbox() - expect(box.cy).toBe(345) - }) - }) - - describe('radius()', function() { - it('sets the rx and ry', function() { - ellipse.radius(10, 20) - expect(ellipse.node.getAttribute('rx')).toBe('10') - expect(ellipse.node.getAttribute('ry')).toBe('20') - }) - it('sets the rx and ry if only rx given', function() { - ellipse.radius(30) - expect(ellipse.node.getAttribute('rx')).toBe('30') - expect(ellipse.node.getAttribute('ry')).toBe('30') - }) - it('sets the rx and ry value correctly when given 0', function() { - ellipse.radius(11, 0) - expect(ellipse.node.getAttribute('rx')).toBe('11') - expect(ellipse.node.getAttribute('ry')).toBe('0') - }) - }) - - describe('move()', function() { - it('sets the x and y position', function() { - ellipse.move(123, 456) - var box = ellipse.bbox() - expect(box.x).toBeCloseTo(123) - expect(box.y).toBeCloseTo(456) - }) - }) - - describe('dx()', function() { - it('moves the x positon of the element relative to the current position', function() { - ellipse.move(50, 60) - ellipse.dx(100) - expect(ellipse.node.getAttribute('cx')).toBe('270') - }) - }) - - describe('dy()', function() { - it('moves the y positon of the element relative to the current position', function() { - ellipse.move(50, 60) - ellipse.dy(120) - expect(ellipse.node.getAttribute('cy')).toBe('225') - }) - }) - - describe('dmove()', function() { - it('moves the x and y positon of the element relative to the current position', function() { - ellipse.move(50,60) - ellipse.dmove(80, 25) - expect(ellipse.node.getAttribute('cx')).toBe('250') - expect(ellipse.node.getAttribute('cy')).toBe('130') - }) - }) - - describe('center()', function() { - it('sets the cx and cy position', function() { - ellipse.center(321,567) - var box = ellipse.bbox() - expect(box.cx).toBe(321) - expect(box.cy).toBe(567) - }) - }) - - describe('width()', function() { - it('sets the width of the element', function() { - ellipse.width(82) - expect(ellipse.node.getAttribute('rx')).toBe('41') - }) - it('gets the width of the element if the argument is null', function() { - expect((ellipse.width() / 2).toString()).toBe(ellipse.node.getAttribute('rx')) - }) - }) - - describe('height()', function() { - it('sets the height of the element', function() { - ellipse.height(1236) - expect(ellipse.node.getAttribute('ry')).toBe('618') - }) - it('gets the height of the element if the argument is null', function() { - expect((ellipse.height() / 2).toString()).toBe(ellipse.node.getAttribute('ry')) - }) - }) - - describe('size()', function() { - it('defines the rx and ry of the element', function() { - ellipse.size(987,654) - expect(ellipse.node.getAttribute('rx')).toBe((987 / 2).toString()) - expect(ellipse.node.getAttribute('ry')).toBe((654 / 2).toString()) - }) - it('defines the width and height proportionally with only the width value given', function() { - var box = ellipse.bbox() - ellipse.size(500) - expect(ellipse.width()).toBe(500) - expect(ellipse.width() / ellipse.height()).toBe(box.width / box.height) - }) - it('defines the width and height proportionally with only the height value given', function() { - var box = ellipse.bbox() - ellipse.size(null, 525) - expect(ellipse.height()).toBe(525) - expect(ellipse.width() / ellipse.height()).toBe(box.width / box.height) - }) - }) - - describe('scale()', function() { - it('should scale the element universally with one argument', function() { - var box = ellipse.scale(2).rbox() - - expect(box.width).toBe(ellipse.attr('rx') * 2 * 2) - expect(box.height).toBe(ellipse.attr('ry') * 2 * 2) - }) - it('should scale the element over individual x and y axes with two arguments', function() { - var box = ellipse.scale(2, 3.5).rbox() - - expect(box.width).toBe(ellipse.attr('rx') * 2 * 2) - expect(box.height).toBe(ellipse.attr('ry') * 2 * 3.5) - }) - }) - - describe('translate()', function() { - it('sets the translation of an element', function() { - ellipse.transform({ tx: 12, ty: 12 }) - expect(ellipse.node.getAttribute('transform')).toBe('matrix(1,0,0,1,12,12)') - }) - }) - -}) diff --git a/spec/spec/event.js b/spec/spec/event.js deleted file mode 100644 index 8515d21..0000000 --- a/spec/spec/event.js +++ /dev/null @@ -1,277 +0,0 @@ -describe('Event', function() { - var rect, context - , toast = null - , fruitsInDetail = null, - action = function(e) { - toast = 'ready' - context = this - fruitsInDetail = e.detail || null - } - - beforeEach(function() { - rect = draw.rect(100, 100) - spyOn(SVG, 'on').and.callThrough() - spyOn(rect, 'dispatch').and.callThrough() - }) - - afterEach(function() { - toast = context = null - }) - - // FIXME: cannot be spied like that with es6 modules - // if (!this.isTouchDevice) { - // [ 'click' - // , 'dblclick' - // , 'mousedown' - // , 'mouseup' - // , 'mouseover' - // , 'mouseout' - // , 'mousemove' - // , 'mouseenter' - // , 'mouseleave' - // ].forEach(function(event) { - // describe(event+'()', function() { - // it('calls `on()` with '+event+' as event', function() { - // rect[event](action) - // expect(SVG.on).toHaveBeenCalledWith(rect, event, action) - // }) - // }) - // }) - // } else { - // [ 'touchstart' - // , 'touchmove' - // , 'touchleave' - // , 'touchend' - // , 'touchcancel' - // ].forEach(function(event) { - // describe(event+'()', function() { - // it('calls `on()` with '+event+' as event', function() { - // rect[event](action) - // expect(SVG.on).toHaveBeenCalledWith(rect, event, action) - // }) - // }) - // }) - // } - - - describe('on()', function() { - - it('attaches an event to the element', function() { - rect.on('event', action).fire('event') - expect(toast).toBe('ready') - }) - it('attaches multiple events to an element', function() { - var cnt = 0 - rect.on('bla sq.ns , wf,wq.ns2', function(){++cnt}).fire('wf').fire('sq').fire('wq') - expect(cnt).toBe(3) - }) - it('attaches an event to a non svg element', function() { - var el = document.createElement('div') - SVG.on(el, 'event', action) - el.dispatchEvent(new window.CustomEvent('event')) - expect(toast).toBe('ready') - SVG.off(el, 'event', action) - }) - it('attaches multiple handlers on different element', function() { - var rect2 = draw.rect(100, 100) - var rect3 = draw.rect(100, 100) - - rect.on('event', action) - rect2.on('event', action) - rect3.on('event', function(){ butter = 'melting' }) - rect3.on('event', action) - - expect(Object.keys(rect.events['event']['*']).length).toBe(1) // 1 listener on rect - expect(Object.keys(rect2.events['event']['*']).length).toBe(1) // 1 listener on rect2 - expect(Object.keys(rect3.events['event']['*']).length).toBe(2) // 2 listener on rect3 - }) - if('attaches a handler to a namespaced event', function(){ - var rect2 = draw.rect(100, 100) - var rect3 = draw.rect(100, 100) - - rect.on('event.namespace1', action) - rect2.on('event.namespace2', action) - rect3.on('event.namespace3', function(){ butter = 'melting' }) - rect3.on('event', action) - - expect(Object.keys(rect.events['event']['*'])).toBeUndefined() // no global listener on rect - expect(Object.keys(rect.events['event']['namespace1']).length).toBe( 1) // 1 namespaced listener on rect - expect(Object.keys(rect2.events['namespace2']).length).toBe(1) // 1 namespaced listener on rect2 - expect(Object.keys(rect3.events['event']['*']).length).toBe(1) // 1 gobal listener on rect3 - expect(Object.keys(rect3.events['event']['namespace3']).length).toBe(1) // 1 namespaced listener on rect3 - }) - it('applies the element as context', function() { - rect.on('event', action).fire('event') - expect(context).toBe(rect) - }) - it('applies given object as context', function() { - rect.on('event', action, this).fire('event') - expect(context).toBe(this) - }) - it('stores the listener for future reference', function() { - rect.on('event', action) - expect(rect.events['event']['*'][action._svgjsListenerId]).not.toBeUndefined() - }) - it('returns the called element', function() { - expect(rect.on('event', action)).toBe(rect) - }) - }) - - describe('off()', function() { - var butter = null - - beforeEach(function() { - butter = null - }) - - it('detaches a specific event listener, all other still working', function() { - rect2 = draw.rect(100,100) - rect3 = draw.rect(100,100) - - rect.on('event', action) - rect2.on('event', action) - rect3.on('event', function(){ butter = 'melting' }) - - rect.off('event', action) - - expect(Object.keys(rect.events['event']['*']).length).toBe(0) - - rect.fire('event') - expect(toast).toBeNull() - - rect2.fire('event') - expect(toast).toBe('ready') - - rect3.fire('event') - expect(butter).toBe('melting') - - expect(rect.events['event']['*'][action]).toBeUndefined() - }) - it('detaches a specific namespaced event listener, all other still working', function() { - rect2 = draw.rect(100,100) - rect3 = draw.rect(100,100) - - rect.on('event.namespace', action) - rect2.on('event.namespace', action) - rect3.on('event.namespace', function(){ butter = 'melting' }) - - rect.off('event.namespace', action) - - expect(Object.keys(rect.events['event']['namespace']).length).toBe(0) - expect(Object.keys(rect2.events['event']['namespace']).length).toBe(1) - - rect.fire('event') - expect(toast).toBeNull() - - rect2.fire('event') - expect(toast).toBe('ready') - - rect3.fire('event') - expect(butter).toBe('melting') - - expect(rect.events['event']['namespace'][action]).toBeUndefined() - }) - it('detaches all listeners for a specific namespace', function() { - rect.on('event', action) - rect.on('event.namespace', function() { butter = 'melting'; }) - rect.off('.namespace') - - rect.fire('event') - expect(toast).toBe('ready') - expect(butter).toBeNull() - }) - it('detaches all listeners for an event without a listener given', function() { - rect.on('event', action) - rect.on('event.namespace', function() { butter = 'melting'; }) - rect.off('event') - - rect.fire('event') - expect(toast).toBeNull() - expect(butter).toBeNull() - expect(rect.events['event']).toBeUndefined() - }) - it('detaches all listeners without an argument', function() { - rect.on('event', action) - rect.on('click', function() { butter = 'melting' }) - rect.off() - rect.fire('event') - rect.fire('click') - expect(toast).toBeNull() - expect(butter).toBeNull() - expect(Object.keys(rect.events).length).toBe(0) - }) - it('detaches multiple listeners at once', function() { - rect2 = draw.rect(100,100) - rect3 = draw.rect(100,100) - - rect.on('event.namespace bla foo.bar otherfoo.bar keepthis', action) - rect.off('event.namespace bla .bar') - - expect(Object.keys(rect.events['event']).length).toBe(0) - expect(rect.events['bla']).toBeUndefined() - expect(Object.keys(rect.events['foo']).length).toBe(0) - expect(Object.keys(rect.events['otherfoo']).length).toBe(0) - expect(Object.keys(rect.events['keepthis']['*']).length).toBe(1) - }) - it('returns the called element', function() { - expect(rect.off('event', action)).toBe(rect) - }) - it('does not throw when event is removed which was already removed with a global off', function() { - var undefined - - rect.on('event', action) - rect.off() - try{ - rect.off('event') - }catch(e){ - expect('Should not error out').toBe(true) - } - - expect(Object.keys(rect.events).length).toBe(0) - }) - }) - - describe('fire()', function() { - it('calls dispatch with its parameters', function() { - var data = {} - rect.dispatch('event', data) - expect(rect.dispatch).toHaveBeenCalledWith('event', data) - }) - - it('returns the called element', function() { - expect(rect.fire('event')).toBe(rect) - }) - }) - - describe('dispatch()', function() { - beforeEach(function() { - rect.on('event', action) - }) - - it('fires an event for the element', function() { - expect(toast).toBeNull() - rect.fire('event') - expect(toast).toBe('ready') - expect(fruitsInDetail).toBe(null) - }) - - it('fires event with additional data', function() { - expect(fruitsInDetail).toBeNull() - rect.fire('event', {apple:1}) - expect(fruitsInDetail).not.toBe(null) - expect(fruitsInDetail.apple).toBe(1) - }) - it('fires my own event', function() { - toast = null - rect.fire(new window.CustomEvent('event')) - expect(toast).toBe('ready') - }) - it('returns the dispatched event and makes it cancelable', function() { - rect.on('event', function(e) { - e.preventDefault() - }) - var event = rect.dispatch('event') - expect(event.defaultPrevented).toBe(true) - }) - }) -}) diff --git a/spec/spec/fx.js b/spec/spec/fx.js deleted file mode 100644 index 365a196..0000000 --- a/spec/spec/fx.js +++ /dev/null @@ -1,2867 +0,0 @@ -// describe('FX', function() { -// var rect, fx, undefined; -// -// beforeEach(function() { -// rect = draw.rect(100,100).move(100,100) -// fx = rect.animate(500) -// -// jasmine.clock().install() -// jasmine.clock().mockDate() // This freeze the Date -// }) -// -// afterEach(function() { -// jasmine.clock().uninstall() -// -// fx.stop(false, true) -// }) -// -// -// it('creates an instance of SVG.FX and sets parameter', function() { -// expect(fx instanceof SVG.FX).toBe(true) -// expect(fx._target).toBe(rect) -// expect(fx.absPos).toBe(0) -// expect(fx.pos).toBe(0) -// expect(fx.lastPos).toBe(0) -// expect(fx.paused).toBe(false) -// expect(fx.active).toBe(false) -// expect(fx._speed).toBe(1) -// expect(fx.situations).toEqual([]) -// expect(fx.situation.init).toBe(false) -// expect(fx.situation.reversed).toBe(false) -// expect(fx.situation.duration).toBe(500) -// expect(fx.situation.delay).toBe(0) -// expect(fx.situation.loops).toBe(false) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.animations).toEqual({}) -// expect(fx.situation.attrs).toEqual({}) -// expect(fx.situation.styles).toEqual({}) -// expect(fx.situation.transforms).toEqual([]) -// expect(fx.situation.once).toEqual({}) -// }) -// -// describe('animate()', function () { -// it('set duration, ease and delay of the new situation to their default value when they are not passed', function() { -// var defaultDuration = 1000 -// , defaultEase = SVG.easing['-'] -// , defaultDelay = 0 -// , lastSituation = fx.animate().last() -// -// expect(lastSituation.duration).toBe(defaultDuration) -// expect(lastSituation.ease).toBe(defaultEase) -// expect(lastSituation.delay).toBe(defaultDelay) -// }) -// -// it('use the passed values to set duration, ease and delay of the new situation', function() { -// var duration = 14502 -// , ease = '>' -// , delay = 450 -// , lastSituation = fx.animate(duration, ease, delay).last() -// -// expect(lastSituation.duration).toBe(duration) -// expect(lastSituation.ease).toBe(SVG.easing[ease]) -// expect(lastSituation.delay).toBe(delay) -// }) -// -// it('allow duration, ease and delay to be passed in an object', function() { -// var o = { -// duration: 7892 -// , ease: '<' -// , delay: 1145 -// } -// , lastSituation = fx.animate(o).last() -// -// expect(lastSituation.duration).toBe(o.duration) -// expect(lastSituation.ease).toBe(SVG.easing[o.ease]) -// expect(lastSituation.delay).toBe(o.delay) -// }) -// -// it('allow ease to be a custom function', function () { -// var customEase = function() {} -// , lastSituation = fx.animate({ease: customEase}).last() -// -// expect(lastSituation.ease).toBe(customEase) -// }) -// }) -// -// describe('target()', function(){ -// it('returns the current fx object with no argument given', function(){ -// expect(fx.target()).toBe(rect) -// }) -// -// it('changes the target of the animation when parameter given', function(){ -// var c = draw.circle(5) -// expect(fx.target(c).target()).toBe(c) -// }) -// }) -// -// -// describe('timeToAbsPos()', function() { -// it('converts a timestamp to an absolute progress', function() { -// expect(fx.timeToAbsPos( fx.situation.start + fx.situation.duration*0.5 )).toBe(0.5) -// }) -// -// it('should take speed into consideration', function() { -// var spd -// -// spd = 4 -// fx.speed(spd) -// expect(fx.timeToAbsPos( fx.situation.start + (fx.situation.duration/spd)*0.5 )).toBe(0.5) -// -// spd = 0.5 -// fx.speed(spd) -// expect(fx.timeToAbsPos( fx.situation.start + (fx.situation.duration/spd)*0.25 )).toBe(0.25) -// }) -// }) -// -// -// describe('absPosToTime()', function() { -// it('converts an absolute progress to a timestamp', function() { -// expect(fx.absPosToTime(0.5)).toBe( fx.situation.start + fx.situation.duration*0.5 ) -// }) -// -// it('should take speed into consideration', function() { -// var spd -// -// spd = 4 -// fx.speed(spd) -// expect(fx.absPosToTime(0.5)).toBe( fx.situation.start + (fx.situation.duration/spd)*0.5 ) -// -// spd = 0.5 -// fx.speed(spd) -// expect(fx.absPosToTime(0.25)).toBe( fx.situation.start + (fx.situation.duration/spd)*0.25 ) -// }) -// }) -// -// -// describe('atStart()', function () { -// it('sets the animation at the start', function() { -// // When the animation is running forward, the start position is 0 -// fx.pos = 0.5 -// expect(fx.atStart().pos).toBe(0) -// -// // When the animation is running backward, the start position is 1 -// fx.pos = 0.5 -// expect(fx.reverse(true).atStart().pos).toBe(1) -// }) -// -// it('sets the animation at the start, before any loops', function() { -// fx.loop(true) -// -// // When the animation is running forward, the start position is 0 -// fx.at(3.7, true) -// expect(fx.absPos).toBe(3.7) -// expect(fx.pos).toBeCloseTo(0.7) -// expect(fx.situation.loop).toBe(3) -// -// fx.atStart() -// expect(fx.absPos).toBe(0) -// expect(fx.pos).toBe(0) -// expect(fx.situation.loop).toBe(0) -// -// // When the animation is running backward, the start position is 1 -// fx.reverse(true).at(2.14, true) -// expect(fx.absPos).toBe(2.14) -// expect(fx.pos).toBeCloseTo(1 - 0.14) -// expect(fx.situation.loop).toBe(2) -// expect(fx.situation.reversed).toBe(true) -// -// fx.atStart() -// expect(fx.absPos).toBe(0) -// expect(fx.pos).toBe(1) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.reversed).toBe(true) -// }) -// -// it('sets the animation at the start, before any loops when reversing is true', function() { -// fx.loop(true, true) // Set reversing to true -// -// // When the animation is running forward, the start position is 0 -// fx.at(11.21, true) -// expect(fx.absPos).toBe(11.21) -// expect(fx.pos).toBeCloseTo(1 - 0.21) -// expect(fx.situation.loop).toBe(11) -// expect(fx.situation.reversed).toBe(true) -// -// fx.atStart() -// expect(fx.absPos).toBe(0) -// expect(fx.pos).toBe(0) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.reversed).toBe(false) -// -// // When the animation is running backward, the start position is 1 -// fx.reverse(true).at(14.10, true) -// expect(fx.absPos).toBe(14.10) -// expect(fx.pos).toBeCloseTo(1 - 0.10) -// expect(fx.situation.loop).toBe(14) -// expect(fx.situation.reversed).toBe(true) -// -// fx.atStart() -// expect(fx.absPos).toBe(0) -// expect(fx.pos).toBe(1) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.reversed).toBe(true) -// }) -// }) -// -// -// describe('atEnd()', function () { -// it('sets the animation at the end', function() { -// // When the animation is running forward, the end position is 1 -// fx.pos = 0.5 -// expect(fx.atEnd().pos).toBe(1) -// expect(fx.situation).toBeNull() -// -// // Recreate an animation since the other one was ended -// fx.animate() -// -// // When the animation is running backward, the end position is 0 -// fx.pos = 0.5 -// expect(fx.reverse(true).atEnd().pos).toBe(0) -// expect(fx.situation).toBeNull() -// }) -// -// it('sets the animation at the end, after all loops', function() { -// var loops -// -// // When the animation is running forward, the end position is 1 -// loops = 12 -// fx.loop(loops).start().step() -// expect(fx.absPos).toBe(0) -// expect(fx.pos).toBe(0) -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.loops).toBe(loops) -// -// fx.atEnd() -// expect(fx.absPos).toBe(loops) -// expect(fx.pos).toBe(1) -// expect(fx.active).toBe(false) -// expect(fx.situation).toBeNull() -// -// // Recreate an animation since the other one was ended -// fx.animate() -// -// -// // When the animation is running backward, the end position is 0 -// loops = 21 -// fx.reverse(true).loop(loops).start().step() -// expect(fx.absPos).toBe(0) -// expect(fx.pos).toBe(1) -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.loops).toBe(loops) -// expect(fx.situation.reversed).toBe(true) -// -// fx.atEnd() -// expect(fx.absPos).toBe(loops) -// expect(fx.pos).toBe(0) -// expect(fx.active).toBe(false) -// expect(fx.situation).toBeNull() -// }) -// -// it('sets the animation at the end, after all loops when reversing is true', function() { -// var loops -// -// // When reversing is true, the end position is 0 when loops is even and -// // 1 when loops is odd -// -// // The animation is running forward -// loops = 6 -// fx.loop(loops, true).start().step() -// expect(fx.absPos).toBe(0) -// expect(fx.pos).toBe(0) -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.loops).toBe(loops) -// expect(fx.situation.reversed).toBe(false) -// -// fx.atEnd() -// expect(fx.absPos).toBe(loops) -// expect(fx.pos).toBe(0) // End position is 0 because loops is even -// expect(fx.active).toBe(false) -// expect(fx.situation).toBeNull() -// -// // Recreate an animation since the other one was ended -// fx.animate() -// -// // When reversing is true and the animation is running backward, -// // the end position is 1 when loops is even and 0 when loops is odd -// -// // The animation is running backward -// loops = 3 -// fx.reverse(true).loop(loops, true).start().step() -// expect(fx.absPos).toBe(0) -// expect(fx.pos).toBe(1) -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.loops).toBe(loops) -// expect(fx.situation.reversed).toBe(true) -// -// fx.atEnd() -// expect(fx.absPos).toBe(loops) -// expect(fx.pos).toBe(0) // End position is 0 because loops is odd -// expect(fx.active).toBe(false) -// expect(fx.situation).toBeNull() -// }) -// -// it('sets the animation at the end of the current iteration when in an infinite loop', function () { -// // When the animation is running forward, the end position is 1 -// fx.loop(true).start().step() -// expect(fx.absPos).toBe(0) -// expect(fx.pos).toBe(0) -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.loops).toBe(true) -// -// // Should be halfway through iteration 10 -// jasmine.clock().tick(500 * 10 + 250) -// fx.step() -// expect(fx.absPos).toBe(10.5) -// expect(fx.pos).toBe(0.5) -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe(10) -// expect(fx.situation.loops).toBe(true) -// -// fx.atEnd() -// expect(fx.absPos).toBe(11) -// expect(fx.pos).toBe(1) -// expect(fx.active).toBe(false) -// expect(fx.situation).toBeNull() -// -// // Recreate an animation since the other one was ended -// fx.animate(500) -// -// // When the animation is running backward, the end position is 0 -// fx.reverse(true).loop(true).start().step() -// expect(fx.absPos).toBe(0) -// expect(fx.pos).toBe(1) -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.loops).toBe(true) -// expect(fx.situation.reversed).toBe(true) -// -// // Should be halfway through iteration 21 -// jasmine.clock().tick(500 * 21 + 250) -// fx.step() -// expect(fx.absPos).toBe(21.5) -// expect(fx.pos).toBe(0.5) -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe(21) -// expect(fx.situation.loops).toBe(true) -// -// fx.atEnd() -// expect(fx.absPos).toBe(22) -// expect(fx.pos).toBe(0) -// expect(fx.active).toBe(false) -// expect(fx.situation).toBeNull() -// }) -// -// -// it('sets the animation at the end of the current iteration when in an infinite loop and reversing is true', function () { -// // When reversing is true, the end position is 1 when ending on an even -// // iteration and 0 when ending on an odd iteration as illustrated below: -// -// // 0 Iteration 1 -// // |--------------0------------->| -// // |<-------------1--------------| -// // |--------------2------------->| -// // |<-------------3--------------| -// // ... -// -// -// // The animation is running forward -// fx.loop(true, true).start().step() -// expect(fx.absPos).toBe(0) -// expect(fx.pos).toBe(0) -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.loops).toBe(true) -// -// // Should be halfway through iteration 11 -// jasmine.clock().tick(500 * 11 + 250) -// fx.step() -// expect(fx.absPos).toBe(11.5) -// expect(fx.pos).toBe(0.5) -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe(11) -// expect(fx.situation.loops).toBe(true) -// -// fx.atEnd() -// expect(fx.absPos).toBe(12) -// expect(fx.pos).toBe(0) // End position is 0 because ended on a odd iteration -// expect(fx.active).toBe(false) -// expect(fx.situation).toBeNull() -// -// // Recreate an animation since the other one was ended -// fx.animate(500) -// -// // When reversing is true and the animation is running backward, -// // the end position is 0 when ending on an even iteration and -// // 1 when ending on an odd iteration as illustrated below: -// -// // 0 Iteration 1 -// // |<-------------0--------------| -// // |--------------1------------->| -// // |<-------------2--------------| -// // |--------------3------------->| -// // ... -// -// // The animation is running backward -// fx.reverse(true).loop(true).start().step() -// expect(fx.absPos).toBe(0) -// expect(fx.pos).toBe(1) -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.loops).toBe(true) -// expect(fx.situation.reversed).toBe(true) -// -// // Should be halfway through iteration 42 -// jasmine.clock().tick(500 * 42 + 250) -// fx.step() -// expect(fx.absPos).toBe(42.5) -// expect(fx.pos).toBe(0.5) -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe(42) -// expect(fx.situation.loops).toBe(true) -// -// fx.atEnd() -// expect(fx.absPos).toBe(43) -// expect(fx.pos).toBe(0) // End position is 0 because ended on an even iteration -// expect(fx.active).toBe(false) -// expect(fx.situation).toBeNull() -// }) -// }) -// -// -// describe('at()', function() { -// it('sets the progress to the specified position', function() { -// var pos -// -// // Animation running forward -// pos = 0.5 -// expect(fx.at(pos).pos).toBe(pos) -// expect(fx.situation.start).toBe(+new Date - fx.situation.duration * pos) -// -// // Animation running backward -// pos = 0.4 -// expect(fx.reverse(true).at(pos).pos).toBe(pos) -// expect(fx.situation.start).toBe(+new Date - fx.situation.duration * (1-pos)) -// }) -// -// it('should convert a position to an absolute position', function () { -// var pos, loop, absPos -// -// fx.loop(true) -// -// // Animation running forward -// pos = 0.7 -// loop = 4 -// absPos = pos+loop -// fx.situation.loop = loop -// expect(fx.at(pos).absPos).toBe(absPos) -// expect(fx.situation.start).toBe(+new Date - fx.situation.duration * absPos) -// -// // Animation running backward -// pos = 0.23 -// loop = 9 -// absPos = (1-pos)+loop -// fx.situation.loop = loop -// fx.situation.reversed = true -// expect(fx.at(pos).absPos).toBe(absPos) -// expect(fx.situation.start).toBe(+new Date - fx.situation.duration * absPos) -// -// }) -// -// it('should end the animation when the end position is passed', function() { -// var pos -// -// fx.start() -// expect(fx.active).toBe(true) -// expect(fx.situation).not.toBeNull() -// -// // When running forward, the end position is 1 -// pos = 1 -// expect(fx.at(pos).pos).toBe(pos) -// expect(fx.active).toBe(false) -// expect(fx.situation).toBeNull() -// -// // Recreate an animation since the other one was ended -// fx.animate().start() -// expect(fx.active).toBe(true) -// expect(fx.situation).not.toBeNull() -// -// // When running backward, the end position is 0 -// pos = 0 -// expect(fx.reverse(true).at(pos).pos).toBe(pos) -// expect(fx.active).toBe(false) -// expect(fx.situation).toBeNull() -// }) -// -// it('correct the passed position when it is out of [0,1] and the animation is not looping', function () { -// var pos -// -// pos = -0.7 -// expect(fx.at(pos).pos).toBe(0) -// -// pos = 1.3 -// expect(fx.at(pos).pos).toBe(1) -// -// // Recreate an animation since the other one was ended -// fx.animate() -// -// // Should work even when animation is running backward -// pos = 1.3 -// expect(fx.reverse(true).at(pos).pos).toBe(1) -// -// pos = -0.7 -// expect(fx.reverse(true).at(pos).pos).toBe(0) -// }) -// -// it('should, when the animation is looping and the passed position is out of [0,1], use the integer part of postion to update the loop counter and set position to its fractional part', function(){ -// var loop, pos, posFrac, posInt -// -// // Without the reverse flag -// fx.loop(10) -// expect(fx.situation.loops).toBe(10) -// expect(fx.situation.loop).toBe(loop = 0) -// -// pos = 1.3 -// posFrac = pos % 1 -// posInt = pos - posFrac -// expect(fx.at(pos).pos).toBeCloseTo(posFrac) -// expect(fx.situation.loop).toBe(loop += posInt) -// -// pos = 7.723 -// posFrac = pos % 1 -// posInt = pos - posFrac -// expect(fx.at(pos).pos).toBeCloseTo(posFrac) -// expect(fx.situation.loop).toBe(loop += posInt) -// -// // In this case, pos is above the remaining number of loops, so we expect -// // the position to be set to 1 and the animation to be ended -// pos = 4.3 -// posFrac = pos % 1 -// posInt = pos - posFrac -// expect(fx.at(pos).pos).toBe(1) -// expect(fx.situation).toBeNull() -// -// // Recreate an animation since the other one was ended -// fx.animate() -// -// // With the reverse flag, the position is reversed each time loop is odd -// fx.loop(10, true) -// expect(fx.situation.loops).toBe(10) -// expect(fx.situation.loop).toBe(loop = 0) -// expect(fx.situation.reversed).toBe(false) -// -// pos = 3.3 -// posFrac = pos % 1 -// posInt = pos - posFrac -// expect(fx.at(pos).pos).toBeCloseTo(1-posFrac) // Animation is reversed because 0+3 is odd -// expect(fx.situation.loop).toBe(loop += posInt) -// expect(fx.situation.reversed).toBe(true) -// -// // When the passed position is below 0, the integer part of position is -// // substracted from 1, so, in this case, -0.6 has 1 as is integer part -// // This is necessary so we can add something to the loop counter -// pos = -0.645 -// posFrac = (1-pos) % 1 -// posInt = (1-pos) - posFrac -// expect(fx.at(pos).pos).toBeCloseTo(posFrac) -// expect(fx.situation.loop).toBe(loop += posInt) -// expect(fx.situation.reversed).toBe(false) -// -// // In this case, pos is above the remaining number of loop, so we expect -// // the position to be set to 0 (since we end reversed) and the animation to -// // be ended -// pos = 7.2 -// posFrac = pos % 1 -// posInt = pos - posFrac -// expect(fx.at(pos).pos).toBe(0) -// expect(fx.situation).toBeNull() -// }) -// -// it('should, when the animation is in a infinite loop and the passed position is out of [0,1], use the integer part of postion to update the loop counter and set position to its fractional part', function(){ -// var loop, pos, posFrac, posInt -// -// // Without the reverse flag -// fx.loop(true) -// expect(fx.situation.loops).toBe(true) -// expect(fx.situation.loop).toBe(loop = 0) -// -// pos = 10.34 -// posFrac = pos % 1 -// posInt = pos - posFrac -// expect(fx.at(pos).pos).toBeCloseTo(posFrac) -// expect(fx.situation.loop).toBe(loop += posInt) -// -// // With the reverse flag, the position is reversed each time loop is odd -// fx.loop(true, true) -// expect(fx.situation.loops).toBe(true) -// expect(fx.situation.loop).toBe(loop = 0) -// expect(fx.situation.reversed).toBe(false) -// -// pos = 3.3 -// posFrac = pos % 1 -// posInt = pos - posFrac -// expect(fx.at(pos).pos).toBeCloseTo(1-posFrac) // Animation is reversed because 3+0 is odd -// expect(fx.situation.loop).toBe(loop += posInt) -// expect(fx.situation.reversed).toBe(true) -// -// pos = -8.41 -// posFrac = (1-pos) % 1 -// posInt = (1-pos) - posFrac -// expect(fx.at(pos).pos).toBeCloseTo(posFrac) -// expect(fx.situation.loop).toBe(loop += posInt) -// expect(fx.situation.reversed).toBe(false) -// }) -// -// it('should take speed into consideration', function() { -// var dur, spd -// -// dur = fx.situation.duration -// -// spd = 4 -// fx.speed(spd).at(0) -// expect(fx.situation.finish-fx.situation.start).toBe(dur/spd) -// -// spd = 5 -// fx.speed(spd).at(0.15) -// expect(fx.situation.finish-fx.situation.start).toBe(dur/spd) -// -// spd = 0.25 -// fx.speed(spd).at(0.75) -// expect(fx.situation.finish-fx.situation.start).toBe(dur/spd) -// -// spd = 0.5 -// fx.speed(spd).at(0.83) -// expect(fx.situation.finish-fx.situation.start).toBe(dur/spd) -// }) -// -// it('should consider the first parameter as an absolute position when the second parameter is true', function() { -// var absPos -// -// fx.loop(true) -// -// absPos = 3.2 -// expect(fx.at(absPos, true).absPos).toBe(absPos) -// -// absPos = -4.27 -// expect(fx.at(absPos, true).absPos).toBe(absPos) -// -// absPos = 0 -// expect(fx.at(absPos, true).absPos).toBe(absPos) -// -// absPos = 1 -// expect(fx.at(absPos, true).absPos).toBe(absPos) -// }) -// }) -// -// -// describe('start()', function(){ -// it('starts the animation', function() { -// fx.start() -// expect(fx.active).toBe(true) -// -// jasmine.clock().tick(200) -// fx.step() // Call step to update the animation -// -// expect(fx.pos).toBeGreaterThan(0) -// }) -// -// it('should take speed into consideration', function() { -// var dur = 500 -// , delay = 300 -// , spd = 4 -// -// -// fx.stop().animate(dur, '-', delay).speed(spd).start() -// expect(fx.situation.finish - new Date).toBe(delay/spd + dur/spd) -// }) -// -// it('should do the delay', function() { -// fx.situation.delay = 1000 -// expect(fx.start().active).toBe(true) -// -// jasmine.clock().tick(501) -// fx.step() // Call step to update the animation -// expect(fx.active).toBe(true) -// -// jasmine.clock().tick(501) -// fx.step() // Call step to update the animation -// expect(fx.active).toBe(true) -// -// jasmine.clock().tick(501) -// fx.step() // Call step to update the animation -// expect(fx.active).toBe(false) -// }) -// }) -// -// describe('delay()', function() { -// it('should push an empty situation with its duration attribute set to the duration of the delay', function() { -// var delay = 8300 -// fx.delay(delay) -// expect(fx.situations[0].duration).toBe(delay) -// }) -// }) -// -// -// describe('pause()', function() { -// it('pause the animation', function() { -// expect(fx.pause().paused).toBe(true) -// }) -// }) -// -// describe('play()', function() { -// it('returns itself when animation not paused', function() { -// expect(fx.paused).toBe(false) -// expect(fx.play()).toBe(fx) -// }) -// -// it('unpause the animation', function() { -// var start = fx.start().pause().situation.start -// -// jasmine.clock().tick(200) -// -// expect(fx.situation.start).toBe(start) -// expect(fx.play().paused).toBe(false) -// expect(fx.situation.start).not.toBe(start) -// }) -// -// it('should not change the position when the animation is unpaused while it is set to run backward', function(){ -// var pos = 0.4 -// -// expect(fx.reverse(true).at(pos).pause().play().pos).toBe(pos) -// }) -// -// it('should be able to unpause the delay', function () { -// fx.stop().animate(500, '-', 300).start().step() -// expect(fx.pos).toBe(0) -// expect(fx.absPos).toBeCloseTo(-0.6) -// -// // At this point, we should have an animation of 500 ms with a delay of -// // 300 ms that should be running. -// -// jasmine.clock().tick(150) -// -// // Should be halfway through the delay -// fx.step() -// expect(fx.pos).toBe(0) -// expect(fx.absPos).toBe(-0.3) -// -// expect(fx.pause().paused).toBe(true) // Pause the delay -// -// jasmine.clock().tick(150) -// -// // Unpause, should still be halfway through the delay -// expect(fx.play().paused).toBe(false) -// expect(fx.pos).toBe(0) -// expect(fx.absPos).toBe(-0.3) -// -// jasmine.clock().tick(150) -// -// // Delay should be done -// fx.step() -// expect(fx.pos).toBe(0) -// expect(fx.absPos).toBe(0) -// -// jasmine.clock().tick(500) -// -// // Animation and delay should be done -// fx.step() -// expect(fx.active).toBe(false) -// expect(fx.pos).toBe(1) -// expect(fx.absPos).toBe(1) -// }) -// }) -// -// -// describe('speed()', function() { -// it('set the speed of the animation', function(){ -// var dur, spd -// -// dur = fx.situation.duration -// -// spd = 2 -// fx.speed(spd) -// expect(fx._speed).toBe(spd) -// expect(fx.situation.finish-fx.situation.start).toBe(dur/spd) -// -// spd = 0.5 -// fx.speed(spd) -// expect(fx._speed).toBe(spd) -// expect(fx.situation.finish-fx.situation.start).toBe(dur/spd) -// -// spd = 2 -// fx.at(0.2).speed(spd) -// expect(fx._speed).toBe(spd) -// expect(fx.situation.finish-fx.situation.start).toBe(dur/spd) -// -// spd = 1 -// fx.speed(spd) -// expect(fx._speed).toBe(spd) -// expect(fx.situation.finish-fx.situation.start).toBe(dur) -// }) -// -// it('should not change the position when the animation is run backward', function(){ -// var pos = 0.4 -// -// expect(fx.reverse(true).at(pos).speed(2).pos).toBe(pos) -// }) -// -// it('return the current speed with no argument given', function(){ -// var spd -// -// spd = 2 -// fx._speed = spd -// expect(fx.speed()).toBe(spd) -// -// spd = 0.5 -// fx._speed = spd -// expect(fx.speed()).toBe(spd) -// -// spd = 1 -// fx._speed = spd -// expect(fx.speed()).toBe(spd) -// }) -// -// it('pause the animation when a speed of 0 is passed', function(){ -// var spd = fx._speed -// -// expect(fx.speed(0)).toBe(fx) -// expect(fx._speed).toBe(spd) -// expect(fx.paused).toBe(true) -// }) -// -// it('should affect all animations in the queue', function(){ -// fx.speed(2).animate(300) -// expect(fx.situations.length).not.toBe(0) -// expect(fx.pos).not.toBe(1) -// -// // At this point, there should be 2 animations in the queue to be played: -// // the one of 500ms that is added before every test and the one of 300ms -// // we just added. Normally, it would take 800ms before both of these -// // animations are done, but because we set the speed to 2, it should -// // only take 400ms to do both animations. -// fx.start().step() -// -// jasmine.clock().tick(250) -// -// // Should be playing the second animation -// fx.step() -// expect(fx.active).toBe(true) -// expect(fx.situations.length).toBe(0) -// expect(fx.pos).not.toBe(1) -// -// jasmine.clock().tick(150) // 400ms have passed -// -// // All animations should be done -// fx.step() -// expect(fx.active).toBe(false) -// expect(fx.situations.length).toBe(0) -// expect(fx.pos).toBe(1) -// }) -// -// it('should affect the delay', function() { -// fx.stop().animate(500, '-', 300).start().step() -// expect(fx.pos).toBe(0) -// expect(fx.absPos).toBeCloseTo(-0.6) -// -// fx.speed(2) -// expect(fx.pos).toBe(0) -// expect(fx.absPos).toBeCloseTo(-0.6) -// -// // At this point, we should have an animation of 500 ms with a delay of -// // 300 ms that should be running. Normally, it would take 800 ms for the -// // animation and its delay to complete, but because the speed is set to 2 -// // , it should only take 400ms -// -// jasmine.clock().tick(75) -// -// // Should be halfway through the delay -// fx.step() -// expect(fx.pos).toBe(0) -// expect(fx.absPos).toBe(-0.3) -// -// jasmine.clock().tick(75) -// -// // Delay should be done -// fx.step() -// expect(fx.pos).toBe(0) -// expect(fx.absPos).toBe(0) -// -// jasmine.clock().tick(250) -// -// // Animation and delay should be done -// fx.step() -// expect(fx.active).toBe(false) -// expect(fx.pos).toBe(1) -// expect(fx.absPos).toBe(1) -// }) -// }) -// -// -// describe('reverse()', function() { -// it('toggles the direction of the animation without a parameter', function() { -// expect(fx.reverse().situation.reversed).toBe(true) -// }) -// it('sets the direction to backwards with true given', function() { -// expect(fx.reverse(true).situation.reversed).toBe(true) -// }) -// it('sets the direction to forwards with false given', function() { -// expect(fx.reverse(false).situation.reversed).toBe(false) -// }) -// }) -// -// -// describe('queue()', function() { -// it('can add a situation to the queue', function() { -// var situation = new SVG.Situation({duration: 1000, delay: 0, ease: SVG.easing['-']}) -// -// fx.queue(situation) -// expect(fx.situations[0]).toBe(situation) -// }) -// -// it('can add a function to the queue', function() { -// var f = function(){} -// -// fx.queue(f) -// expect(fx.situations[0]).toBe(f) -// }) -// -// it('should set the situation attribute before pushing something in the situations queue', function(){ -// var situation = new SVG.Situation({duration: 1000, delay: 0, ease: SVG.easing['-']}) -// -// // Clear the animation that is created before each test -// fx.stop() -// -// expect(fx.situation).toBeNull() -// expect(fx.situations.length).toBe(0) -// fx.queue(situation) -// expect(fx.situation).toBe(situation) -// expect(fx.situations.length).toBe(0) -// }) -// }) -// -// -// describe('dequeue()', function() { -// it('should pull the next situtation from the queue', function() { -// var situation = new SVG.Situation({duration: 1000, delay: 0, ease: SVG.easing['-']}) -// -// fx.queue(situation) -// expect(fx.situtation).not.toBe(situation) -// expect(fx.situations[0]).toBe(situation) -// -// fx.dequeue() -// expect(fx.situation).toBe(situation) -// expect(fx.situations.length).toBe(0) -// }) -// -// it('initialize the animation pulled from the queue to its start position', function() { -// // When the animation is forward, the start position is 0 -// fx.animate() -// fx.pos = 0.5 -// expect(fx.dequeue().pos).toBe(0) -// -// // When the animation backward, the start position is 1 -// fx.animate().reverse(true) -// fx.pos = 0.5 -// expect(fx.dequeue().pos).toBe(1) -// }) -// -// it('when the first element of the queue is a function, it should execute it', function() { -// var called = false -// -// fx.queue(function(){ -// called = true -// expect(this).toBe(fx) -// this.dequeue() -// }).dequeue() -// -// expect(called).toBe(true) -// }) -// -// it('should stop the currently running animation when there is one', function() { -// fx.start() -// expect(fx.active).toBe(true) -// fx.queue(function() { -// expect(this.active).toBe(false) -// this.dequeue() -// }) -// fx.dequeue() -// }) -// }) -// -// -// describe('stop()', function() { -// it('stops the animation immediately without a parameter', function() { -// fx.animate(500).start() -// expect(fx.stop().situation).toBeNull() -// expect(fx.active).toBe(false) -// expect(fx.situations.length).toBe(1) -// }) -// it('stops the animation immediately and fullfill it if first parameter true', function() { -// fx.animate(500).start() -// expect(fx.stop(true).situation).toBeNull() -// expect(fx.active).toBe(false) -// expect(fx.pos).toBe(1) -// expect(fx.situations.length).toBe(1) -// }) -// it('stops the animation immediately and remove all items from queue when second parameter true', function() { -// fx.animate(500).start() -// expect(fx.stop(false, true).situation).toBeNull() -// expect(fx.active).toBe(false) -// expect(fx.situations.length).toBe(0) -// }) -// }) -// -// -// describe('reset()', function() { -// it('resets the element to the state it was when the current animation was started', function() { -// var loops = 4 -// , situation = fx.situation -// -// // These settings make the animations run backward -// fx.situation.loop = 2 -// fx.situation.loops = loops -// fx.situation.reversed = true -// fx.pos = 0.5 -// fx.absPos = 2.5 -// -// fx.reset() -// -// expect(fx.situation).toBe(situation) -// expect(fx.situation.loops).toBe(loops) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.reversed).toBe(true) // True because the animation is backward -// expect(fx.pos).toBe(1) -// expect(fx.absPos).toBe(0) -// }) -// }) -// -// -// describe('finish()', function() { -// it('finish the whole animation by fullfilling every single one', function() { -// fx.animate(500) -// expect(fx.finish().pos).toBe(1) -// expect(fx.situations.length).toBe(0) -// expect(fx.situation).toBeNull() -// }) -// }) -// -// -// describe('progress()', function() { -// it('returns the current position', function() { -// expect(fx.progress()).toBe(0) -// expect(fx.progress()).toBe(fx.pos) -// }) -// it('returns the current position as eased value if fist argument is true', function() { -// var anim = draw.rect(100,100).animate(500,'>').start() -// expect(anim.progress(true)).toBe(0) -// -// anim.at(0.25) -// expect(anim.progress(true)).toBeCloseTo(anim.situation.ease(0.25)) -// }) -// }) -// -// -// describe('after()', function() { -// it('adds a callback which is called when the current animation is finished', function() { -// var called = false -// -// fx.start().after(function(situation){ -// expect(fx.situation).toBe(situation) -// expect(fx.pos).toBe(1) -// called = true -// }) -// -// jasmine.clock().tick(500) -// fx.step() -// expect(called).toBe(true) -// }) -// }) -// -// -// describe('afterAll()', function() { -// it('adds a callback which is called when all animations are finished', function() { -// var called = false -// -// fx.animate(150).animate(125).start().afterAll(function(){ -// expect(fx.pos).toBe(1) -// expect(fx.situations.length).toBe(0) -// called = true -// }) -// -// expect(fx.situations.length).toBe(2) -// -// // End of the first animation -// jasmine.clock().tick(500) -// fx.step() -// expect(fx.situations.length).toBe(1) -// expect(called).toBe(false) -// -// // End of the second animation -// jasmine.clock().tick(150) -// fx.step() -// expect(fx.situations.length).toBe(0) -// expect(called).toBe(false) -// -// // End of the third and last animation -// jasmine.clock().tick(125) -// fx.step() -// expect(fx.situation).toBeNull() -// expect(called).toBe(true) -// }) -// }) -// -// -// describe('during()', function() { -// it('adds a callback which is called on every animation step', function() { -// var called = 0 -// -// fx.start().during(function(pos, morph, eased, situation){ -// -// expect(fx.situation).toBe(situation) -// -// switch(++called) { -// case 1: -// expect(pos).toBeCloseTo(0.25) -// break -// -// case 2: -// expect(pos).toBeCloseTo(0.5) -// break -// -// case 3: -// expect(pos).toBeCloseTo(0.65) -// break -// -// case 4: -// expect(pos).toBe(1) -// break -// } -// -// expect(morph(0, 100)).toBeCloseTo(pos*100) -// -// }) -// -// jasmine.clock().tick(125) -// fx.step() -// expect(called).toBe(1) -// -// jasmine.clock().tick(125) // 250 ms have passed -// fx.step() -// expect(called).toBe(2) -// -// jasmine.clock().tick(75) // 325 ms have passed -// fx.step() -// expect(called).toBe(3) -// -// jasmine.clock().tick(175) // 500 ms have passed -// fx.step() -// expect(called).toBe(4) -// }) -// }) -// -// -// describe('duringAll()', function() { -// it('adds a callback which is called on every animation step for the whole chain', function() { -// -// fx.finish() -// rect.off('.fx') -// -// fx.animate(500).start().animate(500) -// -// var sit = null -// -// var pos1 = false -// var pos2 = false -// -// fx.duringAll(function(pos, morph, eased, situation){ -// -// if(pos1){ -// pos1 = false -// sit = situation -// expect(this.fx.pos).toBeCloseTo(0.6) -// } -// -// if(pos2){ -// pos2 = null -// expect(situation).not.toBe(sit) -// expect(this.fx.pos).toBeCloseTo(0.75) -// } -// }) -// -// pos1 = true -// jasmine.clock().tick(300) -// fx.step() -// -// jasmine.clock().tick(200) // End of the first animation -// fx.step() -// -// pos2 = true -// jasmine.clock().tick(375) -// fx.step() -// -// if(pos1 || pos2) { -// fail('Not enough situations called') -// } -// }) -// }) -// -// -// describe('once()', function() { -// it('adds a callback which is called once at the specified position', function() { -// var called = false -// -// fx.start().once(0.5, function(pos, eased){ -// called = true -// expect(pos).toBeCloseTo(0.5) -// }) -// -// jasmine.clock().tick(125) -// fx.step() -// expect(called).toBe(false) -// -// jasmine.clock().tick(125) // 250 ms have passed -// fx.step() -// expect(called).toBe(true) -// }) -// -// it('adds the callback on the last situation', function () { -// var callback = function () {} -// -// fx.animate(500).animate(500).once(0.5, callback) -// expect(fx.situation.once['0.5']).toBeUndefined() -// expect(fx.situations[0].once['0.5']).toBeUndefined() -// expect(fx.situations[1].once['0.5']).toBe(callback) -// }) -// }) -// -// -// describe('loop()', function() { -// it('should create an eternal loop when no arguments are given', function() { -// var time = 10523, dur = fx.situation.duration -// -// fx.loop() -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.loops).toBe(true) -// expect(fx.pos).toBe(0) -// expect(fx.absPos).toBe(0) -// -// fx.start().step() -// jasmine.clock().tick(time) -// fx.step() -// -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe( Math.floor(time/dur) ) -// expect(fx.situation.loops).toBe(true) -// expect(fx.pos).toBeCloseTo((time/dur) % 1) -// expect(fx.absPos).toBeCloseTo(time/dur) -// }) -// -// it('should create an eternal loop when the first argument is true', function() { -// var time = 850452, dur = fx.situation.duration -// -// fx.loop(true) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.loops).toBe(true) -// expect(fx.pos).toBe(0) -// expect(fx.absPos).toBe(0) -// -// fx.start().step() -// jasmine.clock().tick(time) -// fx.step() -// -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe( Math.floor(time/dur) ) -// expect(fx.situation.loops).toBe(true) -// expect(fx.pos).toBeCloseTo((time/dur) % 1) -// expect(fx.absPos).toBeCloseTo(time/dur) -// }) -// -// it('should loop for the specified number of times', function() { -// var time = 0, dur = fx.situation.duration -// -// fx.loop(3) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.loops).toBe(3) -// expect(fx.pos).toBe(0) -// expect(fx.absPos).toBe(0) -// -// fx.start().step() -// jasmine.clock().tick(200) -// time = 200 -// -// fx.step() -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.loops).toBe(3) -// expect(fx.pos).toBeCloseTo((time/dur) % 1) -// expect(fx.absPos).toBeCloseTo(time/dur) -// -// jasmine.clock().tick(550) -// time += 550 // time at 750 -// -// fx.step() -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe(1) -// expect(fx.situation.loops).toBe(3) -// expect(fx.pos).toBeCloseTo((time/dur) % 1) -// expect(fx.absPos).toBeCloseTo(time/dur) -// -// jasmine.clock().tick(570) -// time += 570 // time at 1320 -// -// fx.step() -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe(2) -// expect(fx.situation.loops).toBe(3) -// expect(fx.pos).toBeCloseTo((time/dur) % 1) -// expect(fx.absPos).toBeCloseTo(time/dur) -// -// jasmine.clock().tick(180) -// time += 180 // time at 1500 -// -// fx.step() -// expect(fx.active).toBe(false) -// expect(fx.situation).toBeNull() -// expect(fx.pos).toBe(1) -// expect(fx.absPos).toBe(3) -// }) -// -// it('should go from beginning to end and start over again (0->1.0->1.0->1.) by default', function() { -// var time = 0, dur = fx.situation.duration -// -// fx.loop(2) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.loops).toBe(2) -// expect(fx.situation.reversing).toBe(false) -// expect(fx.situation.reversed).toBe(false) -// expect(fx.pos).toBe(0) -// expect(fx.absPos).toBe(0) -// -// fx.start().step() -// jasmine.clock().tick(325) -// time = 325 -// -// fx.step() -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.loops).toBe(2) -// expect(fx.situation.reversing).toBe(false) -// expect(fx.situation.reversed).toBe(false) -// expect(fx.pos).toBeCloseTo((time/dur) % 1) -// expect(fx.absPos).toBeCloseTo(time/dur) -// -// jasmine.clock().tick(575) -// time += 575 // time at 900 -// -// fx.step() -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe(1) -// expect(fx.situation.loops).toBe(2) -// expect(fx.situation.reversing).toBe(false) -// expect(fx.situation.reversed).toBe(false) -// expect(fx.pos).toBeCloseTo((time/dur) % 1) -// expect(fx.absPos).toBeCloseTo(time/dur) -// -// jasmine.clock().tick(200) -// time += 200 // time at 1100 -// -// fx.step() -// expect(fx.active).toBe(false) -// expect(fx.situation).toBeNull() -// expect(fx.pos).toBe(1) -// expect(fx.absPos).toBe(2) -// }) -// -// it('should be completely reversed before starting over (0->1->0->1->0->1.) when the reverse flag is passed', function() { -// var time = 0, dur = fx.situation.duration -// -// fx.loop(2, true) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.loops).toBe(2) -// expect(fx.situation.reversing).toBe(true) -// expect(fx.situation.reversed).toBe(false) -// expect(fx.pos).toBe(0) -// expect(fx.absPos).toBe(0) -// -// fx.start().step() -// jasmine.clock().tick(325) -// time = 325 -// -// fx.step() -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.loops).toBe(2) -// expect(fx.situation.reversing).toBe(true) -// expect(fx.situation.reversed).toBe(false) -// expect(fx.pos).toBeCloseTo((time/dur) % 1) -// expect(fx.absPos).toBeCloseTo(time/dur) -// -// jasmine.clock().tick(575) -// time += 575 // time at 900 -// -// fx.step() -// expect(fx.active).toBe(true) -// expect(fx.situation.loop).toBe(1) -// expect(fx.situation.loops).toBe(2) -// expect(fx.situation.reversing).toBe(true) -// expect(fx.situation.reversed).toBe(true) -// expect(fx.pos).toBeCloseTo(1 - (time/dur) % 1) -// expect(fx.absPos).toBeCloseTo(time/dur) -// -// jasmine.clock().tick(200) -// time += 200 // time at 1100 -// -// fx.step() -// expect(fx.active).toBe(false) -// expect(fx.situation).toBeNull() -// expect(fx.pos).toBe(0) -// expect(fx.absPos).toBe(2) -// }) -// -// it('should be applied on the last situation', function() { -// fx.loop(5) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.loops).toBe(5) -// expect(fx.situation.reversing).toBe(false) -// -// fx.animate().loop(3, true) -// expect(fx.situation.loop).toBe(0) -// expect(fx.situation.loops).toBe(5) -// expect(fx.situation.reversing).toBe(false) -// -// var c = fx.last() -// expect(c.loop).toBe(0) -// expect(c.loops).toBe(3) -// expect(c.reversing).toBe(true) -// }) -// -// it('should be possible to call it with false as the first argument', function() { -// fx.situation.loops = true -// fx.loop(false) -// expect(fx.situation.loops).toBe(false) -// }) -// }) -// -// -// describe('step()', function() { -// it('should not recalculate the absolute position if the first parameter is true', function() { -// var absPos -// -// // We shift start to help us see if the absolute position get recalculated -// // If it get recalculated, the result would be 0.5 -// fx.situation.start -= 250 -// -// absPos = 0.4 -// fx.absPos = absPos -// expect(fx.step(true).absPos).toBe(absPos) -// -// absPos = 0 -// fx.absPos = absPos -// expect(fx.step(true).absPos).toBe(absPos) -// -// absPos = -3.7 -// fx.absPos = absPos -// expect(fx.step(true).absPos).toBe(absPos) -// -// absPos = 1 -// fx.absPos = absPos -// expect(fx.step(true).absPos).toBe(absPos) -// }) -// -// it('should not allow an absolute position to be above the end', function() { -// var absPos, loops -// -// // With no loops, absolute position should not go above 1 -// absPos = 4.26 -// fx.absPos = absPos -// expect(fx.step(true).absPos).toBe(1) -// expect(fx.situation).toBeNull() -// -// fx.animate() // Recreate an animation since the other one was ended -// -// // With loops, absolute position should not go above loops -// loops = 4 -// absPos = 7.42 -// fx.absPos = absPos -// expect(fx.loop(loops).step(true).absPos).toBe(loops) -// expect(fx.situation).toBeNull() -// }) -// -// describe('when converting an absolute position to a position', function() { -// it('should, when the absolute position is below the maximum number of loops, use the integer part of the absolute position to set the loop counter and use its fractional part to set the position', function(){ -// var absPos, absPosFrac, absPosInt, loops -// -// // Without the reverse flag -// loops = 12 -// absPos = 4.52 -// absPosInt = Math.floor(absPos) -// absPosFrac = absPos - absPosInt -// fx.absPos = absPos -// fx.loop(loops).step(true) -// expect(fx.pos).toBe(absPosFrac) -// expect(fx.situation.loop).toBe(absPosInt) -// -// fx.stop().animate() -// -// loops = true -// absPos = 2.57 -// absPosInt = Math.floor(absPos) -// absPosFrac = absPos - absPosInt -// fx.absPos = absPos -// fx.loop(loops).step(true) -// expect(fx.pos).toBe(absPosFrac) -// expect(fx.situation.loop).toBe(absPosInt) -// -// fx.stop().animate() -// -// // With the reverse flag, the position is reversed at each odd loop -// loops = 412 -// absPos = 6.14 -// absPosInt = Math.floor(absPos) -// absPosFrac = absPos - absPosInt -// fx.absPos = absPos -// fx.loop(loops, true).step(true) -// expect(fx.pos).toBe(absPosFrac) -// expect(fx.situation.loop).toBe(absPosInt) -// expect(fx.situation.reversed).toBe(false) -// -// fx.stop().animate() -// -// loops = true -// absPos = 5.12 -// absPosInt = Math.floor(absPos) -// absPosFrac = absPos - absPosInt -// fx.absPos = absPos -// fx.loop(loops, true).step(true) -// expect(fx.pos).toBe(1-absPosFrac) // Odd loop, so it is reversed -// expect(fx.situation.loop).toBe(absPosInt) -// expect(fx.situation.reversed).toBe(true) -// -// fx.stop().animate() -// -// // When the animation is set to run backward, it is the opposite, the position is reversed at each even loop -// loops = 14 -// absPos = 8.46 -// absPosInt = Math.floor(absPos) -// absPosFrac = absPos - absPosInt -// fx.absPos = absPos -// fx.reverse(true).loop(loops, true).step(true) -// expect(fx.pos).toBe(1-absPosFrac) // Even loop, so it is reversed -// expect(fx.situation.loop).toBe(absPosInt) -// expect(fx.situation.reversed).toBe(true) -// -// fx.stop().animate() -// -// loops = true -// absPos = 3.12 -// absPosInt = Math.floor(absPos) -// absPosFrac = absPos - absPosInt -// fx.absPos = absPos -// fx.reverse(true).loop(loops, true).step(true) -// expect(fx.pos).toBe(absPosFrac) -// expect(fx.situation.loop).toBe(absPosInt) -// expect(fx.situation.reversed).toBe(false) -// }) -// -// it('should, when the absolute position is above or equal to the the maximum number of loops, set the position to its end value and end the animation', function() { -// var absPos, loops -// -// // Without the reverse flag, the end value of position is 1 -// loops = 6 -// absPos = 13.52 -// fx.absPos = absPos -// fx.loop(loops).step(true) -// expect(fx.pos).toBe(1) -// expect(fx.situation).toBeNull() -// -// fx.animate() // Recreate an animation since the other one was ended -// -// loops = false -// absPos = 146.22 -// fx.absPos = absPos -// fx.loop(loops).step(true) -// expect(fx.pos).toBe(1) -// expect(fx.situation).toBeNull() -// -// fx.animate() // Recreate an animation since the other one was ended -// -// // With the reverse flag, the end value of position is 0 when loops is even and 1 when loops is an odd number or false -// loops = 6 -// absPos = 6 -// fx.absPos = absPos -// fx.loop(loops, true).step(true) -// expect(fx.pos).toBe(0) // Even loops -// expect(fx.situation).toBeNull() -// -// fx.animate() // Recreate an animation since the other one was ended -// -// loops = false -// absPos = 4.47 -// fx.absPos = absPos -// fx.loop(loops, true).step(true) -// expect(fx.pos).toBe(1) // 1 since loops is false -// expect(fx.situation).toBeNull() -// -// fx.animate() // Recreate an animation since the other one was ended -// -// // When the animation is set to run backward, it is the opposite, the end value of position is 1 when loops is even and 0 when loops is an odd number or false -// loops = 8 -// absPos = 12.65 -// fx.absPos = absPos -// fx.reverse(true).loop(loops, true).step(true) -// expect(fx.pos).toBe(1) // Even loops -// expect(fx.situation).toBeNull() -// -// fx.animate() // Recreate an animation since the other one was ended -// -// loops = 11 -// absPos = 12.41 -// fx.absPos = absPos -// fx.reverse(true).loop(loops, true).step(true) -// expect(fx.pos).toBe(0) // Odd loops -// expect(fx.situation).toBeNull() -// }) -// -// it('should set the position to its start value when the absolute position is below 0', function() { -// var absPos -// -// // When the animation is not set to run backward the start value is 0 -// absPos = -2.27 -// fx.loop(7) -// fx.situation.loop = 3 -// fx.absPos = absPos -// fx.step(true) -// expect(fx.pos).toBe(0) -// expect(fx.absPos).toBe(absPos) -// expect(fx.situation.loop).toBe(0) -// -// fx.stop().animate() -// -// // When the animation is set to run backward the start value is 1 -// absPos = -4.12 -// fx.absPos = absPos -// fx.reverse(true).step(true) -// expect(fx.pos).toBe(1) -// expect(fx.absPos).toBe(absPos) -// }) -// -// it('should, when looping with the reverse flag, toggle reversed only when the difference between the new value of loop counter and its old value is odd', function() { -// // The new value of the loop counter is the integer part of absPos -// -// fx.loop(9, true) -// expect(fx.situation.loop).toBe(0) -// expect(fx.pos).toBe(0) -// expect(fx.situation.reversed).toBe(false) -// -// fx.absPos = 3 -// fx.step(true) -// expect(fx.situation.reversed).toBe(true) // (3-0) is odd -// -// fx.absPos = 1 -// fx.step(true) -// expect(fx.situation.reversed).toBe(true) // (1-3) is even -// -// fx.absPos = 6 -// fx.step(true) -// expect(fx.situation.reversed).toBe(false) // (6-1) is odd -// -// fx.absPos = 9 -// fx.step(true) -// expect(fx.situation).toBeNull() -// expect(fx.pos).toBe(1) // It should end not reversed, which mean the position is expected to be 1 -// // ((9-1)-6) is even, the -1 is because we do not want reversed to be toggled after the last loop -// }) -// }) -// -// -// it('should not throw an error when stop is called in a during callback', function () { -// fx.move(100,100).start() -// fx.during(function () {this.stop()}) -// expect(fx.step.bind(fx)).not.toThrow() -// }) -// -// it('should not throw an error when finish is called in a during callback', function () { -// fx.move(100,100).start() -// fx.during(function () {this.finish()}) -// expect(fx.step.bind(fx)).not.toThrow() -// }) -// -// it('should not set active to false if the afterAll callback add situations to the situations queue', function () { -// fx.afterAll(function(){this.animate(500).move(0,0)}) -// -// jasmine.clock().tick(500) -// fx.step() -// expect(fx.active).toBe(true) -// expect(fx.situation).not.toBeNull() -// expect(fx.situations.length).toBe(0) -// -// jasmine.clock().tick(500) -// fx.step() -// expect(fx.active).toBe(false) -// expect(fx.situation).toBeNull() -// expect(fx.situations.length).toBe(0) -// }) -// }) -// -// -// it('animates the x/y-attr', function() { -// var called = false -// -// fx.move(200,200).after(function(){ -// -// expect(rect.x()).toBe(200) -// expect(rect.y()).toBe(200) -// called = true -// -// }) -// -// jasmine.clock().tick(250) -// fx.step() -// expect(rect.x()).toBeGreaterThan(100) -// expect(rect.y()).toBeGreaterThan(100) -// -// jasmine.clock().tick(250) -// fx.step() -// expect(called).toBe(true) -// }) -// -// // it('animates matrix', function() { -// // var ctm, called = false -// // -// // fx.transform({a:0.8, b:0.4, c:-0.15, d:0.7, e: 90.3, f: 27.07}).after(function(){ -// // -// // var ctm = rect.ctm() -// // expect(ctm.a).toBeCloseTo(0.8) -// // expect(ctm.b).toBeCloseTo(0.4) -// // expect(ctm.c).toBeCloseTo(-0.15) -// // expect(ctm.d).toBeCloseTo(0.7) -// // expect(ctm.e).toBeCloseTo(90.3) -// // expect(ctm.f).toBeCloseTo(27.07) -// // called = true -// // -// // }) -// // -// // jasmine.clock().tick(250) -// // fx.step() -// // ctm = rect.ctm() -// // expect(ctm.a).toBeLessThan(1) -// // expect(ctm.b).toBeGreaterThan(0) -// // expect(ctm.c).toBeLessThan(0) -// // expect(ctm.d).toBeGreaterThan(0) -// // expect(ctm.e).toBeGreaterThan(0) -// // expect(ctm.f).toBeGreaterThan(0) -// // -// // jasmine.clock().tick(250) -// // fx.step() -// // expect(called).toBe(true) -// // }) -// -// // it('animate a scale transform using the passed center point when there is already a transform in place', function(){ -// // var ctm -// // -// // // When no ceter point is passed to the method scale, it use the center of the element as the center point -// // -// // rect.scale(2) // The transform in place -// // -// // fx.scale(0.5) -// // jasmine.clock().tick(500) // Have the animation reach its end -// // fx.step() -// // -// // ctm = rect.ctm() -// // expect(ctm.a).toBe(0.5) -// // expect(ctm.b).toBe(0) -// // expect(ctm.c).toBe(0) -// // expect(ctm.d).toBe(0.5) -// // expect(ctm.e).toBe(75) -// // expect(ctm.f).toBe(75) -// // }) -// -// // it('animate a flip(x) transform', function() { -// // var ctm -// // -// // fx.transform({flip: 'x'}).start() -// // -// // jasmine.clock().tick(125) // Have the animation be 1/4 of the way (not halfway as usual because of a bug in the node method getCTM on Firefox) -// // fx.step() -// // -// // ctm = rect.ctm() -// // expect(ctm.a).toBe(0.5) -// // expect(ctm.b).toBe(0) -// // expect(ctm.c).toBe(0) -// // expect(ctm.d).toBe(1) -// // expect(ctm.e).toBe(75) -// // expect(ctm.f).toBe(0) -// // -// // jasmine.clock().tick(475) // Have the animation reach its end -// // fx.step() -// // -// // ctm = rect.ctm() -// // expect(ctm.a).toBe(-1) -// // expect(ctm.b).toBe(0) -// // expect(ctm.c).toBe(0) -// // expect(ctm.d).toBe(1) -// // expect(ctm.e).toBe(300) -// // expect(ctm.f).toBe(0) -// // }) -// -// // it('animate a flip(x) transform with an offset', function() { -// // var ctm -// // -// // fx.transform({flip: 'x', offset: 20}).start() -// // -// // jasmine.clock().tick(125) // Have the animation be 1/4 of the way (not halfway as usual because of a bug in the node method getCTM on Firefox) -// // fx.step() -// // -// // ctm = rect.ctm() -// // expect(ctm.a).toBe(0.5) -// // expect(ctm.b).toBe(0) -// // expect(ctm.c).toBe(0) -// // expect(ctm.d).toBe(1) -// // expect(ctm.e).toBe(10) -// // expect(ctm.f).toBe(0) -// // -// // jasmine.clock().tick(475) // Have the animation reach its end -// // fx.step() -// // -// // ctm = rect.ctm() -// // expect(ctm.a).toBe(-1) -// // expect(ctm.b).toBe(0) -// // expect(ctm.c).toBe(0) -// // expect(ctm.d).toBe(1) -// // expect(ctm.e).toBe(40) -// // expect(ctm.f).toBe(0) -// // }) -// -// // it('animate a flip(y) transform', function() { -// // var ctm -// // -// // fx.transform({flip: 'y'}).start() -// // -// // jasmine.clock().tick(125) // Have the animation be 1/4 of the way (not halfway as usual because of a bug in the node method getCTM on Firefox) -// // fx.step() -// // -// // ctm = rect.ctm() -// // expect(ctm.a).toBe(1) -// // expect(ctm.b).toBe(0) -// // expect(ctm.c).toBe(0) -// // expect(ctm.d).toBe(0.5) -// // expect(ctm.e).toBe(0) -// // expect(ctm.f).toBe(75) -// // -// // jasmine.clock().tick(475) // Have the animation reach its end -// // fx.step() -// // -// // ctm = rect.ctm() -// // expect(ctm.a).toBe(1) -// // expect(ctm.b).toBe(0) -// // expect(ctm.c).toBe(0) -// // expect(ctm.d).toBe(-1) -// // expect(ctm.e).toBe(0) -// // expect(ctm.f).toBe(300) -// // }) -// -// // it('animate a flip(y) transform with an offset', function() { -// // var ctm -// // -// // fx.transform({flip: 'y', offset: 20}).start() -// // -// // jasmine.clock().tick(125) // Have the animation be 1/4 of the way (not halfway as usual because of a bug in the node method getCTM on Firefox) -// // fx.step() -// // -// // ctm = rect.ctm() -// // expect(ctm.a).toBe(1) -// // expect(ctm.b).toBe(0) -// // expect(ctm.c).toBe(0) -// // expect(ctm.d).toBe(0.5) -// // expect(ctm.e).toBe(0) -// // expect(ctm.f).toBe(10) -// // -// // jasmine.clock().tick(475) // Have the animation reach its end -// // fx.step() -// // -// // ctm = rect.ctm() -// // expect(ctm.a).toBe(1) -// // expect(ctm.b).toBe(0) -// // expect(ctm.c).toBe(0) -// // expect(ctm.d).toBe(-1) -// // expect(ctm.e).toBe(0) -// // expect(ctm.f).toBe(40) -// // }) -// -// // it('animate a flip() transform', function() { -// // var ctm -// // -// // fx.transform({flip: 'both'}).start() -// // -// // jasmine.clock().tick(125) // Have the animation be 1/4 of the way (not halfway as usual because of a bug in the node method getCTM on Firefox) -// // fx.step() -// // -// // ctm = rect.ctm() -// // expect(ctm.a).toBe(0.5) -// // expect(ctm.b).toBe(0) -// // expect(ctm.c).toBe(0) -// // expect(ctm.d).toBe(0.5) -// // expect(ctm.e).toBe(75) -// // expect(ctm.f).toBe(75) -// // -// // jasmine.clock().tick(475) // Have the animation reach its end -// // fx.step() -// // -// // ctm = rect.ctm() -// // expect(ctm.a).toBe(-1) -// // expect(ctm.b).toBe(0) -// // expect(ctm.c).toBe(0) -// // expect(ctm.d).toBe(-1) -// // expect(ctm.e).toBe(300) -// // expect(ctm.f).toBe(300) -// // }) -// -// // it('animate a flip() transform with an offset', function() { -// // var ctm -// // -// // fx.transform({flip: 'both', offset: 20}).start() -// // -// // jasmine.clock().tick(125) // Have the animation be 1/4 of the way (not halfway as usual because of a bug in the node method getCTM on Firefox) -// // fx.step() -// // -// // ctm = rect.ctm() -// // expect(ctm.a).toBe(0.5) -// // expect(ctm.b).toBe(0) -// // expect(ctm.c).toBe(0) -// // expect(ctm.d).toBe(0.5) -// // expect(ctm.e).toBe(10) -// // expect(ctm.f).toBe(10) -// // -// // jasmine.clock().tick(475) // Have the animation reach its end -// // fx.step() -// // -// // ctm = rect.ctm() -// // expect(ctm.a).toBe(-1) -// // expect(ctm.b).toBe(0) -// // expect(ctm.c).toBe(0) -// // expect(ctm.d).toBe(-1) -// // expect(ctm.e).toBe(40) -// // expect(ctm.f).toBe(40) -// // }) -// -// // it('animate relative matrix transform', function(){ -// // var ctm -// // -// // fx.transform(new SVG.Matrix().scale(2,0,0), true) -// // -// // jasmine.clock().tick(250) // Have the animation be half way -// // fx.step() -// // -// // ctm = rect.ctm() -// // expect(ctm.a).toBe(1.5) -// // expect(ctm.b).toBe(0) -// // expect(ctm.c).toBe(0) -// // expect(ctm.d).toBe(1.5) -// // expect(ctm.e).toBe(0) -// // expect(ctm.f).toBe(0) -// // -// // jasmine.clock().tick(250) // Have the animation reach its end -// // fx.step() -// // -// // ctm = rect.ctm() -// // expect(ctm.a).toBe(2) -// // expect(ctm.b).toBe(0) -// // expect(ctm.c).toBe(0) -// // expect(ctm.d).toBe(2) -// // expect(ctm.e).toBe(0) -// // expect(ctm.f).toBe(0) -// // }) -// -// describe('when animating plots', function() { -// it('should allow plot animations to be chained', function() { -// var pathString1 = 'M10 80 C 40 10, 65 10, 95 80 S 150 150, 180 80' -// , pathString2 = 'M10 80 C 40 150, 65 150, 95 80 S 150 10, 180 80' -// , path = draw.path(pathString1) -// , morph -// -// fx = path.animate(1000).plot(pathString2).animate(1000).plot(pathString1) -// morph = new SVG.PathArray(pathString1).morph(pathString2) -// -// fx.start() -// expect(path.array()).toEqual(morph.at(0)) -// -// jasmine.clock().tick(500) // Have the first animation be half way -// fx.step() -// expect(path.array()).toEqual(morph.at(0.5)) -// -// jasmine.clock().tick(500) // Have the first animation reach its end -// fx.step() -// expect(path.array()).toEqual(morph.at(1)) -// morph = new SVG.PathArray(pathString2).morph(pathString1) -// expect(path.array()).toEqual(morph.at(0)) -// -// jasmine.clock().tick(500) // Have the second animation be half way -// fx.step() -// expect(path.array()).toEqual(morph.at(0.5)) -// -// jasmine.clock().tick(500) // Have the second animation reach its end -// fx.step() -// expect(path.array()).toEqual(morph.at(1)) -// }) -// -// it('should allow plot to be called on a polyline', function() { -// var startValue = [[0,0], [100,50], [50,100], [150,50], [200,50]] -// , endValue = [[0,0], [100,50], [50,100], [150,50], [200,50], [250,100], [300,50], [350,50]] -// , morph = new SVG.PointArray(startValue).morph(endValue) -// , polyline = draw.polyline(startValue) -// -// fx = polyline.animate(3000).plot(endValue) -// -// fx.start() -// expect(polyline.array()).toEqual(morph.at(0)) -// -// jasmine.clock().tick(1500) // Have the animation be half way -// fx.step() -// expect(polyline.array()).toEqual(morph.at(0.5)) -// -// jasmine.clock().tick(1500) // Have the animation reach its end -// fx.step() -// expect(polyline.array()).toEqual(morph.at(1)) -// }) -// -// it('should allow plot to be called on a polygon', function() { -// var startValue = [[0,0], [100,50], [50,100], [150,50], [200,50]] -// , endValue = [[0,0], [100,50], [50,100], [150,50], [200,50], [250,100], [300,50], [350,50]] -// , morph = new SVG.PointArray(startValue).morph(endValue) -// , polygon = draw.polygon(startValue) -// -// fx = polygon.animate(3000).plot(endValue) -// -// fx.start() -// expect(polygon.array()).toEqual(morph.at(0)) -// -// jasmine.clock().tick(1500) // Have the animation be half way -// fx.step() -// expect(polygon.array()).toEqual(morph.at(0.5)) -// -// jasmine.clock().tick(1500) // Have the animation reach its end -// fx.step() -// expect(polygon.array()).toEqual(morph.at(1)) -// }) -// -// it('should allow plot to be called on a path', function() { -// var startValue = new SVG.PathArray('M10 80 C 40 10, 65 10, 95 80 S 150 150, 180 80') -// , endValue = new SVG.PathArray('M10 80 C 40 150, 65 150, 95 80 S 150 10, 180 80') -// , morph = new SVG.PathArray(startValue).morph(endValue) -// , path = draw.path(startValue) -// -// fx = path.animate(2000).plot(endValue) -// -// fx.start() -// expect(path.array()).toEqual(morph.at(0)) -// -// jasmine.clock().tick(1000) // Have the animation be half way -// fx.step() -// expect(path.array()).toEqual(morph.at(0.5)) -// -// jasmine.clock().tick(1000) // Have the animation reach its end -// fx.step() -// expect(path.array()).toEqual(morph.at(1)) -// }) -// -// it('should allow plot to be called on a textpath', function() { -// var startValue = new SVG.PathArray('M10 80 C 40 10, 65 10, 95 80 S 150 150, 180 80') -// , endValue = new SVG.PathArray('M10 80 C 40 150, 65 150, 95 80 S 150 10, 180 80') -// , morph = new SVG.PathArray(startValue).morph(endValue) -// , textPath -// -// var text = draw.text(function(add) { -// add.tspan("We go up and down, then we go down, then up again") -// }) -// -// textPath = text.path(startValue) -// fx = textPath.animate(500).plot(endValue) -// -// fx.start() -// expect(textPath.array()).toEqual(morph.at(0)) -// -// jasmine.clock().tick(250) // Have the animation be half way -// fx.step() -// expect(textPath.array()).toEqual(morph.at(0.5)) -// -// jasmine.clock().tick(250) // Have the animation reach its end -// fx.step() -// expect(textPath.array()).toEqual(morph.at(1)) -// }) -// -// it('should allow plot to be called on a line', function() { -// var startValue = '0,0 100,150' -// , endValue = [[50,30], [120,250]] -// , morph = new SVG.PointArray(startValue).morph(endValue) -// , line = draw.line(startValue) -// -// fx = line.animate(3000).plot(endValue) -// -// fx.start() -// expect(line.array()).toEqual(morph.at(0)) -// -// jasmine.clock().tick(1500) // Have the animation be half way -// fx.step() -// expect(line.array()).toEqual(morph.at(0.5)) -// -// jasmine.clock().tick(1500) // Have the animation reach its end -// fx.step() -// expect(line.array()).toEqual(morph.at(1)) -// }) -// -// it('should allow plot to be called with 4 parameters on a line', function () { -// var startPointArray = new SVG.PointArray('0,0 100,150') -// , endPointArray = new SVG.PointArray([[50,30], [120,250]]) -// , morph = new SVG.PointArray(startPointArray).morph(endPointArray) -// , a -// -// a = startPointArray.value -// var line = draw.line(a[0][0], a[0][1], a[1][0], a[1][1]) -// -// a = endPointArray.value -// fx = line.animate(3000).plot(a[0][0], a[0][1], a[1][0], a[1][1]) -// -// fx.start() -// expect(line.array()).toEqual(morph.at(0)) -// -// jasmine.clock().tick(1500) // Have the animation be half way -// fx.step() -// expect(line.array()).toEqual(morph.at(0.5)) -// -// jasmine.clock().tick(1500) // Have the animation reach its end -// fx.step() -// expect(line.array()).toEqual(morph.at(1)) -// }) -// }) -// -// -// describe('when animating attributes', function() { -// it('should be possible to animate numeric attributes', function () { -// var startValue = 0 -// , endValue = 150 -// , morph = new SVG.Number(startValue).morph(endValue) -// -// var text = draw.text(function(add) { -// add.tspan('We go ') -// add.tspan('up').fill('#f09').dy(-40) -// add.tspan(', then we go down, then up again').dy(40) -// }) -// -// var path = 'M 100 200 C 200 100 300 0 400 100 C 500 200 600 300 700 200 C 800 100 900 100 900 100' -// -// var textPath = text.path(path).font({ size: 42.5, family: 'Verdana' }) -// -// -// textPath.attr('startOffset', startValue) -// fx = textPath.animate(1000).attr('startOffset', endValue) -// -// fx.start() -// expect(textPath.attr('startOffset')).toBe(morph.at(0).value) -// -// jasmine.clock().tick(500) // Have the animation be half way -// fx.step() -// expect(textPath.attr('startOffset')).toBe(morph.at(0.5).value) -// -// jasmine.clock().tick(500) // Have the animation reach its end -// fx.step() -// expect(textPath.attr('startOffset')).toBe(morph.at(1).value) -// }) -// -// it('should be possible to animate non-numeric attributes', function () { -// var startValue = 'butt' -// , endValue = 'round' -// , line = draw.line('0,0 100,150').attr('stroke-linecap', startValue) -// -// fx = line.animate(3000).attr('stroke-linecap', endValue) -// -// fx.start() -// expect(line.attr('stroke-linecap')).toBe(startValue) -// -// jasmine.clock().tick(1500) // Have the animation be half way -// fx.step() -// expect(line.attr('stroke-linecap')).toBe(startValue) -// -// jasmine.clock().tick(1500) // Have the animation reach its end -// fx.step() -// expect(line.attr('stroke-linecap')).toBe(endValue) -// }) -// -// it('should be possible to animate color attributes by using SVG.Color', function() { -// var startValue = 'rgb(42,251,100)' -// , endValue = 'rgb(10,80,175)' -// , morph = new SVG.Color(startValue).morph(endValue) -// -// rect.attr('fill', startValue) -// fx.attr('fill', endValue) -// -// fx.start() -// expect(rect.attr('fill')).toBe(morph.at(0).toString()) -// -// jasmine.clock().tick(250) // Have the animation be half way -// fx.step() -// expect(rect.attr('fill')).toBe(morph.at(0.5).toString()) -// -// jasmine.clock().tick(250) // Have the animation reach its end -// fx.step() -// expect(rect.attr('fill')).toBe(morph.at(1).toString()) -// }) -// -// it('should be possible to pass percentage strings to numeric attributes', function () { -// var startValue = '0%' -// , endValue = '80%' -// , morph = new SVG.Number(startValue).morph(endValue) -// -// var text = draw.text(function(add) { -// add.tspan('We go ') -// add.tspan('up').fill('#f09').dy(-40) -// add.tspan(', then we go down, then up again').dy(40) -// }) -// -// var path = 'M 100 200 C 200 100 300 0 400 100 C 500 200 600 300 700 200 C 800 100 900 100 900 100' -// -// var textPath = text.path(path).font({ size: 42.5, family: 'Verdana' }) -// -// textPath.attr('startOffset', startValue) -// fx = textPath.animate(1000).attr('startOffset', endValue) -// -// fx.start() -// expect(textPath.attr('startOffset')).toBe(morph.at(0).toString()) -// -// jasmine.clock().tick(500) // Have the animation be half way -// fx.step() -// expect(textPath.attr('startOffset')).toBe(morph.at(0.5).toString()) -// -// jasmine.clock().tick(500) // Have the animation reach its end -// fx.step() -// expect(textPath.attr('startOffset')).toBe(morph.at(1).toString()) -// }) -// -// it('should allow 0 to be specified without unit', function () { -// // This code snippet come from issue #552 -// -// var gradient = draw.gradient('linear', function(add) { -// s1 = add.stop(0, '#33235b') -// s2 = add.stop(0.5, '#E97639') -// s3 = add.stop(1, '#33235b') -// }) -// -// var r1, r2; -// var fill = draw.pattern('300%', '100%', function(add) { -// r1 = add.rect('150%', '100%').fill(gradient) -// r2 = add.rect('150%', '100%').fill(gradient) -// }); -// fill.attr({patternUnits: 'userSpaceOnUse'}) -// -// r1.attr('x', 0).animate('0.5s').attr('x', '150%') -// r2.attr('x', '-150%').animate('0.5s').attr('x', 0) -// -// var text = draw.text('Manifesto').move('50%', '50%').fill(fill) -// text.font({ -// size: 70 -// , anchor: 'middle' -// , leading: 1 -// }) -// -// r1.fx.start() -// r2.fx.start() -// -// jasmine.clock().tick(250) // Have the animation be half way -// r1.fx.step() -// r2.fx.step() -// expect(r1.attr('x')).toBe('75%') -// expect(r2.attr('x')).toBe('-75%') -// -// jasmine.clock().tick(250) // Have the animation reach its end -// r1.fx.step() -// r2.fx.step() -// expect(r1.attr('x')).toBe('150%') -// expect(r2.attr('x')).toBe('0%') -// }) -// }) -// -// -// describe('when animating styles', function() { -// it('should be possible to animate numeric styles', function () { -// var startValue = 0 -// , endValue = 5 -// , morph = new SVG.Number(startValue).morph(endValue) -// -// rect.css('stroke-width', startValue) -// fx.css('stroke-width', endValue) -// -// fx.start() -// expect(rect.css('stroke-width')).toBe(morph.at(0).toString()) -// -// jasmine.clock().tick(250) // Have the animation be half way -// fx.step() -// expect(rect.css('stroke-width')).toBe(morph.at(0.5).toString()) -// -// jasmine.clock().tick(250) // Have the animation reach its end -// fx.step() -// expect(rect.css('stroke-width')).toBe(morph.at(1).toString()) -// }) -// -// it('should be possible to animate non-numeric styles', function () { -// var startValue = 'butt' -// , endValue = 'round' -// , line = draw.line('0,0 100,150').css('stroke-linecap', startValue) -// -// fx = line.animate(3000).css('stroke-linecap', endValue) -// -// fx.start() -// expect(line.css('stroke-linecap')).toBe(startValue) -// -// jasmine.clock().tick(1500) // Have the animation be half way -// fx.step() -// expect(line.css('stroke-linecap')).toBe(startValue) -// -// jasmine.clock().tick(1500) // Have the animation reach its end -// fx.step() -// expect(line.css('stroke-linecap')).toBe(endValue) -// }) -// -// it('should be possible to animate color styles by using SVG.Color', function() { -// var startValue = '#81DE01' -// , endValue = '#B1835D' -// , morph = new SVG.Color(startValue).morph(endValue) -// -// rect.css('fill', startValue) -// fx.css('fill', endValue) -// -// -// fx.start() -// // When setting a style color, it get saved as a rgb() string even if it was passed as an hex code -// // The style rgb string has spaces while the one returned by SVG.Color do not as show bellow -// // CSS: rgb(255, 255, 255) SVG.Color: rgb(255,255,255) -// // The space in the style rbg string are removed so they can be equal -// expect(rect.css('fill').replace(/\s+/g, '')).toBe(morph.at(0).toRgb()) -// -// jasmine.clock().tick(250) // Have the animation be half way -// fx.step() -// expect(rect.css('fill').replace(/ /g, '')).toBe(morph.at(0.5).toRgb()) -// -// jasmine.clock().tick(250) // Have the animation reach its end -// fx.step() -// expect(rect.css('fill').replace(/ /g, '')).toBe(morph.at(1).toRgb()) -// }) -// -// it('should be possible to pass percentage strings to numeric styles', function () { -// var startValue = '0%' -// , endValue = '5%' -// , morph = new SVG.Number(startValue).morph(endValue) -// -// rect.css('stroke-width', startValue) -// fx.css('stroke-width', endValue) -// -// fx.start() -// expect(rect.css('stroke-width')).toBe(morph.at(0).toString()) -// -// jasmine.clock().tick(250) // Have the animation be half way -// fx.step() -// expect(rect.css('stroke-width')).toBe(morph.at(0.5).toString()) -// -// jasmine.clock().tick(250) // Have the animation reach its end -// fx.step() -// expect(rect.css('stroke-width')).toBe(morph.at(1).toString()) -// }) -// -// it('should allow 0 to be specified without a unit', function () { -// var r1 = draw.rect(100,100).move(200,200) -// , r2 = draw.rect(100,100).move(400,400) -// -// r1.css('stroke-width', '100%').animate(500).css('stroke-width', 0) -// r2.css('stroke-width', 0).animate(500).css('stroke-width', '100%') -// -// r1.fx.start() -// r2.fx.start() -// expect(r1.css('stroke-width')).toBe('100%') -// expect(r2.css('stroke-width')).toBe('0%') -// -// jasmine.clock().tick(250) // Have the animation be half way -// r1.fx.step() -// r2.fx.step() -// expect(r1.css('stroke-width')).toBe('50%') -// expect(r2.css('stroke-width')).toBe('50%') -// -// jasmine.clock().tick(250) // Have the animation reach its end -// r1.fx.step() -// r2.fx.step() -// expect(r1.css('stroke-width')).toBe('0%') -// expect(r2.css('stroke-width')).toBe('100%') -// }) -// }) -// -// -// describe('add()', function() { -// it('adds to animations obj by default', function() { -// fx.add('x', new SVG.Number(20)) -// expect(fx.situation.animations.x.value).toBe(20) -// }) -// -// it('adds to specified obj', function() { -// fx.add('x', new SVG.Number(20), 'animations') -// fx.add('x', new SVG.Number(20), 'attrs') -// fx.add('x', new SVG.Number(20), 'styles') -// expect(fx.situation.animations.x.value).toBe(20) -// expect(fx.situation.attrs.x.value).toBe(20) -// expect(fx.situation.styles.x.value).toBe(20) -// }) -// }) -// -// describe('attr()', function() { -// it('should allow an object to be passed', function() { -// spyOn(fx, 'attr').and.callThrough() -// fx.attr({ -// x: 20, -// y: 20 -// }) -// -// expect(fx.attr).toHaveBeenCalledWith('x', 20) -// expect(fx.attr).toHaveBeenCalledWith('y', 20) -// }) -// -// it('should call add() with attrs as method', function() { -// spyOn(fx, 'add') -// fx.attr('x', 20) -// expect(fx.add).toHaveBeenCalledWith('x', 20, 'attrs') -// }) -// }) -// -// describe('css()', function() { -// it('should allow an object to be passed', function() { -// spyOn(fx, 'css').and.callThrough() -// fx.css({ -// x: 20, -// y: 20 -// }) -// -// expect(fx.css).toHaveBeenCalledWith('x', 20) -// expect(fx.css).toHaveBeenCalledWith('y', 20) -// }) -// -// it('should call add() with styles as method', function() { -// spyOn(fx, 'add') -// fx.css('x', 20) -// expect(fx.add).toHaveBeenCalledWith('x', 20, 'styles') -// }) -// }) -// -// describe('x() / y()', function() { -// it('should add an entry to the animations obj', function() { -// spyOn(fx, 'add') -// fx.x(20) -// fx.y(20) -// -// expect(fx.add).toHaveBeenCalledWith('x', jasmine.objectContaining({value:20})) -// expect(fx.add).toHaveBeenCalledWith('y', jasmine.objectContaining({value:20})) -// }) -// -// it('allows relative move with relative flag set', function() { -// spyOn(fx, 'add') -// fx.x(20, true) -// fx.y(20, true) -// -// expect(fx.add).toHaveBeenCalledWith('x', jasmine.objectContaining({value:20, relative:true })) -// expect(fx.add).toHaveBeenCalledWith('y', jasmine.objectContaining({value:20, relative:true })) -// }) -// -// it('redirects to transform when target is a group', function() { -// var group = draw.group() -// , fx = group.animate(500) -// -// spyOn(fx, 'transform') -// -// fx.x(20) -// fx.y(20) -// -// expect(fx.transform).toHaveBeenCalledWith({x: 20}, undefined) -// expect(fx.transform).toHaveBeenCalledWith({y: 20}, undefined) -// }) -// -// it('redirects to transform when target is a group with relative flag set', function() { -// var group = draw.group() -// , fx = group.animate(500) -// -// spyOn(fx, 'transform') -// -// fx.x(20, true) -// fx.y(20, true) -// -// expect(fx.transform).toHaveBeenCalledWith({x: 20}, true) -// expect(fx.transform).toHaveBeenCalledWith({y: 20}, true) -// }) -// }) -// -// describe('cx() / cy()', function() { -// it('should call add with method and argument', function() { -// spyOn(fx, 'add') -// fx.cx(20) -// fx.cy(20) -// -// expect(fx.add).toHaveBeenCalledWith('cx', jasmine.objectContaining({value:20})) -// expect(fx.add).toHaveBeenCalledWith('cy', jasmine.objectContaining({value:20})) -// }) -// }) -// -// describe('move()', function() { -// it('should redirect call to x() and y()', function() { -// spyOn(fx, 'x').and.callThrough() -// spyOn(fx, 'y').and.callThrough() -// fx.move(20, 20) -// -// expect(fx.x).toHaveBeenCalledWith(20) -// expect(fx.y).toHaveBeenCalledWith(20) -// }) -// }) -// -// describe('center()', function() { -// it('should redirect call to cx() and cy()', function() { -// spyOn(fx, 'cx').and.callThrough() -// spyOn(fx, 'cy').and.callThrough() -// fx.center(20, 20) -// -// expect(fx.cx).toHaveBeenCalledWith(20) -// expect(fx.cy).toHaveBeenCalledWith(20) -// }) -// }) -// -// describe('size()', function() { -// it('should set font-size with attr() when called on a text', function() { -// var text = draw.text('Hello World') -// , fx = text.animate(500) -// -// spyOn(fx, 'attr') -// fx.size(20) -// expect(fx.attr).toHaveBeenCalledWith('font-size', 20) -// }) -// -// it('should set width and height with add()', function() { -// spyOn(fx, 'add').and.callThrough() -// fx.size(20, 20) -// -// expect(fx.add).toHaveBeenCalledWith('width', jasmine.objectContaining({value:20})) -// expect(fx.add).toHaveBeenCalledWith('height', jasmine.objectContaining({value:20})) -// }) -// -// it('should calculate proportional size when only height or width is given', function() { -// spyOn(fx, 'add').and.callThrough() -// fx.size(40, null) -// fx.size(null, 60) -// -// expect(fx.add).toHaveBeenCalledWith('width', jasmine.objectContaining({value:40})) -// expect(fx.add).toHaveBeenCalledWith('height', jasmine.objectContaining({value:40})) -// -// expect(fx.add).toHaveBeenCalledWith('width', jasmine.objectContaining({value:60})) -// expect(fx.add).toHaveBeenCalledWith('height', jasmine.objectContaining({value:60})) -// }) -// }) -// -// describe('width()', function() { -// it('should set width with add()', function() { -// spyOn(fx, 'add').and.callThrough() -// fx.width(20) -// expect(fx.add).toHaveBeenCalledWith('width', jasmine.objectContaining({value:20})) -// }) -// -// it('should animate the width attribute', function() { -// fx.width(200) -// expect(rect.width()).toBe(100) -// -// jasmine.clock().tick(250) -// fx.step() -// expect(rect.width()).toBe(150) -// -// jasmine.clock().tick(250) -// fx.step() -// expect(rect.width()).toBe(200) -// }) -// }) -// -// describe('height()', function() { -// it('should set height with add()', function() { -// spyOn(fx, 'add').and.callThrough() -// fx.height(20) -// expect(fx.add).toHaveBeenCalledWith('height', jasmine.objectContaining({value:20})) -// }) -// -// it('should animate the height attribute', function() { -// fx.height(200) -// expect(rect.height()).toBe(100) -// -// jasmine.clock().tick(250) -// fx.step() -// expect(rect.height()).toBe(150) -// -// jasmine.clock().tick(250) -// fx.step() -// expect(rect.height()).toBe(200) -// }) -// }) -// -// describe('plot()', function() { -// it('should call add with plot as method', function() { -// var polyline = draw.polyline('10 10 20 20 30 10 50 20') -// , fx = polyline.animate(500) -// -// spyOn(fx, 'add') -// fx.plot('5 5 30 29 40 19 12 30') -// expect(fx.add).toHaveBeenCalledWith('plot', new SVG.PointArray('5 5 30 29 40 19 12 30')) -// }) -// -// it('also accept parameter list', function() { -// var line = draw.line('10 10 20 20') -// , fx = line.animate(500) -// -// spyOn(fx, 'add') -// fx.plot(5, 5, 10, 10) -// expect(fx.add).toHaveBeenCalledWith('plot', new SVG.PointArray([5, 5, 10, 10])) -// }) -// }) -// -// describe('leading()', function() { -// it('should call add with method and argument', function() { -// var text = draw.text('Hello World') -// , fx = text.animate(500) -// spyOn(fx, 'add') -// fx.leading(3) -// -// expect(fx.add).toHaveBeenCalledWith('leading', jasmine.objectContaining({value:3})) -// }) -// -// it('does nothiing when not called on text', function() { -// spyOn(fx, 'add') -// fx.leading(3) -// expect(fx.add).not.toHaveBeenCalled() -// }) -// }) -// -// describe('viewbox()', function() { -// it('should call add with method and argument', function() { -// var nested = draw.nested() -// , fx = nested.animate(500) -// spyOn(fx, 'add') -// fx.viewbox(1,2,3,4) -// -// expect(fx.add).toHaveBeenCalledWith('viewbox', jasmine.objectContaining({x:1, y:2, width:3, height:4})) -// }) -// -// it('does nothing when not called on SVG.Container', function() { -// spyOn(fx, 'add') -// fx.viewbox(1,2,3,4) -// expect(fx.add).not.toHaveBeenCalled() -// }) -// }) -// -// describe('update()', function() { -// it('should convert call with 3 arguments to call with obj', function() { -// var stop = new SVG.Stop() -// , fx = stop.animate() -// spyOn(fx, 'update').and.callThrough() -// fx.update(1,'#ccc',0.5) -// -// expect(fx.update).toHaveBeenCalledWith({offset: 1, color: '#ccc', opacity: 0.5}) -// }) -// -// it('calls add with method argument and attrs as type', function() { -// var stop = new SVG.Stop() -// , fx = stop.animate() -// spyOn(fx, 'add') -// fx.update({offset: 1, color: '#ccc', opacity: 0.5}) -// -// expect(fx.add).toHaveBeenCalledWith('stop-opacity', 0.5, 'attrs') -// expect(fx.add).toHaveBeenCalledWith('stop-color', '#ccc', 'attrs') -// expect(fx.add).toHaveBeenCalledWith('offset', 1, 'attrs') -// }) -// -// it('does nothing when not called on SVG.Stop', function() { -// spyOn(fx, 'add') -// fx.update({offset: 1, color: '#ccc', opacity: 0.5}) -// expect(fx.add).not.toHaveBeenCalled() -// }) -// }) -// -// // describe('transform()', function() { -// // it('returns itself when no valid transformation was found', function() { -// // expect(fx.transform({})).toBe(fx) -// // }) -// // it('gets the current transforms', function() { -// // expect(fx.transform()).toEqual(new SVG.Matrix(rect).extract()) -// // }) -// // it('gets a certain transformation if used with an argument', function() { -// // expect(fx.transform('x')).toEqual(0) -// // }) -// // it('adds an entry to transforms when matrix given', function() { -// // var matrix = new SVG.Matrix(1,2,3,4,5,6) -// // fx.transform(matrix) -// // expect(fx.situation.transforms[0]).toEqual(jasmine.objectContaining(matrix)) -// // }) -// // it('sets relative flag when given', function() { -// // var matrix = new SVG.Matrix(1,2,3,4,5,6) -// // fx.transform(matrix, true) -// // expect(fx.situation.transforms[0]).toEqual(jasmine.objectContaining(matrix)) -// // expect(fx.situation.transforms[0].relative).toBe(true) -// // }) -// // it('adds an entry to transforms when rotation given', function() { -// // fx.transform({rotation: 30, cx:0, cy:0}) -// // expect(fx.situation.transforms[0]).toEqual(jasmine.objectContaining(new SVG.Rotate(30, 0, 0))) -// // }) -// // it('adds an entry to transforms when scale given', function() { -// // fx.transform({scale: 2, cx:0, cy:0}) -// // expect(fx.situation.transforms[0]).toEqual(jasmine.objectContaining(new SVG.Scale(2, 2, 0, 0))) -// // }) -// // it('adds an entry to transforms when scaleX given', function() { -// // fx.transform({scaleX: 2, cx:0, cy:0}) -// // expect(fx.situation.transforms[0]).toEqual(jasmine.objectContaining(new SVG.Scale(2, 1, 0, 0))) -// // }) -// // it('adds an entry to transforms when scaleY given', function() { -// // fx.transform({scaleY: 2, cx:0, cy:0}) -// // expect(fx.situation.transforms[0]).toEqual(jasmine.objectContaining(new SVG.Scale(1, 2, 0, 0))) -// // }) -// // it('adds an entry to transforms when skewX given', function() { -// // fx.transform({skewX: 2, cx:0, cy:0}) -// // expect(fx.situation.transforms[0]).toEqual(jasmine.objectContaining(new SVG.Skew(2, 0, 0, 0))) -// // }) -// // it('adds an entry to transforms when skewY given', function() { -// // fx.transform({skewY: 2, cx:0, cy:0}) -// // expect(fx.situation.transforms[0]).toEqual(jasmine.objectContaining(new SVG.Skew(0, 2, 0, 0))) -// // }) -// // it('adds an entry to transforms when flip x given', function() { -// // fx.transform({flip: 'x'}) -// // expect(fx.situation.transforms[0]).toEqual(jasmine.objectContaining((new SVG.Matrix()).flip('x', 150))) -// // }) -// // it('adds an entry to transforms when flip x with offset given', function() { -// // fx.transform({flip: 'x', offset: 100}) -// // expect(fx.situation.transforms[0]).toEqual(jasmine.objectContaining((new SVG.Matrix()).flip('x', 100))) -// // }) -// // it('adds an entry to transforms when flip y given', function() { -// // fx.transform({flip: 'y'}) -// // expect(fx.situation.transforms[0]).toEqual(jasmine.objectContaining((new SVG.Matrix()).flip('y', 150))) -// // }) -// // it('adds an entry to transforms when x given', function() { -// // fx.transform({x:20}) -// // expect(fx.situation.transforms[0]).toEqual(jasmine.objectContaining(new SVG.Translate(20, undefined))) -// // }) -// // it('adds an entry to transforms when y given', function() { -// // fx.transform({y:20}) -// // expect(fx.situation.transforms[0]).toEqual(jasmine.objectContaining(new SVG.Translate(undefined, 20))) -// // }) -// // }) -// -// /* shortcuts for animation */ -// describe('animate()', function() { -// it('creates a new fx instance on the element', function() { -// var rect = draw.rect(100,100) -// rect.animate(100) -// expect(rect.fx instanceof SVG.FX).toBeTruthy() -// }) -// -// it('redirects the call to fx.animate()', function() { -// spyOn(fx, 'animate') -// rect.animate() -// expect(fx.animate).toHaveBeenCalled() -// }) -// }) -// -// describe('delay()', function() { -// it('creates a new fx instance on the element', function() { -// var rect = draw.rect(100,100) -// rect.delay(100) -// expect(rect.fx instanceof SVG.FX).toBeTruthy() -// }) -// -// it('redirects the call to fx.delay()', function() { -// spyOn(fx, 'delay') -// rect.delay(5) -// expect(fx.delay).toHaveBeenCalled() -// }) -// }) -// -// describe('stop()', function() { -// it('redirects the call to fx.stop()', function() { -// spyOn(fx, 'stop') -// rect.stop() -// expect(fx.stop).toHaveBeenCalled() -// }) -// }) -// -// describe('finish()', function() { -// it('redirects the call to fx.finish()', function() { -// spyOn(fx, 'finish') -// rect.finish() -// expect(fx.finish).toHaveBeenCalled() -// }) -// }) -// -// describe('pause()', function() { -// it('redirects the call to fx.pause()', function() { -// spyOn(fx, 'pause') -// rect.pause() -// expect(fx.pause).toHaveBeenCalled() -// }) -// }) -// -// describe('play()', function() { -// it('redirects the call to fx.play()', function() { -// spyOn(fx, 'play') -// rect.play() -// expect(fx.play).toHaveBeenCalled() -// }) -// }) -// -// describe('speed()', function() { -// it('redirects the call to fx.speed() as getter', function() { -// spyOn(fx, 'speed') -// rect.speed() -// expect(fx.speed).toHaveBeenCalled() -// }) -// -// it('redirects the call to fx.speed() as setter', function() { -// spyOn(fx, 'speed').and.callThrough() -// expect(rect.speed(5)).toBe(rect) -// expect(fx.speed).toHaveBeenCalled() -// }) -// }) -// }) -// -// describe('SVG.MorphObj', function() { -// it('accepts color strings and converts them to SVG.Color', function() { -// var obj = new SVG.MorphObj('#000', '#fff') -// expect(obj instanceof SVG.Color).toBeTruthy() -// -// obj = new SVG.MorphObj('rgb(0,0,0)', 'rgb(255,255,255)') -// expect(obj instanceof SVG.Color).toBeTruthy() -// }) -// -// it('accepts numbers and converts them to SVG.Number', function() { -// var obj = new SVG.MorphObj('0', '10') -// expect(obj instanceof SVG.Number).toBeTruthy() -// -// var obj = new SVG.MorphObj(0, 10) -// expect(obj instanceof SVG.Number).toBeTruthy() -// }) -// -// it('accepts any other values', function() { -// var obj = new SVG.MorphObj('Hello', 'World') -// -// expect(obj.value).toBe('Hello') -// expect(obj.destination).toBe('World') -// }) -// -// it('morphes unmorphable objects with plain morphing', function() { -// var obj = new SVG.MorphObj('Hello', 'World') -// -// expect(obj.at(0,0)).toBe('Hello') -// expect(obj.at(0.5,0.5)).toBe('Hello') -// expect(obj.at(1,1)).toBe('World') -// }) -// -// it('converts to its value when casted', function() { -// var obj = new SVG.MorphObj('Hello', 'World') -// expect(obj.valueOf()).toBe('Hello') -// expect(obj + 'World').toBe('HelloWorld') -// }) -// }) diff --git a/spec/spec/gradient.js b/spec/spec/gradient.js deleted file mode 100644 index 7280a98..0000000 --- a/spec/spec/gradient.js +++ /dev/null @@ -1,151 +0,0 @@ -describe('Gradient', function () { - var rect, gradient - - beforeEach(function () { - rect = draw.rect(100, 100) - gradient = draw.gradient('linear', function (add) { - add.stop({ offset: 0, color: '#333', opacity: 1 }) - add.stop({ offset: 1, color: '#fff', opacity: 1 }) - }) - radial = draw.gradient('radial', function (add) { - add.stop({ offset: 0, color: '#333', opacity: 1 }) - add.stop({ offset: 1, color: '#fff', opacity: 1 }) - }) - }) - - afterEach(function () { - rect.remove() - gradient.remove() - }) - - it('is an instance of SVG.Gradient', function () { - expect(gradient instanceof SVG.Gradient).toBe(true) - }) - - it('allows creation of a new gradient without block', function () { - gradient = draw.gradient('linear') - expect(gradient.children().length).toBe(0) - }) - - describe('url()', function () { - it('returns the id of the gradient wrapped in url()', function () { - expect(gradient.url()).toBe('url("#' + gradient.id() + '")') - }) - }) - - describe('from()', function () { - it('sets fx and fy attribute for radial gradients', function () { - radial.from(7, 10) - expect(radial.attr('fx')).toBe(7) - expect(radial.attr('fy')).toBe(10) - }) - it('sets x1 and y1 attribute for linear gradients', function () { - gradient.from(7, 10) - expect(gradient.attr('x1')).toBe(7) - expect(gradient.attr('y1')).toBe(10) - }) - }) - - describe('to()', function () { - it('sets cx and cy attribute for radial gradients', function () { - radial.to(75, 105) - expect(radial.attr('cx')).toBe(75) - expect(radial.attr('cy')).toBe(105) - }) - it('sets x2 and y2 attribute for linear gradients', function () { - gradient.to(75, 105) - expect(gradient.attr('x2')).toBe(75) - expect(gradient.attr('y2')).toBe(105) - }) - }) - - describe('attr()', function () { - it('will catch transform attribues and convert them to gradientTransform', function () { - expect(gradient.translate(100, 100).attr('gradientTransform')).toBe('matrix(1,0,0,1,100,100)') - }) - }) - - describe('toString()', function () { - it('returns the id of the gradient wrapped in url()', function () { - expect(gradient + '').toBe('url("#' + gradient.id() + '")') - }) - it('is called when instance is passed as an attribute value', function () { - rect.attr('fill', gradient) - expect(rect.attr('fill')).toBe('url("#' + gradient.id() + '")') - }) - }) - - describe('input values', function () { - var s1, s2 - - it('accepts floats', function () { - gradient = draw.gradient('linear', function (add) { - s1 = add.stop({ offset: 0.12, color: '#333', opacity: 1 }) - s2 = add.stop({ offset: 0.93, color: '#fff', opacity: 1 }) - }) - expect(s1.attr('offset')).toBe(0.12) - expect(s2.attr('offset')).toBe(0.93) - }) - it('accepts string floats', function () { - gradient = draw.gradient('linear', function (add) { - s1 = add.stop({ offset: '0.13', color: '#333', opacity: 1 }) - s2 = add.stop({ offset: '0.92', color: '#fff', opacity: 1 }) - }) - expect(s1.attr('offset')).toBe(0.13) - expect(s2.attr('offset')).toBe(0.92) - }) - it('accept percentages', function () { - gradient = draw.gradient('linear', function (add) { - s1 = add.stop({ offset: '14%', color: '#333', opacity: 1 }) - s2 = add.stop({ offset: '91%', color: '#fff', opacity: 1 }) - }) - expect(s1.attr('offset')).toBe('14%') - expect(s2.attr('offset')).toBe('91%') - }) - }) - - describe('update()', function () { - - it('removes all existing children first', function () { - gradient = draw.gradient('linear', function (add) { - s1 = add.stop({ offset: 0.12, color: '#333', opacity: 1 }) - s2 = add.stop({ offset: 0.93, color: '#fff', opacity: 1 }) - }) - expect(gradient.children().length).toBe(2) - gradient.update(function (add) { - s1 = add.stop({ offset: 0.33, color: '#666', opacity: 1 }) - s2 = add.stop({ offset: 1, color: '#000', opacity: 1 }) - }) - expect(gradient.children().length).toBe(2) - }) - - it('accepts multiple aruments on fixed positions', function () { - gradient = draw.gradient('linear', function (add) { - s1 = add.stop(0.11, '#333') - s2 = add.stop(0.94, '#fff', 0.5) - }) - expect(gradient.children().length).toBe(2) - expect(s1.attr('offset')).toBe(0.11) - expect(s1.attr('stop-color')).toBe('#333333') - expect(s2.attr('offset')).toBe(0.94) - expect(s2.attr('stop-color')).toBe('#ffffff') - expect(s2.attr('stop-opacity')).toBe(0.5) - }) - - }) - - describe('get()', function () { - - it('returns the stop at a given index', function () { - gradient = draw.gradient('linear', function (add) { - s1 = add.stop({ offset: 0.12, color: '#333', opacity: 1 }) - s2 = add.stop({ offset: 0.93, color: '#fff', opacity: 1 }) - }) - expect(gradient.get(0)).toBe(s1) - expect(gradient.get(1)).toBe(s2) - expect(gradient.get(2)).toBeNull() - }) - - }) - -}) diff --git a/spec/spec/helper.js b/spec/spec/helper.js deleted file mode 100644 index 4c9fe4a..0000000 --- a/spec/spec/helper.js +++ /dev/null @@ -1,188 +0,0 @@ -parserInDoc = false - -if(typeof exports === 'object'){ - window = require('svgdom') - SVG = require('../../dist/svg.js') - document = window.document - drawing = document.documentElement - imageUrl = 'spec/fixtures/pixel.png' - parserInDoc = true - - function tag(name, attrs, children) { - var el = document.createElement(name) - for(var i in attrs){ - el.setAttribute(i, attrs[i]) - } - - for(var i in children){ - if(typeof children[i] == 'string') - children[i] = document.createTextNode(children[i]) - - el.appendChild(children[i]) - } - - return el - } - - // create fixtures in svgdom - var el = tag('svg', { - height:0, - width:0, - id:'inlineSVG' - },[ - tag('defs', {}, [ - tag('linearGradient', {}, [ - tag('stop', {offset: '5%', 'stop-color': 'green'}), - tag('stop', {offset: '95%', 'stop-color': 'gold'}), - ]), - tag('radialGradient', {}, [ - tag('stop', {offset: '5%', 'stop-color': 'green'}), - tag('stop', {offset: '95%', 'stop-color': 'gold'}), - ]) - ]), - tag('desc', {}, ['Some description']), - tag('path', { - id: 'lineAB', - d: 'M 100 350 l 150 -300', - stroke: 'red', - 'stroke-width': '3', - fill: 'none' - }), - tag('path', { - id: 'lineBC', - d: 'M 250 50 l 150 300', - stroke: 'red', - 'stroke-width': '3', - fill: 'none' - }), - tag('path', { - d: 'M 175 200 l 150 0', - stroke: 'green', - 'stroke-width': '3', - fill: 'none' - }), - tag('path', { - d: 'M 100 350 q 150 -300 300 0', - stroke: 'blue', - 'stroke-width': '5', - fill: 'none' - }), - tag('g', { - stroke: 'black', - 'stroke-width': '2', - fill: 'black', - id: 'pointGroup' - },[ - tag('circle', { - id: 'pointA', - cx: '100', - cy: '350', - r: '3', - }), - tag('circle', { - id: 'pointB', - cx: '250', - cy: '50', - r: '50', - }), - tag('circle', { - id: 'pointC', - cx: '400', - cy: '350', - r: '50', - }) - ]), - tag('g', { - 'font-size': '30', - font: 'sans-serif', - fill: 'black', - stroke: 'none', - 'text-anchor': 'middle', - id: 'labelGroup' - },[ - tag('text', { - x: '100', - y: '350', - dy: '-30', - }, ['A']), - tag('text', { - x: '250', - y: '50', - dy: '-10', - }, ['B']), - tag('text', { - x: '400', - y: '350', - dx: '30', - }, ['C']) - ]), - tag('polygon', {points: '200,10 250,190 160,210'}), - tag('polyline', {points: '20,20 40,25 60,40 80,120 120,140 200,180'}) - ]) - - document.appendChild(el) - -}else{ - drawing = document.createElement('div') - document.getElementsByTagName('body')[0].appendChild(drawing) - imageUrl = 'fixtures/pixel.png' -} - -parserInDoc |= 0 -drawing.id = 'drawing' -//draw = SVG().addTo(drawing) - -parser = parserInDoc ? [SVG.parser.draw.instance] : [] - -// raw path data -svgPath = 'M88.006,61.994c3.203,0,6.216-1.248,8.481-3.514C98.752,56.215,100,53.203,100,50c0-3.204-1.248-6.216-3.513-8.481 c-2.266-2.265-5.278-3.513-8.481-3.513c-2.687,0-5.237,0.877-7.327,2.496h-7.746l5.479-5.479 c5.891-0.757,10.457-5.803,10.457-11.896c0-6.614-5.381-11.995-11.994-11.995c-6.093,0-11.14,4.567-11.896,10.457l-5.479,5.479 v-7.747c1.618-2.089,2.495-4.641,2.495-7.327c0-3.204-1.247-6.216-3.513-8.481C56.216,1.248,53.204,0,50,0 c-3.204,0-6.216,1.248-8.481,3.513c-2.265,2.265-3.513,5.277-3.513,8.481c0,2.686,0.877,5.237,2.495,7.327v7.747l-5.479-5.479 c-0.757-5.89-5.803-10.457-11.896-10.457c-6.614,0-11.995,5.381-11.995,11.995c0,6.093,4.567,11.139,10.458,11.896l5.479,5.479 h-7.747c-2.089-1.619-4.641-2.496-7.327-2.496c-3.204,0-6.216,1.248-8.481,3.513C1.248,43.784,0,46.796,0,50 c0,3.203,1.248,6.216,3.513,8.48c2.265,2.266,5.277,3.514,8.481,3.514c2.686,0,5.237-0.877,7.327-2.496h7.747l-5.479,5.479 c-5.891,0.757-10.458,5.804-10.458,11.896c0,6.614,5.381,11.994,11.995,11.994c6.093,0,11.139-4.566,11.896-10.457l5.479-5.479 v7.749c-3.63,4.7-3.291,11.497,1.018,15.806C43.784,98.752,46.796,100,50,100c3.204,0,6.216-1.248,8.481-3.514 c4.309-4.309,4.647-11.105,1.018-15.806v-7.749l5.479,5.479c0.757,5.891,5.804,10.457,11.896,10.457 c6.613,0,11.994-5.38,11.994-11.994c0-6.093-4.566-11.14-10.457-11.896l-5.479-5.479h7.746 C82.769,61.117,85.319,61.994,88.006,61.994z M76.874,68.354c4.705,0,8.52,3.814,8.52,8.521c0,4.705-3.814,8.52-8.52,8.52 s-8.52-3.814-8.52-8.52l-12.33-12.33V81.98c3.327,3.328,3.327,8.723,0,12.049c-3.327,3.328-8.722,3.328-12.049,0 c-3.327-3.326-3.327-8.721,0-12.049V64.544l-12.33,12.33c0,4.705-3.814,8.52-8.52,8.52s-8.52-3.814-8.52-8.52 c0-4.706,3.814-8.521,8.52-8.521l12.33-12.33H18.019c-3.327,3.328-8.722,3.328-12.049,0c-3.327-3.326-3.327-8.721,0-12.048 s8.722-3.327,12.049,0h17.438l-12.33-12.33c-4.706,0-8.52-3.814-8.52-8.52c0-4.706,3.814-8.52,8.52-8.52s8.52,3.814,8.52,8.52 l12.33,12.33V18.019c-3.327-3.327-3.327-8.722,0-12.049s8.722-3.327,12.049,0s3.327,8.722,0,12.049v17.438l12.33-12.33 c0-4.706,3.814-8.52,8.52-8.52s8.52,3.814,8.52,8.52c0,4.705-3.814,8.52-8.52,8.52l-12.33,12.33h17.438 c3.327-3.327,8.722-3.327,12.049,0s3.327,8.722,0,12.048c-3.327,3.328-8.722,3.328-12.049,0H64.544L76.874,68.354z' - -// lorem ipsum text -loremIpsum = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras sodales\n imperdiet auctor. Nunc ultrices lectus at erat dictum pharetra\n elementum ante posuere. Duis turpis risus, blandit nec elementum et,\n posuere eget lacus. Aliquam et risus magna, eu aliquet nibh. Fusce\n consequat mi quis purus varius sagittis euismod urna interdum.\n Curabitur aliquet orci quis felis semper vulputate. Vestibulum ac nisi\n magna, id dictum diam. Proin sed metus vel magna blandit\n sodales. Pellentesque at neque ultricies nunc euismod rutrum ut in\n lorem. Mauris euismod tellus in tellus tempus interdum. Phasellus\n mattis sapien et leo feugiat dictum. Vestibulum at volutpat velit.' - -beforeEach(function(){ - // test for touch device - this.isTouchDevice = 'ontouchstart' in document.documentElement - draw = SVG().addTo(drawing).size(100,100) -}) - -afterEach(function(){ - draw.remove() -}) - -// strip spaces from result -window.stripped = function(string) { - string = string.replace(/\s+/g, '') - if(string.slice(-1) == ';') string = string.slice(0, -1) - return string -} - -// This is needed because of IE11 which uses space as a delimiter in matrix -window.matrixStringToArray = function(source){ - return source - .replace(/matrix\(|\)/, '') - .split(SVG.regex.delimiter) - .map(parseFloat) -} - -// This is needed because of IE11 creating values like 2.99999 when calculating a transformed box -window.roundBox = function(box) { - return new SVG.Box( - Math.round(box.x), - Math.round(box.y), - Math.round(box.width), - Math.round(box.height) - ) -} - -// Same thing here with matrices -window.roundMatrix = function (mat) { - return new SVG.Matrix( - +(mat.a.toFixed(5)), - +(mat.b.toFixed(5)), - +(mat.c.toFixed(5)), - +(mat.d.toFixed(5)), - +(mat.e.toFixed(5)), - +(mat.f.toFixed(5)) - ) -} diff --git a/spec/spec/image.js b/spec/spec/image.js deleted file mode 100644 index 589116d..0000000 --- a/spec/spec/image.js +++ /dev/null @@ -1,38 +0,0 @@ -describe('Image', function() { - var image, loadCb - - beforeEach(function(done) { - loadCb = {cb: function(){ done() }} - spyOn(loadCb, 'cb').and.callThrough() - image = draw.image(imageUrl, loadCb.cb).size(100,100) - }) - - afterEach(function() { - draw.clear() - }) - - - describe('()', function() { - it('should set width and height automatically if no size is given', function(done) { - image = draw.image(imageUrl, function() { - expect(image.node.getAttribute('height')).toBe('1') - expect(image.node.getAttribute('width')).toBe('1') - done() - }) - }) - it('should not change with and height when size already set', function(done) { - image = draw.image(imageUrl, function() { - expect(image.node.getAttribute('height')).toBe('100') - expect(image.node.getAttribute('width')).toBe('100') - done() - }).size(100,100) - }) - it('returns itself when no url given', function() { - var img = new SVG.Image() - expect(img.load()).toBe(img) - }) - it('executes the load callback', function() { - expect(loadCb.cb).toHaveBeenCalledWith(jasmine.any(Event)) - }) - }) -}) diff --git a/spec/spec/line.js b/spec/spec/line.js deleted file mode 100644 index 48b1c8b..0000000 --- a/spec/spec/line.js +++ /dev/null @@ -1,244 +0,0 @@ -describe('Line', function() { - var line - - beforeEach(function() { - line = draw.line(0,100,100,0) - }) - - afterEach(function() { - draw.clear() - }) - - // #487 - describe('()', function(){ - it('will take an array as input', function(){ - line = draw.line([[0,100],[100,0]]) - var attrs = line.attr() - expect(attrs.x1).toBe(0) - expect(attrs.y1).toBe(100) - expect(attrs.x2).toBe(100) - expect(attrs.y2).toBe(0) - }) - - it('falls back to a line with its two points at [0,0] without an argument', function() { - line = draw.line() - var attrs = line.attr() - expect(attrs.x1).toBe(0) - expect(attrs.y1).toBe(0) - expect(attrs.x2).toBe(0) - expect(attrs.y2).toBe(0) - }) - }) - - describe('x()', function() { - it('should return the value of x without an argument', function() { - expect(line.x()).toBe(0) - }) - it('should set the value of x with the first argument', function() { - line.x(123) - var box = line.bbox() - expect(box.x).toBe(123) - }) - }) - - describe('y()', function() { - it('should return the value of y without an argument', function() { - expect(line.y()).toBe(0) - }) - it('should set the value of y with the first argument', function() { - line.y(345) - var box = line.bbox() - expect(box.y).toBe(345) - }) - }) - - describe('cx()', function() { - it('should return the value of cx without an argument', function() { - expect(line.cx()).toBe(50) - }) - it('should set the value of cx with the first argument', function() { - line.cx(123) - var box = line.bbox() - expect(box.cx).toBe(123) - }) - }) - - describe('cy()', function() { - it('should return the value of cy without an argument', function() { - expect(line.cy()).toBe(50) - }) - it('should set the value of cy with the first argument', function() { - line.cy(345) - var box = line.bbox() - expect(box.cy).toBe(345) - }) - }) - - describe('move()', function() { - it('should set the x and y position', function() { - line.move(123,456) - var box = line.bbox() - expect(box.x).toBe(123) - expect(box.y + box.height).toBe(556) - expect(box.x + box.width).toBe(223) - expect(box.y).toBe(456) - }) - }) - - describe('dx()', function() { - it('moves the x positon of the element relative to the current position', function() { - line.move(50,60) - line.dx(100) - var box = line.bbox() - expect(box.x).toBe(150) - expect(box.y + box.height).toBe(160) - expect(box.x + box.width).toBe(250) - expect(box.y).toBe(60) - }) - }) - - describe('dy()', function() { - it('moves the y positon of the element relative to the current position', function() { - line.move(50, 60) - line.dy(120) - var box = line.bbox() - expect(box.x).toBe(50) - expect(box.y + box.height).toBe(280) - expect(box.x + box.width).toBe(150) - expect(box.y).toBe(180) - }) - }) - - describe('dmove()', function() { - it('moves the x and y positon of the element relative to the current position', function() { - line.move(50,60) - line.dmove(80, 25) - var box = line.bbox() - expect(box.x).toBe(130) - expect(box.y + box.height).toBe(185) - expect(box.x + box.width).toBe(230) - expect(box.y).toBe(85) - }) - }) - - describe('center()', function() { - it('should set the cx and cy position', function() { - line.center(321,567) - var box = line.bbox() - expect(box.x).toBe(271) - expect(box.y + box.height).toBe(617) - expect(box.x + box.width).toBe(371) - expect(box.y).toBe(517) - }) - }) - - describe('width()', function() { - it('sets the width of the element', function() { - line.width(400) - var box = line.bbox() - expect(box.x).toBe(0) - expect(box.x + box.width).toBe(400) - }) - it('get the width of the element without argument', function() { - line.width(123) - var box = line.bbox() - expect(line.width()).toBe(box.width) - }) - }) - - describe('height()', function() { - it('sets the height of the element', function() { - line.height(300) - var box = line.bbox() - expect(box.y).toBe(0) - expect(box.y + box.height).toBe(300) - }) - it('gets the height of the element without argument', function() { - line.height(456) - var box = line.bbox() - expect(line.height()).toBe(box.height) - }) - }) - - describe('size()', function() { - it('should define the width and height of the element', function() { - line.size(987,654) - var box = line.bbox() - expect(box.x).toBe(0) - expect(box.y + box.height).toBe(654) - expect(box.x + box.width).toBe(987) - expect(box.y).toBe(0) - }) - it('defines the width and height proportionally with only the width value given', function() { - var box = line.bbox() - line.size(500) - expect(line.width()).toBe(500) - expect(line.width() / line.height()).toBe(box.width / box.height) - }) - it('defines the width and height proportionally with only the height value given', function() { - var box = line.bbox() - line.size(null, 525) - expect(line.height()).toBe(525) - expect(line.width() / line.height()).toBe(box.width / box.height) - }) - }) - - describe('scale()', function() { - it('should scale the element universally with one argument', function() { - var box1 = line.rbox() - , box2 = line.scale(2).rbox() - - expect(box2.width).toBe(box1.width * 2) - expect(box2.height).toBe(box1.height * 2) - }) - it('should scale the element over individual x and y axes with two arguments', function() { - var box1 = line.rbox() - , box2 = line.scale(2,3.5).rbox() - - expect(box2.width).toBe(box1.width * 2) - expect(box2.height).toBe(box1.height * 3.5) - }) - }) - - describe('translate()', function() { - it('should set the translation of an element', function() { - line.transform({ tx: 12, ty: 12 }) - expect(line.node.getAttribute('transform')).toBe('matrix(1,0,0,1,12,12)') - }) - }) - - describe('plot()', function() { - it('should update the start and end points', function() { - line.plot(100,200,300,400) - var box = line.bbox() - expect(box.x).toBe(100) - expect(box.y).toBe(200) - expect(box.x + box.width).toBe(300) - expect(box.y + box.height).toBe(400) - }) - it('change the x1,y1,x2,y2 attributes of the underlying line node when a string is passed', function() { - expect(line.plot('100,50 200,10')).toBe(line) - - var attrs = line.attr() - expect(attrs.x1).toBe(100) - expect(attrs.y1).toBe(50) - expect(attrs.x2).toBe(200) - expect(attrs.y2).toBe(10) - }) - it('change the x1,y1,x2,y2 attributes of the underlying line node when 4 numbers are passed', function() { - expect(line.plot(45, 24, 220, 300)).toBe(line) - - var attrs = line.attr() - expect(attrs.x1).toBe(45) - expect(attrs.y1).toBe(24) - expect(attrs.x2).toBe(220) - expect(attrs.y2).toBe(300) - }) - it('return the coordinates in a point array when no arguments are passed', function () { - var attrs = line.attr() - , pointArray = new SVG.PointArray([[attrs.x1, attrs.y1], [attrs.x2, attrs.y2]]) - - expect(line.plot()).toEqual(pointArray) - }) - }) -}) diff --git a/spec/spec/mask.js b/spec/spec/mask.js deleted file mode 100644 index e61ccbd..0000000 --- a/spec/spec/mask.js +++ /dev/null @@ -1,62 +0,0 @@ -describe('Mask', function() { - var rect, circle - - beforeEach(function() { - rect = draw.rect(100,100) - circle = draw.circle(100).move(50, 50).fill('#fff') - rect.maskWith(circle) - }) - - afterEach(function() { - draw.clear() - }) - - it('moves the masking element to a new mask node', function() { - expect(circle.parent() instanceof SVG.Mask).toBe(true) - }) - - it('creates the mask node in the defs node', function() { - expect(circle.parent().parent()).toBe(draw.defs()) - }) - - it('sets the "mask" attribute on the masked element with the mask id', function() { - expect(rect.attr('mask')).toBe('url("#' + circle.parent().id() + '")') - }) - - it('references the mask element in the masked element', function() { - expect(rect.masker()).toBe(circle.parent()) - }) - - it('references the masked element in the mask target list', function() { - expect(rect.masker().targets().indexOf(rect) > -1).toBe(true) - }) - - it('reuses mask element when mask was given', function() { - var mask = rect.masker() - expect(draw.rect(100,100).maskWith(mask).masker()).toBe(mask) - }) - - it('unmasks all masked elements when being removed', function() { - rect.masker().remove() - expect(rect.attr('mask')).toBe(undefined) - }) - - describe('unmask()', function() { - - it('clears the "mask" attribute on the masked element', function() { - rect.unmask() - expect(rect.attr('mask')).toBe(undefined) - }) - - it('removes the reference to the masking element', function() { - rect.unmask() - expect(rect.masker()).toBe(null) - }) - - it('returns the element itslef', function() { - expect(rect.unmask()).toBe(rect) - }) - - }) - -})
\ No newline at end of file diff --git a/spec/spec/matrix.js b/spec/spec/matrix.js deleted file mode 100644 index b6c0348..0000000 --- a/spec/spec/matrix.js +++ /dev/null @@ -1,375 +0,0 @@ -describe('Matrix', function() { - let comp = {a:2, b:0, c:0, d:2, e:100, f:50} - - describe('initialization', function() { - - it('creates a new matrix with default values', function() { - let matrix = new SVG.Matrix() - expect(matrix).toEqual(jasmine.objectContaining( - {a:1, b:0, c:0, d:1, e:0, f:0} - )) - }) - - it('parses the current transform matrix from an element', function() { - let rect = draw.rect(100, 100).transform(comp) - let matrix = new SVG.Matrix(rect) - expect(matrix).toEqual(jasmine.objectContaining(comp)) - }) - - it('parses a string value correctly', function() { - let matrix = new SVG.Matrix('2, 0, 0, 2, 100, 50') - expect(matrix).toEqual(jasmine.objectContaining(comp)) - }) - - it('parses an array correctly', function() { - let matrix = new SVG.Matrix([2, 0, 0, 2, 100, 50]) - expect(matrix).toEqual(jasmine.objectContaining(comp)) - }) - - it('parses an object correctly', function() { - let matrix = new SVG.Matrix(comp) - expect(matrix).toEqual(jasmine.objectContaining(comp)) - }) - - it('parses a transform object correctly', function() { - let matrix = new SVG.Matrix({scale: 2, translate: [100, 50]}) - expect(matrix).toEqual(jasmine.objectContaining(comp)) - }) - - it('parses 6 arguments correctly', function() { - let matrix = new SVG.Matrix(2, 0, 0, 2, 100, 50) - expect(matrix).toEqual(jasmine.objectContaining(comp)) - }) - }) - - describe('toString()' , function() { - it('exports correctly to a string', function() { - expect(new SVG.Matrix().toString()).toBe('matrix(1,0,0,1,0,0)') - }) - }) - - describe('compose()', function() { - it('composes a matrix to form the correct result', function() { - let composed = new SVG.Matrix().compose({ - scaleX: 3, scaleY: 20, shear: 4, rotate: 50, translateX: 23, translateY: 52, - }) - - let expected = new SVG.Matrix().scale(3, 20).shear(4).rotate(50).translate(23, 52) - expect(composed).toEqual(expected) - }) - }) - - describe('decompose()', function () { - it('decomposes a matrix properly', function () { - var matrix = new SVG.Matrix().scale(3, 2.5).shear(4).rotate(30).translate(20, 30) - var decomposed = matrix.decompose() - expect(decomposed.scaleX).toBeCloseTo(3) - expect(decomposed.scaleY).toBeCloseTo(2.5) - expect(decomposed.shear).toBeCloseTo(4) - expect(decomposed.rotate).toBeCloseTo(30) - expect(decomposed.translateX).toBeCloseTo(20) - expect(decomposed.translateY).toBeCloseTo(30) - }) - - it('can be recomposed to the same matrix', function () { - var matrix = new SVG.Matrix().scale(3, 2.5).shear(4).rotate(30).translate(20, 30) - var decomposed = matrix.decompose() - var composed = new SVG.Matrix().compose(decomposed) - expect(matrix.a).toBeCloseTo(composed.a) - expect(matrix.b).toBeCloseTo(composed.b) - expect(matrix.c).toBeCloseTo(composed.c) - expect(matrix.d).toBeCloseTo(composed.d) - expect(matrix.e).toBeCloseTo(composed.e) - expect(matrix.f).toBeCloseTo(composed.f) - }) - }) - - describe('clone()', function() { - it('returns a clone of the matrix', function() { - var matrix = new SVG.Matrix(2, 0, 0, 5, 0, 0) - , clone = matrix.clone() - expect(matrix).not.toBe(clone) - for(var i in 'abcdef') { - expect(matrix[i]).toEqual(clone[i]) - } - }) - }) - - describe('multiply()', function() { - it('multiplies two matrices', function() { - var matrix1 = new SVG.Matrix(1, 4, 2, 5, 3, 6) - , matrix2 = new SVG.Matrix(7, 8, 8, 7, 9, 6) - , matrix3 = matrix1.multiply(matrix2) - - expect(matrix1.toString()).toBe('matrix(1,4,2,5,3,6)') - expect(matrix2.toString()).toBe('matrix(7,8,8,7,9,6)') - expect(matrix3.toString()).toBe('matrix(23,68,22,67,24,72)') - }) - - it('accepts matrices in any form', function() { - var matrix1 = new SVG.Matrix(1, 4, 2, 5, 3, 6) - , matrix2 = matrix1.multiply('7,8,8,7,9,6') - - expect(matrix1.toString()).toBe('matrix(1,4,2,5,3,6)') - expect(matrix2.toString()).toBe('matrix(23,68,22,67,24,72)') - }) - }) - - describe('inverse()', function() { - it('inverses matrix', function() { - - var matrix1 = new SVG.Matrix(2, 0, 0, 5, 4, 3) - , matrix2 = matrix1.inverse() - , abcdef = [0.5, 0, 0, 0.2, -2, -0.6] - - for(var i in 'abcdef') { - expect(matrix2['abcdef'[i]]).toBeCloseTo(abcdef[i]) - } - }) - }) - - describe('translate()', function() { - it('translates matrix by given x and y values', function() { - var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).translate(10, 12.5) - expect(matrix.e).toBe(14) - expect(matrix.f).toBe(15.5) - }) - - it('does nothing if you give it no x or y value', function() { - var matrix = new SVG.Matrix(1, 2, 3, 4, 5, 6).translate() - expect(matrix.e).toBe(5) - expect(matrix.f).toBe(6) - }) - }) - - describe('scale()', function() { - it('performs a uniformal scale with one value', function() { - var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).scale(3) - - expect(matrix.a).toBe(3) - expect(matrix.d).toBe(3) - expect(matrix.e).toBe(4 * 3) - expect(matrix.f).toBe(3 * 3) - }) - it('performs a non-uniformal scale with two values', function() { - var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).scale(2.5, 3.5) - - expect(matrix.a).toBe(2.5) - expect(matrix.d).toBe(3.5) - expect(matrix.e).toBe(4 * 2.5) - expect(matrix.f).toBe(3 * 3.5) - }) - it('performs a uniformal scale at a given center point with three values', function() { - var matrix = new SVG.Matrix(1, 3, 2, 3, 4, 3).scale(3, 2, 3) - - expect(matrix.a).toBe(3) - expect(matrix.b).toBe(9) - expect(matrix.c).toBe(6) - expect(matrix.d).toBe(9) - expect(matrix.e).toBe(8) - expect(matrix.f).toBe(3) - }) - it('performs a non-uniformal scale at a given center point with four values', function() { - var matrix = new SVG.Matrix(1, 3, 2, 3, 4, 3).scale(3, 2, 2, 3) - - expect(matrix.a).toBe(3) - expect(matrix.b).toBe(6) - expect(matrix.c).toBe(6) - expect(matrix.d).toBe(6) - expect(matrix.e).toBe(8) - expect(matrix.f).toBe(3) - }) - }) - - describe('rotate()', function() { - it('performs a rotation with one argument', function() { - var matrix = new SVG.Matrix(1, 3, 2, 3, 4, 3).rotate(30) - - expect(matrix.a).toBeCloseTo(-0.6339746) - expect(matrix.b).toBeCloseTo(3.09807621) - expect(matrix.c).toBeCloseTo(0.23205081) - expect(matrix.d).toBeCloseTo(3.59807621) - expect(matrix.e).toBeCloseTo(1.96410162) - expect(matrix.f).toBeCloseTo(4.59807621) - }) - it('performs a rotation around a given point with three arguments', function() { - var matrix = new SVG.Matrix(1, 3, 2, 3, 4, 3).rotate(30, 2, 3) - - expect(matrix.a).toBeCloseTo(-0.633974596216) - expect(matrix.b).toBeCloseTo(3.09807621135) - expect(matrix.c).toBeCloseTo(0.232050807569) - expect(matrix.d).toBeCloseTo(3.59807621135) - expect(matrix.e).toBeCloseTo(3.73205080757) - expect(matrix.f).toBeCloseTo(4.0) - }) - }) - - describe('flip()', function() { - describe('with x given', function() { - it('performs a flip over the horizontal axis with one argument', function() { - var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).flip('x') - - expect(matrix.a).toBe(-1) - expect(matrix.d).toBe(1) - expect(matrix.e).toBe(-4) - expect(matrix.f).toBe(3) - }) - it('performs a flip over the horizontal axis over a given point with two arguments', function() { - var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).flip('x', 150) - - expect(matrix.a).toBe(-1) - expect(matrix.d).toBe(1) - expect(matrix.e).toBe(296) - expect(matrix.f).toBe(3) - }) - }) - describe('with y given', function() { - it('performs a flip over the vertical axis with one argument', function() { - var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).flip('y') - - expect(matrix.a).toBe(1) - expect(matrix.d).toBe(-1) - expect(matrix.e).toBe(4) - expect(matrix.f).toBe(-3) - }) - it('performs a flip over the vertical axis over a given point with two arguments', function() { - var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).flip('y', 100) - - expect(matrix.a).toBe(1) - expect(matrix.d).toBe(-1) - expect(matrix.e).toBe(4) - expect(matrix.f).toBe(197) - }) - }) - describe('with no axis given', function() { - it('performs a flip over the horizontal and vertical axis with no argument', function() { - var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).flip() - - expect(matrix.a).toBe(-1) - expect(matrix.d).toBe(-1) - expect(matrix.e).toBe(-4) - expect(matrix.f).toBe(-3) - }) - it('performs a flip over the horizontal and vertical axis over a given point with one argument that represent both coordinates', function() { - var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).flip(100) - - expect(matrix.a).toBe(-1) - expect(matrix.d).toBe(-1) - expect(matrix.e).toBe(196) - expect(matrix.f).toBe(197) - }) - it('performs a flip over the horizontal and vertical axis over a given point with two arguments', function() { - var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).flip(50, 100) - - expect(matrix.a).toBe(-1) - expect(matrix.d).toBe(-1) - expect(matrix.e).toBe(96) - expect(matrix.f).toBe(197) - }) - }) - }) - - describe('skew()', function() { - it('performs a uniformal skew with one value', function() { - var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).skew(30) - - expect(matrix.a).toBe(1) - expect(matrix.b).toBeCloseTo(0.57735026919) - expect(matrix.c).toBeCloseTo(0.57735026919) - expect(matrix.d).toBe(1) - expect(matrix.e).toBeCloseTo(5.73205080757) - expect(matrix.f).toBeCloseTo(5.30940107676) - }) - - it('performs a non-uniformal skew with two values', function() { - var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).skew(30, 20) - - expect(matrix.a).toBe(1) - expect(matrix.b).toBeCloseTo(0.363970234266) - expect(matrix.c).toBeCloseTo(0.57735026919) - expect(matrix.d).toBe(1) - expect(matrix.e).toBeCloseTo(5.73205080757) - expect(matrix.f).toBeCloseTo(4.45588093706) - }) - - it('performs a uniformal skew at a given center point with three values', function() { - var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).skew(30, 150, 100) - - expect(matrix.a).toBe(1) - expect(matrix.b).toBeCloseTo(0.57735026919) - expect(matrix.c).toBeCloseTo(0.57735026919) - expect(matrix.d).toBe(1) - expect(matrix.e).toBeCloseTo(-52.0029761114) - expect(matrix.f).toBeCloseTo(-81.2931393017) - }) - - it('performs a non-uniformal skew at a given center point with four values', function() { - var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).skew(30, 20, 150, 100) - - expect(matrix.a).toBe(1.0) - expect(matrix.b).toBeCloseTo(0.363970234266) - expect(matrix.c).toBeCloseTo(0.57735026919) - expect(matrix.d).toBe(1.0) - expect(matrix.e).toBeCloseTo(-52.0029761114) - expect(matrix.f).toBeCloseTo(-50.1396542029) - }) - - it('can be chained', function(){ - var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).skew(20, 30).skew(30, 20) - expect(matrix.a).toBeCloseTo(1.33333333333) - expect(matrix.b).toBeCloseTo(0.941320503456) - expect(matrix.c).toBeCloseTo(0.941320503456) - expect(matrix.d).toBeCloseTo(1.13247433143) - expect(matrix.e).toBeCloseTo(8.1572948437) - expect(matrix.f).toBeCloseTo(7.16270500812) - }) - }) - - describe('skewX', function(){ - it('performs a skew along the x axis with one value', function() { - var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).skewX(30) - - expect(matrix.a).toBe(1) - expect(matrix.b).toBe(0) - expect(matrix.c).toBeCloseTo(0.57735026919) - expect(matrix.d).toBe(1) - expect(matrix.e).toBeCloseTo(5.73205080757) - expect(matrix.f).toBe(3) - }) - - it('performs a skew along the x axis at a given center point with three values', function() { - var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).skewX(30, 150, 100) - - expect(matrix.a).toBe(1) - expect(matrix.b).toBe(0) - expect(matrix.c).toBeCloseTo(0.57735026919) - expect(matrix.d).toBe(1) - expect(matrix.e).toBeCloseTo(-52.0029761114) - expect(matrix.f).toBe(3) - }) - }) - - describe('skewY', function(){ - it('performs a skew along the y axis with one value', function() { - var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).skewY(30) - - expect(matrix.a).toBe(1) - expect(matrix.b).toBeCloseTo(0.57735026919) - expect(matrix.c).toBe(0) - expect(matrix.d).toBe(1) - expect(matrix.e).toBe(4) - expect(matrix.f).toBeCloseTo(5.30940107676) - }) - - it('performs a skew along the y axis at a given center point with three values', function() { - var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).skewY(30, 150, 100) - - expect(matrix.a).toBe(1) - expect(matrix.b).toBeCloseTo(0.57735026919) - expect(matrix.c).toBe(0) - expect(matrix.d).toBe(1) - expect(matrix.e).toBe(4) - expect(matrix.f).toBeCloseTo(-81.2931393017) - }) - }) -}) diff --git a/spec/spec/memory.js b/spec/spec/memory.js deleted file mode 100644 index 32773a0..0000000 --- a/spec/spec/memory.js +++ /dev/null @@ -1,58 +0,0 @@ -describe('Memory', function () { - var rect, circle - - beforeEach(function() { - rect = draw.rect(100,120) - circle = draw.circle(100) - }) - - afterEach(function() { - draw.clear() - }) - - describe('remember()', function() { - it('accepts an object with values', function() { - rect.remember({ some: {cool:'and',nested:'stuff',foo:5} }) - expect(rect.remember('some').foo).toBe(5) - }) - it('accepts key / value arguments', function() { - rect.remember('fill', rect.attr('fill')) - rect.fill('#f09') - expect(rect.remember('fill')).toBe('#000000') - }) - it('acts as a getter with one string argument', function() { - rect.remember('opacity', 0.85) - expect(rect.remember('opacity')).toBe(0.85) - }) - it('saves values to individual objects', function() { - rect.remember('opacity', 0.85) - circle.remember('opacity', 0.5) - expect(rect.remember('opacity')).toBe(0.85) - expect(circle.remember('opacity')).toBe(0.5) - }) - }) - - describe('forget()', function() { - it('deletes a given memory', function() { - rect.remember({ grass: 'is green', one: 1 }) - rect.forget('grass') - expect(rect.remember('grass')).toBe(undefined) - expect(rect.remember('one')).toBe(1) - }) - it('accepts multiple arguments as different memories', function() { - rect.remember({ grass: 'might be purple', two: 2, sea: true }) - rect.forget('grass', 'sea') - expect(rect.remember('grass')).toBe(undefined) - expect(rect.remember('sea')).toBe(undefined) - expect(rect.remember('two')).toBe(2) - }) - it('clears the whole memory without arguments', function() { - rect.remember({ grass: 'is never pink', three: 3, tree: true }) - rect.forget() - expect(rect.remember('grass')).toBe(undefined) - expect(rect.remember('tree')).toBe(undefined) - expect(rect.remember('three')).toBe(undefined) - }) - }) - -})
\ No newline at end of file diff --git a/spec/spec/path.js b/spec/spec/path.js deleted file mode 100644 index 28780c9..0000000 --- a/spec/spec/path.js +++ /dev/null @@ -1,261 +0,0 @@ -describe('Path', function() { - var path - - beforeEach(function() { - path = draw.path(svgPath) - }) - - afterEach(function() { - draw.clear() - }) - - describe('()', function() { - it('falls back to a single point without an argument', function() { - path = draw.path() - expect(path.attr('d')).toBe('M0 0 ') - }) - }) - - describe('array()', function() { - it('returns an instance of SVG.PathArray', function() { - expect(path.array() instanceof SVG.PathArray).toBeTruthy() - }) - it('returns the value stored in the private variable _array', function() { - expect(path.array()).toBe(path._array) - }) - }) - - describe('x()', function() { - it('returns the value of x without an argument', function() { - expect(path.x()).toBe(0) - }) - it('sets the value of x with the first argument', function() { - path.x(123) - var box = path.bbox() - expect(box.x).toBe(123) - }) - }) - - describe('y()', function() { - it('returns the value of y without an argument', function() { - expect(path.y()).toBe(0) - }) - it('sets the value of y with the first argument', function() { - path.y(345) - var box = path.bbox() - expect(box.y).toBe(345) - }) - }) - - describe('cx()', function() { - it('returns the value of cx without an argument', function() { - expect(path.cx()).toBe(50) - }) - it('sets the value of cx with the first argument', function() { - path.cx(123) - var box = path.bbox() - expect(box.cx).toBe(123) - }) - }) - - describe('cy()', function() { - it('returns the value of cy without an argument', function() { - expect(path.cy()).toBe(50) - }) - it('sets the value of cy with the first argument', function() { - path.cy(345) - var box = path.bbox() - expect(box.cy).toBe(345) - }) - }) - - describe('move()', function() { - it('sets the x and y position', function() { - path.move(123,456) - var box = path.bbox() - expect(box.x).toBe(123) - expect(box.y).toBe(456) - }) - it('sets the x and y position when scaled to half its size', function() { - path.scale(0.5, 0, 0).move(123,456) - var box = path.bbox() - expect(box.x).toBe(123) - expect(box.y).toBe(456) - }) - }) - - describe('dx()', function() { - it('moves the x positon of the element relative to the current position', function() { - path.move(50,60) - path.dx(100) - var box = path.bbox() - expect(box.x).toBe(150) - }) - }) - - describe('dy()', function() { - it('moves the y positon of the element relative to the current position', function() { - path.move(50, 60) - path.dy(120) - var box = path.bbox() - expect(box.y).toBe(180) - }) - }) - - describe('dmove()', function() { - it('moves the x and y positon of the element relative to the current position', function() { - path.move(50,60) - path.dmove(80, 25) - var box = path.bbox() - expect(box.x).toBe(130) - expect(box.y).toBe(85) - }) - }) - - describe('center()', function() { - it('sets the cx and cy position', function() { - path.center(321,567) - var box = path.bbox() - expect(box.x).toBe(271) - expect(box.y).toBe(517) - }) - }) - - describe('width()', function() { - it('sets the width of the element', function() { - path.width(234) - var box = path.bbox() - expect(box.width).toBeCloseTo(234) - }) - it('gets the width of the element without an argument', function() { - path.width(456) - expect(path.width()).toBeCloseTo(456) - }) - }) - - describe('height()', function() { - it('sets the height of the element', function() { - path.height(654) - var box = path.bbox() - expect(box.height).toBeCloseTo(654) - }) - it('gets the height of the element without an argument', function() { - path.height(321) - expect(path.height()).toBeCloseTo(321) - }) - }) - - describe('size()', function() { - it('defines the width and height of the element', function() { - path.size(987,654) - var box = path.bbox() - expect(box.width).toBeCloseTo(987) - expect(box.height).toBeCloseTo(654) - }) - it('defines the width and height proportionally with only the width value given', function() { - var box = path.bbox() - path.size(500) - expect(path.width()).toBeCloseTo(500) - expect(path.width() / path.height()).toBe(box.width / box.height) - }) - it('defines the width and height proportionally with only the height value given', function() { - var box = path.bbox() - path.size(null, 525) - expect(path.height()).toBe(525) - expect(path.width() / path.height()).toBeCloseTo(box.width / box.height) - }) - it('doesn\'t scale width/height when their value is 0', function() { - path = draw.path('M0 0L0 100') - path.size(500, 500) - expect(path.attr('d')).toBe('M0 0L0 500 ') - - path = draw.path('M0 0L100 0') - path.size(500, 500) - expect(path.attr('d')).toBe('M0 0L500 0 ') - }) - }) - - describe('scale()', function() { - it('should scale the element universally with one argument', function() { - var box1 = path.rbox() - , box2 = path.scale(2).rbox() - - expect(box1.width * 2).toBe(box2.width) - expect(box1.height * 2).toBe(box2.height) - }) - it('should scale the element over individual x and y axes with two arguments', function() { - var box1 = path.rbox() - , box2 = path.scale(2, 3.5).rbox() - - expect(box1.width * 2).toBe(box2.width) - expect(box1.height * 3.5).toBe(box2.height) - }) - }) - - describe('translate()', function() { - it('sets the translation of an element', function() { - path.transform({ tx: 12, ty: 12 }) - expect(path.node.getAttribute('transform')).toBe('matrix(1,0,0,1,12,12)') - }) - }) - - describe('plot()', function() { - it('changes the d attribute of the underlying path node when a string is passed', function() { - var pathString = 'm 3,2 c 0,0 -0,13 8,14 L 5,4' - , pathArray = new SVG.PathArray(pathString) - - expect(path.plot(pathString)).toBe(path) - expect(path.attr('d')).toBe(pathString) - }) - it('clears the array cache when a value is passed', function() { - path = draw.path([ ['M', 50, 60], ['A', 60, 60, 0, 0, 0, 50, -60], ['z'] ]) - expect(path._array instanceof SVG.PathArray).toBeTruthy() - path.plot('m 3,2 c 0,0 -0,13 8,14 L 5,4') - expect(path._array).toBeUndefined() - }) - it('applies a given path string value as is', function() { - var pathString = 'm 3,2 c 0,0 -0,13 8,14 L 5,4' - - path = draw.path(pathString) - expect(path.attr('d')).toBe(pathString) - }) - it('does not parse and cache a given string value to SVG.PathArray', function() { - path = draw.path('m 3,2 c 0,0 -0,13 8,14 L 5,4') - expect(path._array).toBeUndefined() - }) - it('caches a given array value', function() { - path = draw.path([ ['M', 50, 60], ['A', 60, 60, 0, 0, 0, 50, -60], ['H', 100], ['L', 20, 30], ['Z'] ]) - expect(path._array instanceof SVG.PathArray).toBeTruthy() - }) - it('returns the path array when no arguments are passed', function () { - expect(path.plot()).toBe(path.array()) - }) - }) - - describe('clear()', function() { - it('clears the cached SVG.PathArray instance', function() { - path = draw.path(svgPath) - path.clear() - expect(path._array).toBeUndefined() - }) - }) - - describe('toString()', function() { - it('renders path array correctly to string', function() { - path = path.plot(['M', 50, 60, 'A', 60, 60, 0, 0, 0, 50, -60, 'H', 100, 'V', 100, 'L', 20, 30, 'C', 10, 20, 30, 40, 50, 60 ]) - expect(path.node.getAttribute('d')).toBe('M50 60A60 60 0 0 0 50 -60H100V100L20 30C10 20 30 40 50 60 ') - }) - }) - - describe('length()', function() { - it('gets the total length of the path', function() { - expect(path.length()).toBe(path.node.getTotalLength()) - }) - }) - - describe('pointAt()', function() { - it('gets a point at given length', function() { - expect(path.pointAt(100)).toEqual(new SVG.Point(path.node.getPointAtLength(100))) - }) - }) -}) diff --git a/spec/spec/pattern.js b/spec/spec/pattern.js deleted file mode 100644 index f51caf6..0000000 --- a/spec/spec/pattern.js +++ /dev/null @@ -1,69 +0,0 @@ -describe('Pattern', function () { - var rect, pattern - - beforeEach(function () { - rect = draw.rect(100, 100) - pattern = draw.pattern(20, 30, function (add) { - add.rect(10, 10).move(10, 10) - add.circle(30) - }) - }) - - afterEach(function () { - rect.remove() - pattern.remove() - }) - - it('is an instance of SVG.Pattern', function () { - expect(pattern instanceof SVG.Pattern).toBe(true) - }) - - it('allows creation of a new gradient without block', function () { - pattern = draw.pattern(10, 30) - expect(pattern.children().length).toBe(0) - }) - - describe('url()', function () { - it('returns the id of the pattern wrapped in url()', function () { - expect(pattern.url()).toBe('url("#' + pattern.id() + '")') - }) - }) - - describe('attr()', function () { - it('will catch transform attribues and convert them to patternTransform', function () { - expect(pattern.translate(100, 100).attr('patternTransform')).toBe('matrix(1,0,0,1,100,100)') - }) - }) - - describe('toString()', function () { - it('returns the id of the pattern wrapped in url()', function () { - expect(pattern + '').toBe('url("#' + pattern.id() + '")') - }) - it('is called when instance is passed as an attribute value', function () { - rect.attr('fill', pattern) - expect(rect.attr('fill')).toBe('url("#' + pattern.id() + '")') - }) - it('is called when instance is passed in a fill() method', function () { - rect.fill(pattern) - expect(rect.attr('fill')).toBe('url("#' + pattern.id() + '")') - }) - }) - - describe('update()', function () { - - it('removes all existing children first', function () { - pattern = draw.pattern(30, 30, function (add) { - add.rect(10, 10).move(10, 10) - add.circle(30) - }) - expect(pattern.children().length).toBe(2) - pattern.update(function (add) { - add.rect(10, 10).move(10, 10) - add.circle(30) - }) - expect(pattern.children().length).toBe(2) - }) - - }) - -}) diff --git a/spec/spec/polygon.js b/spec/spec/polygon.js deleted file mode 100644 index 4cd2ea8..0000000 --- a/spec/spec/polygon.js +++ /dev/null @@ -1,228 +0,0 @@ -describe('Polygon', function() { - var polygon - - beforeEach(function() { - polygon = draw.polygon('0,0 100,0 100,100 0,100') - }) - - afterEach(function() { - draw.clear() - }) - - describe('()', function(){ - it('falls back to a single point without an argument', function() { - polygon = draw.polygon() - expect(polygon.attr('points')).toBe('0,0') - }) - }) - - - describe('array()', function() { - it('returns an instance of SVG.PointArray', function() { - expect(polygon.array() instanceof SVG.PointArray).toBeTruthy() - }) - it('returns the value stored in the private variable _array', function() { - expect(polygon.array()).toBe(polygon._array) - }) - }) - - describe('x()', function() { - it('returns the value of x without an argument', function() { - expect(polygon.x()).toBe(0) - }) - it('sets the value of x with the first argument', function() { - polygon.x(123) - var box = polygon.bbox() - expect(box.x).toBe(123) - }) - }) - - describe('y()', function() { - it('returns the value of y without an argument', function() { - expect(polygon.y()).toBe(0) - }) - it('sets the value of y with the first argument', function() { - polygon.y(345) - var box = polygon.bbox() - expect(box.y).toBe(345) - }) - }) - - describe('cx()', function() { - it('returns the value of cx without an argument', function() { - expect(polygon.cx()).toBe(50) - }) - it('sets the value of cx with the first argument', function() { - polygon.cx(123) - var box = polygon.bbox() - expect(box.cx).toBe(123) - }) - }) - - describe('cy()', function() { - it('returns the value of cy without an argument', function() { - expect(polygon.cy()).toBe(50) - }) - it('sets the value of cy with the first argument', function() { - polygon.cy(345) - var box = polygon.bbox() - expect(box.cy).toBe(345) - }) - }) - - describe('move()', function() { - it('sets the x and y position', function() { - polygon.move(123,456) - var box = polygon.bbox() - expect(box.x).toBe(123) - expect(box.y).toBe(456) - }) - }) - - describe('dx()', function() { - it('moves the x positon of the element relative to the current position', function() { - polygon.move(50,60) - polygon.dx(100) - var box = polygon.bbox() - expect(box.x).toBe(150) - }) - }) - - describe('dy()', function() { - it('moves the y positon of the element relative to the current position', function() { - polygon.move(50, 60) - polygon.dy(120) - var box = polygon.bbox() - expect(box.y).toBe(180) - }) - }) - - describe('dmove()', function() { - it('moves the x and y positon of the element relative to the current position', function() { - polygon.move(50,60) - polygon.dmove(80, 25) - var box = polygon.bbox() - expect(box.x).toBe(130) - expect(box.y).toBe(85) - }) - }) - - describe('center()', function() { - it('sets the cx and cy position', function() { - polygon.center(321,567) - var box = polygon.bbox() - expect(box.x).toBe(271) - expect(box.y).toBe(517) - }) - }) - - describe('width()', function() { - it('sets the width and height of the element', function() { - polygon.width(987) - var box = polygon.bbox() - expect(box.width).toBeCloseTo(987) - }) - it('gets the width and height of the element without an argument', function() { - polygon.width(789) - expect(polygon.width()).toBeCloseTo(789) - }) - }) - - describe('height()', function() { - it('sets the height and height of the element', function() { - polygon.height(987) - var box = polygon.bbox() - expect(box.height).toBeCloseTo(987) - }) - it('gets the height and height of the element without an argument', function() { - polygon.height(789) - expect(polygon.height()).toBeCloseTo(789) - }) - }) - - describe('size()', function() { - it('should define the width and height of the element', function() { - polygon.size(987,654) - var box = polygon.bbox() - expect(box.width).toBeCloseTo(987) - expect(box.height).toBeCloseTo(654) - }) - it('defines the width and height proportionally with only the width value given', function() { - var box = polygon.bbox() - polygon.size(500) - expect(polygon.width()).toBe(500) - expect(polygon.width() / polygon.height()).toBe(box.width / box.height) - }) - it('defines the width and height proportionally with only the height value given', function() { - var box = polygon.bbox() - polygon.size(null, 525) - expect(polygon.height()).toBe(525) - expect(polygon.width() / polygon.height()).toBe(box.width / box.height) - }) - }) - - describe('scale()', function() { - it('should scale the element universally with one argument', function() { - var box1 = polygon.rbox() - , box2 = polygon.scale(2).rbox() - - expect(box2.width).toBe(box1.width * 2) - expect(box2.height).toBe(box1.height * 2) - }) - it('should scale the element over individual x and y axes with two arguments', function() { - var box1 = polygon.rbox() - , box2 = polygon.scale(2, 3.5).rbox() - - expect(box2.width).toBe(box1.width * 2) - expect(box2.height).toBe(box1.height * 3.5) - }) - }) - - describe('translate()', function() { - it('sets the translation of an element', function() { - polygon.transform({ tx: 12, ty: 12 }) - expect(polygon.node.getAttribute('transform')).toBe('matrix(1,0,0,1,12,12)') - }) - }) - - describe('plot()', function() { - it('changes the points attribute of the underlying polygon node when a string is passed', function() { - var pointString = '100,50 75,20 200,100' - , pointArray = new SVG.PointArray(pointString) - - expect(polygon.plot(pointString)).toBe(polygon) - expect(polygon.attr('points')).toBe(pointArray.toString()) - }) - it('returns the point array when no arguments are passed', function () { - expect(polygon.plot()).toBe(polygon.array()) - }) - it('clears the array cache when a value is passed', function() { - polygon = draw.polygon([100,50,75,20,200,100]) - expect(polygon._array instanceof SVG.PointArray).toBeTruthy() - polygon.plot('100,50 75,20 200,100') - expect(polygon._array).toBeUndefined() - }) - it('applies a given polygon string value as is', function() { - var polyString = '100,50,75,20,200,100' - - polygon = draw.polygon(polyString) - expect(polygon.attr('points')).toBe(polyString) - }) - it('does not parse and cache a given string value to SVG.PointArray', function() { - polygon = draw.polygon('100,50 75,20 200,100') - expect(polygon._array).toBeUndefined() - }) - it('caches a given array value', function() { - polygon = draw.polygon([100,50,75,20,200,100]) - expect(polygon._array instanceof SVG.PointArray).toBeTruthy() - }) - }) - - describe('clear()', function() { - it('clears the cached SVG.PointArray instance', function() { - polygon = draw.polygon([100,50,75,20,200,100]) - polygon.clear() - expect(polygon._array).toBeUndefined() - }) - }) -}) diff --git a/spec/spec/polyline.js b/spec/spec/polyline.js deleted file mode 100644 index 7fbea18..0000000 --- a/spec/spec/polyline.js +++ /dev/null @@ -1,228 +0,0 @@ -describe('Polyline', function() { - var polyline - - beforeEach(function() { - polyline = draw.polyline('0,0 100,0 100,100 0,100') - }) - - afterEach(function() { - draw.clear() - }) - - describe('()', function(){ - it('falls back to a single point without an argument', function() { - polyline = draw.polyline() - expect(polyline.attr('points')).toBe('0,0') - }) - }) - - - describe('array()', function() { - it('returns an instance of SVG.PointArray', function() { - expect(polyline.array() instanceof SVG.PointArray).toBeTruthy() - }) - it('returns the value stored in the private variable _array', function() { - expect(polyline.array()).toBe(polyline._array) - }) - }) - - describe('x()', function() { - it('returns the value of x without an argument', function() { - expect(polyline.x()).toBe(0) - }) - it('sets the value of x with the first argument', function() { - polyline.x(123) - var box = polyline.bbox() - expect(box.x).toBe(123) - }) - }) - - describe('y()', function() { - it('returns the value of y without an argument', function() { - expect(polyline.y()).toBe(0) - }) - it('sets the value of y with the first argument', function() { - polyline.y(345) - var box = polyline.bbox() - expect(box.y).toBe(345) - }) - }) - - describe('cx()', function() { - it('returns the value of cx without an argument', function() { - expect(polyline.cx()).toBe(50) - }) - it('sets the value of cx with the first argument', function() { - polyline.cx(123) - var box = polyline.bbox() - expect(box.cx).toBe(123) - }) - }) - - describe('cy()', function() { - it('returns the value of cy without an argument', function() { - expect(polyline.cy()).toBe(50) - }) - it('sets the value of cy with the first argument', function() { - polyline.cy(345) - var box = polyline.bbox() - expect(box.cy).toBe(345) - }) - }) - - describe('move()', function() { - it('sets the x and y position', function() { - polyline.move(123,456) - var box = polyline.bbox() - expect(box.x).toBe(123) - expect(box.y).toBe(456) - }) - }) - - describe('dx()', function() { - it('moves the x positon of the element relative to the current position', function() { - polyline.move(50,60) - polyline.dx(100) - var box = polyline.bbox() - expect(box.x).toBe(150) - }) - }) - - describe('dy()', function() { - it('moves the y positon of the element relative to the current position', function() { - polyline.move(50, 60) - polyline.dy(120) - var box = polyline.bbox() - expect(box.y).toBe(180) - }) - }) - - describe('dmove()', function() { - it('moves the x and y positon of the element relative to the current position', function() { - polyline.move(50,60) - polyline.dmove(80, 25) - var box = polyline.bbox() - expect(box.x).toBe(130) - expect(box.y).toBe(85) - }) - }) - - describe('center()', function() { - it('sets the cx and cy position', function() { - polyline.center(321,567) - var box = polyline.bbox() - expect(box.x).toBe(271) - expect(box.y).toBe(517) - }) - }) - - describe('width()', function() { - it('sets the width and height of the element', function() { - polyline.width(987) - var box = polyline.bbox() - expect(box.width).toBeCloseTo(987, 1) - }) - it('gets the width and height of the element without an argument', function() { - polyline.width(789) - expect(polyline.width()).toBeCloseTo(789) - }) - }) - - describe('height()', function() { - it('sets the height and height of the element', function() { - polyline.height(987) - var box = polyline.bbox() - expect(box.height).toBeCloseTo(987) - }) - it('gets the height and height of the element without an argument', function() { - polyline.height(789) - expect(polyline.height()).toBeCloseTo(789) - }) - }) - - describe('size()', function() { - it('should define the width and height of the element', function() { - polyline.size(987,654) - var box = polyline.bbox() - expect(box.width).toBeCloseTo(987) - expect(box.height).toBeCloseTo(654) - }) - it('defines the width and height proportionally with only the width value given', function() { - var box = polyline.bbox() - polyline.size(500) - expect(polyline.width()).toBe(500) - expect(polyline.width() / polyline.height()).toBe(box.width / box.height) - }) - it('defines the width and height proportionally with only the height value given', function() { - var box = polyline.bbox() - polyline.size(null, 525) - expect(polyline.height()).toBe(525) - expect(polyline.width() / polyline.height()).toBe(box.width / box.height) - }) - }) - - describe('scale()', function() { - it('should scale the element universally with one argument', function() { - var box1 = polyline.rbox() - , box2 = polyline.scale(2).rbox() - - expect(box2.width).toBe(box1.width * 2) - expect(box2.height).toBe(box1.height * 2) - }) - it('should scale the element over individual x and y axes with two arguments', function() { - var box1 = polyline.rbox() - , box2 = polyline.scale(2, 3.5).rbox() - - expect(box2.width).toBe(box1.width * 2) - expect(box2.height).toBe(box1.height * 3.5) - }) - }) - - describe('translate()', function() { - it('sets the translation of an element', function() { - polyline.transform({ tx: 12, ty: 12 }) - expect(polyline.node.getAttribute('transform')).toBe('matrix(1,0,0,1,12,12)') - }) - }) - - describe('plot()', function() { - it('change the points attribute of the underlying polyline node when a string is passed', function() { - var pointString = '100,50 75,20 200,100' - , pointArray = new SVG.PointArray(pointString) - - expect(polyline.plot(pointString)).toBe(polyline) - expect(polyline.attr('points')).toBe(pointArray.toString()) - }) - it('return the point array when no arguments are passed', function () { - expect(polyline.plot()).toBe(polyline.array()) - }) - it('clears the array cache when a value is passed', function() { - polyline = draw.polyline([100,50,75,20,200,100]) - expect(polyline._array instanceof SVG.PointArray).toBeTruthy() - polyline.plot('100,50 75,20 200,100') - expect(polyline._array).toBeUndefined() - }) - it('applies a given polyline string value as is', function() { - var polyString = '100,50,75,20,200,100' - - polyline = draw.polyline(polyString) - expect(polyline.attr('points')).toBe(polyString) - }) - it('does not parse and cache a given string value to SVG.PointArray', function() { - polyline = draw.polyline('100,50 75,20 200,100') - expect(polyline._array).toBeUndefined() - }) - it('caches a given array value', function() { - polyline = draw.polyline([100,50,75,20,200,100]) - expect(polyline._array instanceof SVG.PointArray).toBeTruthy() - }) - }) - - describe('clear()', function() { - it('clears the cached SVG.PointArray instance', function() { - polyline = draw.polyline([100,50,75,20,200,100]) - polyline.clear() - expect(polyline._array).toBeUndefined() - }) - }) -}) diff --git a/spec/spec/rect.js b/spec/spec/rect.js deleted file mode 100644 index b07e10b..0000000 --- a/spec/spec/rect.js +++ /dev/null @@ -1,171 +0,0 @@ -describe('Rect', function() { - var rect - - beforeEach(function() { - rect = draw.rect(220,100) - }) - - afterEach(function() { - draw.clear() - }) - - describe('x()', function() { - it('should return the value of x without an argument', function() { - expect(rect.x()).toBe(0) - }) - it('should set the value of x with the first argument', function() { - rect.x(123) - expect(rect.node.getAttribute('x')).toBe('123') - }) - }) - - describe('y()', function() { - it('should return the value of y without an argument', function() { - expect(rect.y()).toBe(0) - }) - it('should set the value of y with the first argument', function() { - rect.y(345) - expect(rect.node.getAttribute('y')).toBe('345') - }) - }) - - describe('cx()', function() { - it('should return the value of cx without an argument', function() { - expect(rect.cx()).toBe(110) - }) - it('should set the value of cx with the first argument', function() { - rect.cx(123) - var box = rect.bbox() - expect(box.cx).toBe(123) - }) - }) - - describe('cy()', function() { - it('should return the value of cy without an argument', function() { - expect(rect.cy()).toBe(50) - }) - it('should set the value of cy with the first argument', function() { - rect.cy(345) - var box = rect.bbox() - expect(box.cy).toBe(345) - }) - }) - - describe('radius()', function() { - it('should set the rx and ry', function() { - rect.radius(10,20) - expect(rect.node.getAttribute('rx')).toBe('10') - expect(rect.node.getAttribute('ry')).toBe('20') - }) - it('should set the rx and ry if only rx given', function() { - rect.radius(30) - expect(rect.node.getAttribute('rx')).toBe('30') - expect(rect.node.getAttribute('ry')).toBe('30') - }) - }) - - describe('move()', function() { - it('should set the x and y position', function() { - rect.move(123,456) - expect(rect.node.getAttribute('x')).toBe('123') - expect(rect.node.getAttribute('y')).toBe('456') - }) - }) - - describe('dx()', function() { - it('moves the x positon of the element relative to the current position', function() { - rect.move(50,60) - rect.dx(100) - expect(rect.node.getAttribute('x')).toBe('150') - }) - }) - - describe('dy()', function() { - it('moves the y positon of the element relative to the current position', function() { - rect.move(50,60) - rect.dy(120) - expect(rect.node.getAttribute('y')).toBe('180') - }) - }) - - describe('dmove()', function() { - it('moves the x and y positon of the element relative to the current position', function() { - rect.move(50,60) - rect.dmove(80, 25) - expect(rect.node.getAttribute('x')).toBe('130') - expect(rect.node.getAttribute('y')).toBe('85') - }) - }) - - describe('center()', function() { - it('should set the cx and cy position', function() { - rect.center(321,567) - var box = rect.bbox() - expect(box.cx).toBe(321) - expect(box.cy).toBe(567) - }) - }) - - describe('width()', function() { - it('sets the width of the element', function() { - rect.width(789) - expect(rect.node.getAttribute('width')).toBe('789') - }) - it('gets the width of the element if the argument is null', function() { - expect(rect.width().toString()).toBe(rect.node.getAttribute('width')) - }) - }) - - describe('height()', function() { - it('sets the height of the element', function() { - rect.height(1236) - expect(rect.node.getAttribute('height')).toBe('1236') - }) - it('gets the height of the element if the argument is null', function() { - expect(rect.height().toString()).toBe(rect.node.getAttribute('height')) - }) - }) - - describe('size()', function() { - it('should define the width and height of the element', function() { - rect.size(987,654) - expect(rect.node.getAttribute('width')).toBe('987') - expect(rect.node.getAttribute('height')).toBe('654') - }) - it('defines the width and height proportionally with only the width value given', function() { - var box = rect.bbox() - rect.size(500) - expect(rect.width()).toBe(500) - expect(rect.width() / rect.height()).toBe(box.width / box.height) - }) - it('defines the width and height proportionally with only the height value given', function() { - var box = rect.bbox() - rect.size(null, 525) - expect(rect.height()).toBe(525) - expect(rect.width() / rect.height()).toBe(box.width / box.height) - }) - }) - - describe('scale()', function() { - it('should scale the element universally with one argument', function() { - var box = rect.scale(2).rbox() - - expect(box.width).toBe(rect.attr('width') * 2) - expect(box.height).toBe(rect.attr('height') * 2) - }) - it('should scale the element over individual x and y axes with two arguments', function() { - var box = rect.scale(2, 3.5).rbox() - - expect(box.width).toBe(rect.attr('width') * 2) - expect(box.height).toBe(rect.attr('height') * 3.5) - }) - }) - - describe('translate()', function() { - it('should set the translation of an element', function() { - rect.transform({ tx: 12, ty: 12 }) - expect(rect.node.getAttribute('transform')).toBe('matrix(1,0,0,1,12,12)') - }) - }) - -}) diff --git a/spec/spec/regex.js b/spec/spec/regex.js deleted file mode 100644 index 9a14bec..0000000 --- a/spec/spec/regex.js +++ /dev/null @@ -1,92 +0,0 @@ -describe('Regex', function() { - - describe('matchers', function() { - - describe('numberAndUnit', function() { - var match - - it('is true with a positive unit value', function() { - match = ('10%').match(SVG.regex.numberAndUnit) - expect(match[1]).toBe('10') - expect(match[5]).toBe('%') - }) - it('is true with a negative unit value', function() { - match = ('-11%').match(SVG.regex.numberAndUnit) - expect(match[1]).toBe('-11') - expect(match[5]).toBe('%') - }) - it('is false with a positive unit value', function() { - match = ('NotAUnit').match(SVG.regex.numberAndUnit) - expect(match).toBeNull() - }) - - it('is true with a number', function() { - ["1", "-1", "+15", "1.55", ".5", "5.", "1.3e2", "1E-4", "1e+12"].forEach(function(s) { - expect(SVG.regex.numberAndUnit.test(s)).toBeTruthy() - }) - }) - it('is false with a faulty number', function() { - ["+-1", "1.2.3", "1+1", "1e4.5", ".5.", "1f5", "."].forEach(function(s) { - expect(SVG.regex.numberAndUnit.test(s)).toBeFalsy() - }) - }) - it('is true with a number with unit', function() { - ["1px", "-1em", "+15%", "1.55s", ".5pt", "5.deg", "1.3e2rad", "1E-4grad", "1e+12cm"].forEach(function(s) { - expect(SVG.regex.numberAndUnit.test(s)).toBeTruthy() - }) - }) - it('is false with a faulty number or wrong unit', function() { - ["1em1", "-1eq,5"].forEach(function(s) { - expect(SVG.regex.numberAndUnit.test(s)).toBeFalsy() - }) - }) - - }) - }) - - describe('testers', function() { - - describe('isHex', function() { - it('is true with a three based hex', function() { - expect(SVG.regex.isHex.test('#f09')).toBeTruthy() - }) - it('is true with a six based hex', function() { - expect(SVG.regex.isHex.test('#fe0198')).toBeTruthy() - }) - it('is false with a faulty hex', function() { - expect(SVG.regex.isHex.test('###')).toBeFalsy() - expect(SVG.regex.isHex.test('#0')).toBeFalsy() - expect(SVG.regex.isHex.test('f06')).toBeFalsy() - }) - }) - - describe('isRgb', function() { - it('is true with an rgb value', function() { - expect(SVG.regex.isRgb.test('rgb(255,66,100)')).toBeTruthy() - }) - it('is false with a non-rgb value', function() { - expect(SVG.regex.isRgb.test('hsb(255, 100, 100)')).toBeFalsy() - }) - }) - - describe('isNumber', function() { - - it('is true with a number', function() { - ["1", "-1", "+15", "1.55", ".5", "5.", "1.3e2", "1E-4", "1e+12"].forEach(function(s) { - expect(SVG.regex.isNumber.test(s)).toBeTruthy() - }) - }) - - it('is false with a faulty number', function() { - ["1a", "+-1", "1.2.3", "1+1", "1e4.5", ".5.", "1f5", "."].forEach(function(s) { - expect(SVG.regex.isNumber.test(s)).toBeFalsy() - }) - }) - - }) - - - - }) - -})
\ No newline at end of file diff --git a/spec/spec/selector.js b/spec/spec/selector.js deleted file mode 100644 index 470eaef..0000000 --- a/spec/spec/selector.js +++ /dev/null @@ -1,64 +0,0 @@ -describe('Selector', function() { - - describe('SVG()', function() { - it('gets an element\'s instance by id', function() { - var rect = draw.rect(111, 333) - - expect(SVG('#'+rect.id())).toBe(rect) - }) - // it('gets a referenced element by attribute value', function() { - // var rect = draw.defs().rect(100, 100) - // , use = draw.use(rect) - // , mark = draw.marker(10, 10) - // , path = draw.path(svgPath).marker('end', mark) - // - // expect(SVG('#'+use.attr('href'))).toBe(rect) - // expect(SVG('#'+path.attr('marker-end'))).toBe(mark) - // }) - }) - - describe('find()', function() { - var e1, e2, e3, e4 ,e5 - - beforeEach(function() { - e1 = draw.rect(100, 100).addClass('selectable-element') - e2 = draw.rect(100, 100).addClass('unselectable-element') - e3 = draw.rect(100, 100).addClass('selectable-element') - e4 = draw.rect(100, 100).addClass('unselectable-element') - e5 = draw.rect(100, 100).addClass('selectable-element') - }) - it('gets all elements with a given class name', function() { - expect(SVG.find('rect.selectable-element')).toEqual([e1, e3, e5]) - }) - it('returns an Array', function() { - expect(SVG.find('rect.selectable-element') instanceof Array).toBe(true) - }) - }) - - describe('Parent#find()', function() { - it('gets all elements with a given class name inside a given element', function() { - var group = draw.group() - , e1 = draw.rect(100, 100).addClass('selectable-element') - , e2 = draw.rect(100, 100).addClass('unselectable-element') - , e3 = group.rect(100, 100).addClass('selectable-element') - , e4 = draw.rect(100, 100).addClass('unselectable-element') - , e5 = group.rect(100, 100).addClass('selectable-element') - - expect(group.find('rect.selectable-element')).toEqual([e3, e5]) - }) - }) - - describe('Parent#findOne()', function() { - it('gets all elements with a given class name inside a given element', function() { - var group = draw.group() - , e1 = draw.rect(100, 100).addClass('selectable-element') - , e2 = draw.rect(100, 100).addClass('unselectable-element') - , e3 = group.rect(100, 100).addClass('selectable-element') - , e4 = draw.rect(100, 100).addClass('unselectable-element') - , e5 = group.rect(100, 100).addClass('selectable-element') - - expect(group.findOne('rect.selectable-element')).toBe(e3) - }) - }) - -}) diff --git a/spec/spec/sugar.js b/spec/spec/sugar.js deleted file mode 100644 index d247242..0000000 --- a/spec/spec/sugar.js +++ /dev/null @@ -1,357 +0,0 @@ -describe('Sugar', function () { - - var rect - - beforeEach(function () { - draw.attr('viewBox', null) - }) - - afterEach(function () { - draw.clear() - }) - - describe('fill()', function () { - beforeEach(function () { - rect = draw.rect(100, 100) - }) - - afterEach(function () { - rect.remove() - }) - - it('returns the node reference', function () { - expect(rect.fill('red')).toBe(rect) - }) - - it('sets the given value', function () { - expect(rect.fill('red').attr('fill')).toBe('red') - }) - - it('sets the given value with object given', function () { - rect.fill({ color: 'red', opacity: 0.5, rule: 'odd' }) - expect(rect.attr('fill')).toBe('red') - expect(rect.attr('fill-opacity')).toBe(0.5) - expect(rect.attr('fill-rule')).toBe('odd') - }) - - it('returns fill color when called as getter', function () { - rect.fill('red') - expect(rect.fill()).toBe('red') - }) - }) - - describe('rotate()', function () { - var rect, spy, undefined - - beforeEach(function () { - rect = draw.rect(100, 100) - spyOn(rect, 'transform') - }) - - afterEach(function () { - rect.remove() - rect.transform.calls.reset() - }) - - it('redirects to transform()', function () { - rect.rotate(1, 2, 3) - expect(rect.transform).toHaveBeenCalledWith({ rotate: 1, ox: 2, oy: 3 }, true) - }) - }) - - describe('skew()', function () { - var rect, spy, undefined - - beforeEach(function () { - rect = draw.rect(100, 100) - spyOn(rect, 'transform') - }) - - afterEach(function () { - rect.remove() - rect.transform.calls.reset() - }) - - it('redirects to transform() with no argument', function () { - rect.skew() - expect(rect.transform).toHaveBeenCalledWith({ skew: [ undefined, undefined ], ox: undefined, oy: undefined }, true) - }) - - it('redirects to transform() with one argument', function () { - rect.skew(5) - expect(rect.transform).toHaveBeenCalledWith({ skew: 5, ox: undefined, oy: undefined }, true) - }) - - it('redirects to transform() with two argument', function () { - rect.skew(5, 6) - expect(rect.transform).toHaveBeenCalledWith({ skew: [ 5, 6 ], ox: undefined, oy: undefined }, true) - }) - - it('redirects to transform() with three arguments', function () { - rect.skew(5, 6, 7) - expect(rect.transform).toHaveBeenCalledWith({ skew: 5, ox: 6, oy: 7 }, true) - }) - - it('redirects to transform() with four arguments', function () { - rect.skew(5, 6, 7, 8) - expect(rect.transform).toHaveBeenCalledWith({ skew: [ 5, 6 ], ox: 7, oy: 8 }, true) - }) - }) - - describe('scale()', function () { - var rect, spy, undefined - - beforeEach(function () { - rect = draw.rect(100, 100) - spyOn(rect, 'transform') - }) - - afterEach(function () { - rect.remove() - rect.transform.calls.reset() - }) - - it('redirects to transform() with no argument', function () { - rect.scale() - expect(rect.transform).toHaveBeenCalledWith({ scale: [ undefined, undefined ], ox: undefined, oy: undefined }, true) - }) - - it('redirects to transform() with one argument', function () { - rect.scale(5) - expect(rect.transform).toHaveBeenCalledWith({ scale: 5, ox: undefined, oy: undefined }, true) - }) - - it('redirects to transform() with two argument', function () { - rect.scale(5, 6) - expect(rect.transform).toHaveBeenCalledWith({ scale: [ 5, 6 ], ox: undefined, oy: undefined }, true) - }) - - it('redirects to transform() with three arguments', function () { - rect.scale(5, 6, 7) - expect(rect.transform).toHaveBeenCalledWith({ scale: 5, ox: 6, oy: 7 }, true) - }) - - it('redirects to transform() with four arguments', function () { - rect.scale(5, 6, 7, 8) - expect(rect.transform).toHaveBeenCalledWith({ scale: [ 5, 6 ], ox: 7, oy: 8 }, true) - }) - }) - - describe('translate()', function () { - var rect, spy, undefined - - beforeEach(function () { - rect = draw.rect(100, 100) - spyOn(rect, 'transform') - }) - - afterEach(function () { - rect.remove() - rect.transform.calls.reset() - }) - - it('redirects to transform()', function () { - rect.translate(1, 2) - expect(rect.transform).toHaveBeenCalledWith({ translate: [ 1, 2 ] }, true) - }) - }) - - describe('flip()', function () { - var rect, spy, undefined - - beforeEach(function () { - rect = draw.rect(100, 100) - spyOn(rect, 'transform') - }) - - afterEach(function () { - rect.remove() - rect.transform.calls.reset() - }) - - it('redirects to transform()', function () { - rect.flip('x', 2) - expect(rect.transform).toHaveBeenCalledWith({ flip: 'x', origin: 2 }, true) - }) - - it('sets flip to "both" when calling without anything', function () { - rect.flip() - expect(rect.transform).toHaveBeenCalledWith({ flip: 'both', origin: 'center' }, true) - }) - - // this works because only x and y are valid flip values. Evereything else flips on both axis - it('sets flip to both and origin to number when called with origin only', function () { - rect.flip(5) - expect(rect.transform).toHaveBeenCalledWith({ flip: 'both', origin: 5 }, true) - }) - }) - - describe('matrix()', function () { - var rect, spy, undefined - - beforeEach(function () { - rect = draw.rect(100, 100) - spyOn(rect, 'attr') - }) - - afterEach(function () { - rect.remove() - rect.attr.calls.reset() - }) - - it('redirects to attr() directly with one argument', function () { - rect.matrix([ 1, 2, 3, 4, 5, 6 ]) - expect(rect.attr).toHaveBeenCalledWith('transform', new SVG.Matrix([ 1, 2, 3, 4, 5, 6 ])) - }) - - it('redirects to attr() directly with 6 arguments', function () { - rect.matrix(1, 2, 3, 4, 5, 6) - expect(rect.attr).toHaveBeenCalledWith('transform', new SVG.Matrix([ 1, 2, 3, 4, 5, 6 ])) - }) - }) - - describe('opacity()', function () { - var rect, spy, undefined - - beforeEach(function () { - rect = draw.rect(100, 100) - spyOn(rect, 'attr') - }) - - afterEach(function () { - rect.remove() - rect.attr.calls.reset() - }) - - it('redirects to attr() directly', function () { - rect.opacity(0.5) - expect(rect.attr).toHaveBeenCalledWith('opacity', 0.5) - }) - }) - - describe('dx() / dy()', function () { - var rect, spy, undefined - - beforeEach(function () { - rect = draw.rect(100, 100) - spyOn(rect, 'x').and.callThrough() - spyOn(rect, 'y').and.callThrough() - }) - - afterEach(function () { - rect.remove() - rect.x.calls.reset() - rect.y.calls.reset() - }) - - it('redirects to x() / y() with adding the current value', function () { - rect.dx(5) - rect.dy(5) - expect(rect.x).toHaveBeenCalledWith(jasmine.objectContaining(new SVG.Number('5'))) - expect(rect.y).toHaveBeenCalledWith(jasmine.objectContaining(new SVG.Number('5'))) - }) - - it('allows to add a percentage value', function () { - rect.move('5%', '5%') - - rect.dx('5%') - rect.dy('5%') - - expect(rect.x).toHaveBeenCalledWith(jasmine.objectContaining(new SVG.Number('10%'))) - expect(rect.y).toHaveBeenCalledWith(jasmine.objectContaining(new SVG.Number('10%'))) - }) - - it('allows to add a percentage value when no x/y is set', function () { - rect.dx('5%') - rect.dy('5%') - - expect(rect.x).toHaveBeenCalledWith(jasmine.objectContaining(new SVG.Number('5%'))) - expect(rect.y).toHaveBeenCalledWith(jasmine.objectContaining(new SVG.Number('5%'))) - }) - }) - - describe('dmove()', function () { - var rect, spy, undefined - - beforeEach(function () { - rect = draw.rect(100, 100) - spyOn(rect, 'dx').and.callThrough() - spyOn(rect, 'dy').and.callThrough() - }) - - afterEach(function () { - rect.remove() - rect.dx.calls.reset() - rect.dy.calls.reset() - }) - - it('redirects to dx() / dy() directly', function () { - rect.dmove(5, 5) - expect(rect.dx).toHaveBeenCalledWith(5) - expect(rect.dy).toHaveBeenCalledWith(5) - }) - }) - - describe('font()', function () { - var text, spy, undefined - - beforeEach(function () { - text = draw.text(loremIpsum) - spyOn(text, 'leading') - spyOn(text, 'attr') - }) - - afterEach(function () { - text.remove() - text.leading.calls.reset() - text.attr.calls.reset() - }) - - it('sets leading when given', function () { - text.font({ leading: 3 }) - expect(text.leading).toHaveBeenCalledWith(3) - }) - - it('sets text-anchor when anchor given', function () { - text.font({ anchor: 'start' }) - expect(text.attr).toHaveBeenCalledWith('text-anchor', 'start') - }) - - it('sets all font properties via attr()', function () { - text.font({ - size: 20, - family: 'Verdana', - weight: 'bold', - stretch: 'wider', - variant: 'small-caps', - style: 'italic' - }) - expect(text.attr).toHaveBeenCalledWith('font-size', 20) - expect(text.attr).toHaveBeenCalledWith('font-family', 'Verdana') - expect(text.attr).toHaveBeenCalledWith('font-weight', 'bold') - expect(text.attr).toHaveBeenCalledWith('font-stretch', 'wider') - expect(text.attr).toHaveBeenCalledWith('font-variant', 'small-caps') - expect(text.attr).toHaveBeenCalledWith('font-style', 'italic') - }) - - it('redirects all other stuff directly to attr()', function () { - text.font({ - foo: 'bar', - bar: 'baz' - }) - expect(text.attr).toHaveBeenCalledWith('foo', 'bar') - expect(text.attr).toHaveBeenCalledWith('bar', 'baz') - }) - - it('sets key value pair when called with 2 parameters', function () { - text.font('size', 20) - expect(text.attr).toHaveBeenCalledWith('font-size', 20) - }) - - it('gets value if called with one parameter', function () { - text.font('size') - expect(text.attr).toHaveBeenCalledWith('font-size', undefined) - }) - }) - -}) diff --git a/spec/spec/svg.js b/spec/spec/svg.js deleted file mode 100644 index 41fce3d..0000000 --- a/spec/spec/svg.js +++ /dev/null @@ -1,128 +0,0 @@ -describe('SVG', function() { - - describe('()', function() { - var drawing, wrapper, wrapperHTML, rect - - beforeEach(function() { - wrapper = document.createElementNS('http://www.w3.org/2000/svg', 'svg') - wrapper.id = 'testSvg' - wrapperHTML = document.createElement('div') - wrapperHTML.id = 'testDiv' - rect = document.createElementNS('http://www.w3.org/2000/svg', 'rect') - document.documentElement.appendChild(wrapper) - document.documentElement.appendChild(wrapperHTML) - }) - - afterEach(function() { - wrapper.parentNode.removeChild(wrapper) - wrapperHTML.parentNode.removeChild(wrapperHTML) - }) - - it('creates an instanceof SVG.Svg without any argument', function() { - expect(SVG() instanceof SVG.Svg).toBe(true) - expect(SVG().node.nodeName).toBe('svg') - }) - - it('creates an instanceof SVG.Dom with html node', function() { - var el = SVG(wrapperHTML) - expect(el instanceof SVG.Dom).toBe(true) - expect(el.node).toBe(wrapperHTML) - }) - - it('creates new SVG.Dom when called with css selector pointing to html node', function() { - var el = SVG('#testDiv') - expect(el instanceof SVG.Dom).toBe(true) - expect(el.node).toBe(wrapperHTML) - }) - - it('creates an instanceof SVG.Svg with svg node', function() { - var doc = SVG(wrapper) - expect(doc instanceof SVG.Svg).toBe(true) - expect(doc.node).toBe(wrapper) - }) - - it('creates new SVG.Svg when called with css selector pointing to svg node', function() { - var doc = SVG('#testSvg') - expect(doc instanceof SVG.Svg).toBe(true) - expect(doc.node).toBe(wrapper) - }) - - it('adopts any SVGElement', function() { - expect(SVG(rect) instanceof SVG.Rect).toBe(true) - expect(SVG(rect).node).toBe(rect) - }) - - it('creates an instanceof SVG.Svg when importing a whole svg', function() { - var doc = SVG('<svg width="200"><rect></rect></svg>') - - expect(doc instanceof SVG.Svg).toBe(true) - expect(doc.node.nodeName).toBe('svg') - expect(doc.width()).toBe(200) - expect(doc.get(0).node.nodeName).toBe('rect') - }) - - it('creates SVG.Shape from any shape string', function() { - var rect = SVG('<rect width="200" height="100" />') - , circle = SVG('<circle r="200" />') - - expect(rect instanceof SVG.Rect).toBe(true) - expect(rect.node.nodeName).toBe('rect') - expect(rect.width()).toBe(200) - - expect(circle instanceof SVG.Circle).toBe(true) - expect(circle.node.nodeName).toBe('circle') - expect(circle.attr('r')).toBe(200) - }) - - it('returns the argument when called with any SVG.Element', function() { - drawing = SVG(wrapper) - expect(SVG(drawing)).toBe(drawing) - }) - }) - - describe('create()', function() { - it('creates an element with given node name and return it', function() { - var element = SVG.create('rect') - - expect(element.nodeName).toBe('rect') - }) - }) - - describe('extend()', function() { - it('adds all functions in the given object to the target object', function() { - SVG.extend(SVG.Rect, { - soft: function() { - return this.opacity(0.2) - } - }) - - expect(typeof SVG.Rect.prototype.soft).toBe('function') - expect(draw.rect(100,100).soft().attr('opacity')).toBe(0.2) - }) - it('accepts and extend multiple modules at once', function() { - SVG.extend([SVG.Rect, SVG.Ellipse, SVG.Path], { - soft: function() { - return this.opacity(0.5) - } - }) - - expect(typeof SVG.Rect.prototype.soft).toBe('function') - expect(draw.rect(100,100).soft().attr('opacity')).toBe(0.5) - expect(typeof SVG.Ellipse.prototype.soft).toBe('function') - expect(draw.ellipse(100,100).soft().attr('opacity')).toBe(0.5) - expect(typeof SVG.Path.prototype.soft).toBe('function') - expect(draw.path().soft().attr('opacity')).toBe(0.5) - }) - // it('ignores non existant objects', function() { - // SVG.extend([SVG.Rect, SVG.Bogus], { - // soft: function() { - // return this.opacity(0.3) - // } - // }) - // - // expect(typeof SVG.Rect.prototype.soft).toBe('function') - // expect(draw.rect(100,100).soft().attr('opacity')).toBe(0.3) - // expect(typeof SVG.Bogus).toBe('undefined') - // }) - }) -}) diff --git a/spec/spec/symbol.js b/spec/spec/symbol.js deleted file mode 100644 index a4febbd..0000000 --- a/spec/spec/symbol.js +++ /dev/null @@ -1,16 +0,0 @@ -describe('Symbol', function() { - describe('()', function() { - var element - - beforeEach(function() { - element = draw.symbol() - }) - - it('creates an instance of SVG.Symbol', function() { - expect(element instanceof SVG.Symbol).toBeTruthy() - }) - it('is an instance of SVG.Container', function() { - expect(element instanceof SVG.Container).toBeTruthy() - }) - }) -})
\ No newline at end of file diff --git a/spec/spec/textpath.js b/spec/spec/textpath.js deleted file mode 100644 index 9d4577f..0000000 --- a/spec/spec/textpath.js +++ /dev/null @@ -1,98 +0,0 @@ -describe('TextPath', function() { - var text - , path - , txt = 'We go up, then we go down, then up again' - , data = 'M 100 200 C 200 100 300 0 400 100 C 500 200 600 300 700 200 C 800 100 900 100 900 100' - - beforeEach(function() { - text = draw.text(txt) - path = draw.path(data) - }) - - afterEach(function() { - draw.clear() - }) - - describe('textPath()', function () { - it ('creates a new textPath and uses text and path', function () { - expect(draw.textPath(txt, data)).toEqual(jasmine.any(SVG.TextPath)) - }) - - it ('reuses text and path instances if possible', function () { - const textPath = draw.textPath(text, path) - expect(text.find('textPath')[0]).toBe(textPath) - expect(textPath.reference('href')).toBe(path) - }) - - it ('passes the text into textPath and not text', function () { - const tspan = text.first() - const textPath = draw.textPath(text, path) - expect(textPath.first()).toBe(tspan) - expect(text.first()).toBe(textPath) - }) - }) - - describe('text().path()', function() { - it('returns an instance of TextPath', function() { - expect(text.path(data) instanceof SVG.TextPath).toBe(true) - }) - it('creates a textPath node in the text element', function() { - text.path(data) - expect(text.node.querySelector('textPath')).not.toBe(null) - }) - it('references the passed path', function () { - const textPath = text.path(path) - expect(textPath.reference('href')).toBe(path) - }) - }) - - describe('path().text()', function() { - it('returns an instance of TextPath', function() { - expect(path.text(txt) instanceof SVG.TextPath).toBe(true) - }) - it('creates a text with textPath node and inserts it after the path', function() { - var textPath = path.text(txt) - expect(textPath.parent() instanceof SVG.Text).toBe(true) - expect(SVG.adopt(path.node.nextSibling) instanceof SVG.Text).toBe(true) - }) - it('transplants the node from text to textPath', function () { - let nodesInText = [].slice.call(text.node.childNodes) - var textPath = path.text(txt) - let nodesInTextPath = [].slice.call(textPath.node.childNodes) - expect(nodesInText).toEqual(nodesInTextPath) - }) - }) - - describe('text.textPath()', function() { - it('returns only the first textPath element in a text', function() { - text.path(data) - expect(text.textPath() instanceof SVG.TextPath).toBe(true) - }) - }) - - describe('track()', function() { - it('returns the referenced path instance', function() { - expect(text.path(data).track() instanceof SVG.Path).toBe(true) - }) - }) - - describe('array()', function() { - it('return the path array of the underlying path', function() { - expect(text.path(data).array()).toEqual(new SVG.PathArray(data)) - }) - it('return null if there is no underlying path', function () { - expect(text.path(data).attr('href', null, SVG.xlink).array()).toBe(null) - }) - }) - - describe('plot()', function() { - it('change the array of the underlying path when a string is passed', function() { - expect(text.path().plot(data).array()).toEqual(new SVG.PathArray(data)) - }) - it('return the path array of the underlying path when no arguments is passed', function () { - var textPath = text.path(data) - expect(textPath.plot()).toBe(textPath.array()) - expect(textPath.plot()).not.toBe(null) - }) - }) -}) diff --git a/spec/spec/types/ArrayPolyfill.js b/spec/spec/types/ArrayPolyfill.js deleted file mode 100644 index edf12bd..0000000 --- a/spec/spec/types/ArrayPolyfill.js +++ /dev/null @@ -1,27 +0,0 @@ -/* globals describe, expect, it, jasmine */ - -import { subClassArray } from '../../../src/types/ArrayPolyfill.js' -const { any, createSpy } = jasmine - -describe('ArrayPolyfill.js', function () { - describe('subClassArray()', function () { - it('creates a new class inherited from Array', () => { - const MyArray = subClassArray('myArray', Array) - expect(new MyArray()).toEqual(any(Array)) - expect(new MyArray()).toEqual(any(MyArray)) - }) - - it('sets the name attribute of the class correctly', () => { - const MyArray = subClassArray('myArray', Array) - expect(MyArray.name).toEqual('myArray') - }) - - it('calls the given function on construction', () => { - const spy = createSpy() - const MyArray = subClassArray('myArray', Array, spy) - - new MyArray(1, 2, 3, 4) // eslint-disable-line - expect(spy).toHaveBeenCalledWith(1, 2, 3, 4) - }) - }) -}) diff --git a/spec/spec/use.js b/spec/spec/use.js deleted file mode 100644 index 5935710..0000000 --- a/spec/spec/use.js +++ /dev/null @@ -1,43 +0,0 @@ -describe('Use', function() { - var use - - describe('on a container element', function() { - var rect - - beforeEach(function() { - rect = draw.rect(100,100) - use = draw.use(rect) - }) - - it('creates an instance of SVG.Use', function() { - expect(use instanceof SVG.Use).toBe(true) - }) - - it('sets the target element id to its href attribute', function() { - expect(use.node.getAttributeNS(SVG.namespaces.xlink, 'href')).toBe('#' + rect) - }) - - it('adopts the geometry of the target element', function() { - expect(use.bbox()).toEqual(rect.bbox()) - }) - }) - - describe('on an external path', function() { - var file = 'http://upload.wikimedia.org/wikipedia/commons/8/84/Example.svg' - , id = 'flowRoot1882' - - beforeEach(function() { - use = draw.use(id, file) - }) - - it('creates an instance of SVG.Use', function() { - expect(use instanceof SVG.Use).toBe(true) - }) - - it('sets the target element id and file path to its href attribute', function() { - expect(use.node.getAttributeNS(SVG.namespaces.xlink, 'href')).toBe(file + '#' + id) - }) - - }) - -}) diff --git a/spec/spec/utils.js b/spec/spec/utils.js deleted file mode 100644 index be8262e..0000000 --- a/spec/spec/utils.js +++ /dev/null @@ -1,10 +0,0 @@ -describe('SVG.utils', function() { - describe('degrees()', function() { - it('converts radiant to degrees', function() { - expect(SVG.utils.degrees(Math.PI)).toBe(180) - }) - it('maps to 0 - 360 degree only', function() { - expect(SVG.utils.degrees(2.5 * Math.PI)).toBe(90) - }) - }) -})
\ No newline at end of file diff --git a/spec/spec/utils/adopter.js b/spec/spec/utils/adopter.js index e544752..5ed6713 100644 --- a/spec/spec/utils/adopter.js +++ b/spec/spec/utils/adopter.js @@ -66,7 +66,7 @@ describe('adopter.js', () => { }) it('creates an element from passed svg string', () => { - const rect = makeInstance('<rect width="200px">') + const rect = makeInstance('<rect width="200px" />') expect(adoptSpy).toHaveBeenCalledWith(any(Node)) expect(adoptSpy).toHaveBeenCalledWith(objectContaining({ nodeName: 'rect' })) @@ -84,7 +84,7 @@ describe('adopter.js', () => { }) it('does not have its wrapper attached', () => { - const rect = makeInstance('<rect width="200px">') + const rect = makeInstance('<rect width="200px" />') expect(rect.parent()).toBe(null) }) @@ -212,6 +212,7 @@ describe('adopter.js', () => { expect(typeof A.prototype.test).toBe('function') expect(new A().test().prop).toBe('test') }) + it('accepts and extend multiple modules at once', () => { const A = class {} const B = class {} diff --git a/spec/spec/utils/methods.js b/spec/spec/utils/methods.js new file mode 100644 index 0000000..10d50d8 --- /dev/null +++ b/spec/spec/utils/methods.js @@ -0,0 +1,30 @@ +/* globals describe, expect, it */ + +import { registerMethods, getMethodsFor, getMethodNames } from '../../../src/utils/methods.js' + +describe('methods.js', () => { + describe('registerMethods() / getMethodsFor() / addMethodNames / getMethodNames()', () => { + it('adds methods for a given type of classes with object given', () => { + const foo = { + func1: () => {} + } + registerMethods({ foo }) + + expect(getMethodsFor('foo')).toEqual(foo) + }) + + it('adds methods for a given type of classes with 2 parameters given', () => { + const foo = { + func1: () => {} + } + registerMethods('foo', foo) + + expect(getMethodsFor('foo')).toEqual(foo) + }) + + it('adds a method name', () => { + registerMethods({ bar: { func2: () => {} } }) + expect(getMethodNames()).toContain('func2') + }) + }) +}) diff --git a/spec/spec/utils/window.js b/spec/spec/utils/window.js new file mode 100644 index 0000000..65fbcab --- /dev/null +++ b/spec/spec/utils/window.js @@ -0,0 +1,36 @@ +/* globals describe, expect, it */ + +import { registerWindow, globals, withWindow, getWindow, saveWindow, restoreWindow } from '../../../src/utils/window.js' + +describe('window.js', () => { + describe('registerWindow()', () => { + it('sets a new window as global', () => { + saveWindow() + const win = {} + const doc = {} + registerWindow(win, doc) + expect(globals.window).toBe(win) + expect(globals.document).toBe(doc) + restoreWindow() // we need this or jasmine will fail in afterAll + }) + }) + + describe('withWindow()', () => { + it('runs a function in the specified window context', () => { + const win = { foo: 'bar', document: {} } + const oldWindow = globals.window + expect(globals.window).not.toBe(win) + withWindow({ foo: 'bar', document: {} }, () => { + expect(globals.window).toEqual(win) + expect(globals.document).toEqual(win.document) + }) + expect(globals.window).toBe(oldWindow) + }) + }) + + describe('getWindow()', () => { + it('returns the registered window', () => { + expect(getWindow()).toBe(globals.window) + }) + }) +}) diff --git a/spec/support/jasmine.json b/spec/support/jasmine.json deleted file mode 100644 index c7845fc..0000000 --- a/spec/support/jasmine.json +++ /dev/null @@ -1,9 +0,0 @@ -{ - "spec_dir": "spec/spec", - "spec_files": [ - "!(helpers).js" - ], - "helpers": [ - "helpers.js" - ] -} |