added tests for Path

diff --git a/spec/spec/elements/Line.js b/spec/spec/elements/Line.js
index 9fe1871e889b15a6669e3203c6b2bf3616454890..ebb2406ba60df6a8ec3a659aee237c1b99c6e223 100644 (file)
--- a/spec/spec/elements/Line.js
+++ b/spec/spec/elements/Line.js
@@ -29,6 +29,21 @@ describe('Line.js', () => {
     })
   })
 
+  describe('move()', () => {
+    it('returns itself', () => {
+      expect(line.move(0, 0)).toBe(line)
+    })
+
+    it('moves the line along x and y axis', () => {
+      const canvas = SVG().addTo(container)
+      const line = canvas.line(1, 2, 3, 4)
+      line.move(50, 50)
+      expect(line.bbox()).toEqual(objectContaining({
+        x: 50, y: 50, width: 2, height: 2
+      }))
+    })
+  })
+
   describe('plot()', () => {
     it('relays to array() as getter', () => {
       const spy = spyOn(line, 'array')
@@ -42,6 +57,12 @@ describe('Line.js', () => {
       expect(spy).toHaveBeenCalledWith({ x1: 1, y1: 2, x2: 3, y2: 4 })
     })
 
+    it('calls attr with line attributes when string given', () => {
+      const spy = spyOn(line, 'attr')
+      line.plot('1, 2, 3, 4')
+      expect(spy).toHaveBeenCalledWith({ x1: 1, y1: 2, x2: 3, y2: 4 })
+    })
+
     it('calls attr with line attributes when array given', () => {
       const spy = spyOn(line, 'attr')
       line.plot([ 1, 2, 3, 4 ])
@@ -61,30 +82,33 @@ describe('Line.js', () => {
     })
   })
 
-  describe('move()', () => {
+  describe('size()', () => {
     it('returns itself', () => {
-      expect(line.move(0, 0)).toBe(line)
+      expect(line.size(50, 50)).toBe(line)
     })
 
-    it('moves the line along x and y axis', () => {
+    it('sets the size of the line', () => {
       const canvas = SVG().addTo(container)
       const line = canvas.line(1, 2, 3, 4)
-      line.move(50, 50)
+      line.size(50, 50)
       expect(line.bbox()).toEqual(objectContaining({
-        x: 50, y: 50, width: 2, height: 2
+        width: 50, height: 50, x: 1, y: 2
       }))
     })
-  })
 
-  describe('size()', () => {
-    it('returns itself', () => {
-      expect(line.size(50, 50)).toBe(line)
+    it('changes height proportionally', () => {
+      const canvas = SVG().addTo(container)
+      const line = canvas.line(1, 2, 3, 4)
+      line.size(50, null)
+      expect(line.bbox()).toEqual(objectContaining({
+        width: 50, height: 50, x: 1, y: 2
+      }))
     })
 
-    it('sets the size of the line', () => {
+    it('changes width proportionally', () => {
       const canvas = SVG().addTo(container)
       const line = canvas.line(1, 2, 3, 4)
-      line.size(50, 50)
+      line.size(null, 50)
       expect(line.bbox()).toEqual(objectContaining({
         width: 50, height: 50, x: 1, y: 2
       }))

diff --git a/spec/spec/elements/Path.js b/spec/spec/elements/Path.js
new file mode 100644 (file)
index 0000000..e388fdb
--- /dev/null
+++ b/spec/spec/elements/Path.js
@@ -0,0 +1,188 @@
+/* globals describe, expect, beforeEach, it, spyOn, jasmine, container */
+
+import { Path, SVG, PathArray } from '../../../src/main.js'
+
+const { any, objectContaining } = jasmine
+
+describe('Path.js', () => {
+  let path
+
+  beforeEach(() => {
+    path = new Path()
+  })
+
+  describe('()', () => {
+    it('creates a new object of type Path', () => {
+      expect(new Path()).toEqual(any(Path))
+    })
+
+    it('sets passed attributes on the element', () => {
+      expect(new Path({ id: 'foo' }).id()).toBe('foo')
+    })
+  })
+
+  describe('array()', () => {
+    it('returns the underlying PathArray', () => {
+      const array = path.plot('M1 2 3 4').array()
+      expect(array).toEqual(any(PathArray))
+      expect(array).toEqual([ [ 'M', 1, 2 ], [ 'L', 3, 4 ] ])
+    })
+  })
+
+  describe('clear()', () => {
+    it('clears the array cache and returns itself', () => {
+      const array = path.plot('M1 2 3 4').array()
+      expect(path.clear()).toBe(path)
+      expect(array).not.toBe(path._array)
+    })
+  })
+
+  describe('height()', () => {
+    it('gets the height of the path', () => {
+      const canvas = SVG().addTo(container)
+      const path = canvas.path('M0 0 50, 50')
+      expect(path.height()).toBe(50)
+    })
+
+    it('sets the height of the path and returns itself', () => {
+      const canvas = SVG().addTo(container)
+      const path = canvas.path('M0 0 50, 50')
+      expect(path.height(100)).toBe(path)
+      expect(path.height()).toBe(100)
+    })
+  })
+
+  describe('move()', () => {
+    it('returns itself', () => {
+      expect(path.move(0, 0)).toBe(path)
+    })
+
+    it('moves the path along x and y axis', () => {
+      const canvas = SVG().addTo(container)
+      const path = canvas.path('M0 0 50, 50')
+      path.move(50, 50)
+      expect(path.bbox()).toEqual(objectContaining({
+        x: 50, y: 50, width: 50, height: 50
+      }))
+    })
+  })
+
+  describe('plot()', () => {
+    it('relays to array() as getter', () => {
+      const spy = spyOn(path, 'array')
+      path.plot()
+      expect(spy).toHaveBeenCalled()
+    })
+
+    it('works by passing a string', () => {
+      const spy = spyOn(path, 'attr')
+      path.plot('M0 0 50 50')
+      expect(spy).toHaveBeenCalledWith('d', 'M0 0 50 50')
+    })
+
+    it('works with flat array', () => {
+      const spy = spyOn(path, 'attr')
+      path.plot([ 'M', 0, 0, 'L', 50, 50 ])
+      expect(spy).toHaveBeenCalledWith('d', [ [ 'M', 0, 0 ], [ 'L', 50, 50 ] ])
+    })
+
+    it('works with multi array', () => {
+      const spy = spyOn(path, 'attr')
+      path.plot([ [ 'M', 0, 0 ], [ 'L', 50, 50 ] ])
+      expect(spy).toHaveBeenCalledWith('d', [ [ 'M', 0, 0 ], [ 'L', 50, 50 ] ])
+    })
+
+    it('works with PathArray', () => {
+      const spy = spyOn(path, 'attr')
+      path.plot(new PathArray([ [ 'M', 0, 0 ], [ 'L', 50, 50 ] ]))
+      expect(spy).toHaveBeenCalledWith('d', [ [ 'M', 0, 0 ], [ 'L', 50, 50 ] ])
+    })
+  })
+
+  describe('size()', () => {
+    it('returns itself', () => {
+      expect(path.size(50, 50)).toBe(path)
+    })
+
+    it('sets the size of the path', () => {
+      const canvas = SVG().addTo(container)
+      const path = canvas.path('M0 0 50, 50')
+      path.size(100, 100)
+      expect(path.bbox()).toEqual(objectContaining({
+        width: 100, height: 100, x: 0, y: 0
+      }))
+    })
+
+    it('changes height proportionally', () => {
+      const canvas = SVG().addTo(container)
+      const path = canvas.path('M0 0 50, 50')
+      path.size(100, null)
+      expect(path.bbox()).toEqual(objectContaining({
+        width: 100, height: 100, x: 0, y: 0
+      }))
+    })
+
+    it('changes width proportionally', () => {
+      const canvas = SVG().addTo(container)
+      const path = canvas.path('M0 0 50, 50')
+      path.size(null, 100)
+      expect(path.bbox()).toEqual(objectContaining({
+        width: 100, height: 100, x: 0, y: 0
+      }))
+    })
+  })
+
+  describe('targets()', () => {
+    it('gets all targets of this path', () => {
+      const canvas = SVG().addTo(container)
+      const path = canvas.path('M0 0 50, 50')
+      const textPath = canvas.text('Hello World').path(path)
+      expect(path.targets()).toEqual([ textPath ])
+    })
+  })
+
+  describe('width()', () => {
+    it('gets the width of the path', () => {
+      const canvas = SVG().addTo(container)
+      const path = canvas.path('M0 0 50, 50')
+      expect(path.width()).toBe(50)
+    })
+
+    it('sets the width of the path and returns itself', () => {
+      const canvas = SVG().addTo(container)
+      const path = canvas.path('M0 0 50, 50')
+      expect(path.width(100)).toBe(path)
+      expect(path.width()).toBe(100)
+    })
+  })
+
+  describe('x()', () => {
+    it('gets the x position of the path', () => {
+      const canvas = SVG().addTo(container)
+      const path = canvas.path('M10 10 50, 50')
+      expect(path.x()).toBe(10)
+    })
+
+    it('sets the x position of the path and returns itself', () => {
+      const canvas = SVG().addTo(container)
+      const path = canvas.path('M0 0 50, 50')
+      expect(path.x(100)).toBe(path)
+      expect(path.x()).toBe(100)
+    })
+  })
+
+  describe('y()', () => {
+    it('gets the y position of the path', () => {
+      const canvas = SVG().addTo(container)
+      const path = canvas.path('M10 10 50, 50')
+      expect(path.y()).toBe(10)
+    })
+
+    it('sets the y position of the path and returns itself', () => {
+      const canvas = SVG().addTo(container)
+      const path = canvas.path('M0 0 50, 50')
+      expect(path.y(100)).toBe(path)
+      expect(path.y()).toBe(100)
+    })
+  })
+})

diff --git a/src/elements/Line.js b/src/elements/Line.js
index b9982f4d22655c86a0791ff7c5823db3f427c6b2..1b72a7dc659860e06ae4ea526160f861c2e45986 100644 (file)
--- a/src/elements/Line.js
+++ b/src/elements/Line.js
@@ -24,6 +24,11 @@ export default class Line extends Shape {
     ])
   }
 
+  // Move by left top corner
+  move (x, y) {
+    return this.attr(this.array().move(x, y).toLine())
+  }
+
   // Overwrite native plot() method
   plot (x1, y1, x2, y2) {
     if (x1 == null) {
@@ -37,11 +42,6 @@ export default class Line extends Shape {
     return this.attr(x1)
   }
 
-  // Move by left top corner
-  move (x, y) {
-    return this.attr(this.array().move(x, y).toLine())
-  }
-
   // Set element size to given width and height
   size (width, height) {
     var p = proportionalSize(this, width, height)

diff --git a/src/elements/Path.js b/src/elements/Path.js
index 8f373193a482212386b4db1735658083be3922d5..018a8c6a32d10791298a5228dcda478ad936862f 100644 (file)
--- a/src/elements/Path.js
+++ b/src/elements/Path.js
@@ -16,31 +16,26 @@ export default class Path extends Shape {
     return this._array || (this._array = new PathArray(this.attr('d')))
   }
 
-  // Plot new path
-  plot (d) {
-    return (d == null) ? this.array()
-      : this.clear().attr('d', typeof d === 'string' ? d : (this._array = new PathArray(d)))
-  }
-
   // Clear array cache
   clear () {
     delete this._array
     return this
   }
 
+  // Set height of element
+  height (height) {
+    return height == null ? this.bbox().height : this.size(this.bbox().width, height)
+  }
+
   // Move by left top corner
   move (x, y) {
     return this.attr('d', this.array().move(x, y))
   }
 
-  // Move by left top corner over x-axis
-  x (x) {
-    return x == null ? this.bbox().x : this.move(x, this.bbox().y)
-  }
-
-  // Move by left top corner over y-axis
-  y (y) {
-    return y == null ? this.bbox().y : this.move(this.bbox().x, y)
+  // Plot new path
+  plot (d) {
+    return (d == null) ? this.array()
+      : this.clear().attr('d', typeof d === 'string' ? d : (this._array = new PathArray(d)))
   }
 
   // Set element size to given width and height
@@ -49,19 +44,25 @@ export default class Path extends Shape {
     return this.attr('d', this.array().size(p.width, p.height))
   }
 
+  targets () {
+    return baseFind('svg textpath [href*="' + this.id() + '"]')
+  }
+
   // Set width of element
   width (width) {
     return width == null ? this.bbox().width : this.size(width, this.bbox().height)
   }
 
-  // Set height of element
-  height (height) {
-    return height == null ? this.bbox().height : this.size(this.bbox().width, height)
+  // Move by left top corner over x-axis
+  x (x) {
+    return x == null ? this.bbox().x : this.move(x, this.bbox().y)
   }
 
-  targets () {
-    return baseFind('svg textpath [href*="' + this.id() + '"]')
+  // Move by left top corner over y-axis
+  y (y) {
+    return y == null ? this.bbox().y : this.move(this.bbox().x, y)
   }
+
 }
 
 // Define morphable array