add tests for selector and arrange, simplifed front() and back()

3 files changed, 300 insertions, 9 deletions

diff --git a/spec/spec/modules/core/selector.js b/spec/spec/modules/core/selector.js
new file mode 100644
index 0000000..7a17466
--- /dev/null
+++ b/spec/spec/modules/core/selector.js
@@ -0,0 +1,60 @@
+/* globals describe, expect, it, container */
+
+import { find, SVG, G } from '../../../../src/main.js'
+import { getWindow } from '../../../../src/utils/window.js'
+
+describe('selector.js', () => {
+  describe('baseFind()', () => {
+    it('finds all elements of a selector in the document', () => {
+      const div = SVG('<div>', true).id('foo').addTo(container)
+      const span = SVG('<span>', true).addClass('bar').addTo(div)
+      const span2 = SVG('<span>', true).addTo(div)
+
+      expect(find('#canvas').map(el => el.node)).toEqual([ container ])
+      expect(find('span')).toEqual([ span, span2 ])
+      expect(find('#foo')).toEqual([ div ])
+      expect(find('.bar')).toEqual([ span ])
+    })
+
+    it('finds all elements of a selector scoped to an element', () => {
+      const div = SVG('<div>', true).id('foo').addTo(container)
+
+      expect(find('#canvas', getWindow().document)[0].node).toBe(container)
+      expect(find('#foo', container)).toEqual([ div ])
+      expect(find('#canvas', div.node)).toEqual([])
+    })
+  })
+
+  describe('Dom', () => {
+    describe('find()', () => {
+      it('finds all elements matching the selector in this element', () => {
+        const g1 = new G()
+        const g2 = new G().addTo(g1).id('foo')
+        const g3 = new G().addTo(g1).addClass('bar')
+        const g4 = new G().addTo(g2)
+        const g5 = new G().addTo(g3)
+
+        expect(g1.find('g')).toEqual([ g2, g4, g3, g5 ])
+        expect(g2.find('g')).toEqual([ g4 ])
+        expect(g1.find('#foo')).toEqual([ g2 ])
+        expect(g2.find('#foo')).toEqual([])
+        expect(g1.find('.bar')).toEqual([ g3 ])
+      })
+    })
+
+    describe('findOne()', () => {
+      it('finds an element in this element', () => {
+        const g1 = new G()
+        const g2 = new G().addTo(g1).id('foo')
+        const g3 = new G().addTo(g1).addClass('bar')
+        const g4 = new G().addTo(g2)
+
+        expect(g1.findOne('g')).toBe(g2)
+        expect(g2.findOne('g')).toBe(g4)
+        expect(g1.findOne('#foo')).toBe(g2)
+        expect(g2.findOne('#foo')).toBe(null)
+        expect(g1.findOne('.bar')).toBe(g3)
+      })
+    })
+  })
+})
diff --git a/spec/spec/modules/optional/arrange.js b/spec/spec/modules/optional/arrange.js
new file mode 100644
index 0000000..de1a4a0
--- /dev/null
+++ b/spec/spec/modules/optional/arrange.js
@@ -0,0 +1,235 @@
+/* globals describe, expect, it */
+
+import { G, Line } from '../../../../src/main.js'
+
+describe('arrange.js', () => {
+  describe('Dom', () => {
+    describe('siblings()', () => {
+      it('returns all siblings including the node itself', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+        const circle = g.circle(100)
+        const line = g.line(1, 2, 3, 4)
+
+        expect(circle.siblings()).toEqual([ rect, circle, line ])
+      })
+    })
+
+    describe('position()', () => {
+      it('returns the position in the parent', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+        const circle = g.circle(100)
+        const line = g.line(1, 2, 3, 4)
+
+        expect(rect.position()).toBe(0)
+        expect(circle.position()).toBe(1)
+        expect(line.position()).toBe(2)
+      })
+    })
+
+    describe('next()', () => {
+      it('returns the next sibling', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+        const circle = g.circle(100)
+
+        expect(rect.next()).toBe(circle)
+      })
+
+      it('returns undefined if there is no sibling', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+
+        expect(rect.next()).toBe(undefined)
+      })
+    })
+
+    describe('prev()', () => {
+      it('returns the next sibling', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+        const circle = g.circle(100)
+
+        expect(circle.prev()).toBe(rect)
+      })
+
+      it('returns undefined if there is no sibling', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+
+        expect(rect.prev()).toBe(undefined)
+      })
+    })
+
+    describe('forward()', () => {
+      it('returns itself', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+        expect(rect.forward()).toBe(rect)
+      })
+
+      it('moves an element one step forward', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+        const circle = g.circle(100)
+        const line = g.line(1, 2, 3, 4)
+
+        rect.forward()
+
+        expect(g.children()).toEqual([ circle, rect, line ])
+      })
+
+      it('does nothing when the element is already the last one', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+        const circle = g.circle(100)
+        const line = g.line(1, 2, 3, 4)
+
+        line.forward()
+
+        expect(g.children()).toEqual([ rect, circle, line ])
+      })
+    })
+
+    describe('backward()', () => {
+      it('returns itself', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+        expect(rect.backward()).toBe(rect)
+      })
+
+      it('moves an element one step backward', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+        const circle = g.circle(100)
+        const line = g.line(1, 2, 3, 4)
+
+        line.backward()
+
+        expect(g.children()).toEqual([ rect, line, circle ])
+      })
+
+      it('does nothing when the element is already the first one', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+        const circle = g.circle(100)
+        const line = g.line(1, 2, 3, 4)
+
+        rect.backward()
+
+        expect(g.children()).toEqual([ rect, circle, line ])
+      })
+    })
+
+    describe('front()', () => {
+      it('returns itself', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+        expect(rect.front()).toBe(rect)
+      })
+
+      it('moves an element to the front', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+        const circle = g.circle(100)
+        const line = g.line(1, 2, 3, 4)
+
+        rect.front()
+
+        expect(g.children()).toEqual([ circle, line, rect ])
+      })
+
+      it('does nothing when the element is already the last one', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+        const circle = g.circle(100)
+        const line = g.line(1, 2, 3, 4)
+
+        line.front()
+
+        expect(g.children()).toEqual([ rect, circle, line ])
+      })
+    })
+
+    describe('back()', () => {
+      it('returns itself', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+        expect(rect.back()).toBe(rect)
+      })
+
+      it('moves an element to the back', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+        const circle = g.circle(100)
+        const line = g.line(1, 2, 3, 4)
+
+        line.back()
+
+        expect(g.children()).toEqual([ line, rect, circle ])
+      })
+
+      it('does nothing when the element is already the first one', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+        const circle = g.circle(100)
+        const line = g.line(1, 2, 3, 4)
+
+        rect.back()
+
+        expect(g.children()).toEqual([ rect, circle, line ])
+      })
+    })
+
+    describe('before()', () => {
+      it('inserts an element before this one', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+        const circle = g.circle(100)
+
+        const line = new Line()
+        circle.before(line)
+
+        expect(g.children()).toEqual([ rect, line, circle ])
+      })
+    })
+
+    describe('after()', () => {
+      it('inserts an element after this one', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+        const circle = g.circle(100)
+
+        const line = new Line()
+        rect.after(line)
+
+        expect(g.children()).toEqual([ rect, line, circle ])
+      })
+    })
+
+    describe('insertBefore()', () => {
+      it('inserts the current element before another one', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+        const circle = g.circle(100)
+
+        const line = new Line().insertBefore(circle)
+
+        expect(g.children()).toEqual([ rect, line, circle ])
+      })
+    })
+
+    describe('insertAfter()', () => {
+      it('inserts the current element after another one', () => {
+        const g = new G()
+        const rect = g.rect(100, 100)
+        const circle = g.circle(100)
+
+        const line = new Line().insertAfter(rect)
+
+        expect(g.children()).toEqual([ rect, line, circle ])
+      })
+    })
+  })
+})
diff --git a/src/modules/optional/arrange.js b/src/modules/optional/arrange.js
index 7c9d994..7db4386 100644
--- a/src/modules/optional/arrange.js
+++ b/src/modules/optional/arrange.js
@@ -53,21 +53,17 @@ export function front () {
   var p = this.parent()
 
   // Move node forward
-  p.node.appendChild(this.node)
-
-  // Make sure defs node is always at the top
-  if (typeof p.isRoot === 'function' && p.isRoot()) {
-    p.node.appendChild(p.defs().node)
-  }
+  p.add(this.remove())
 
   return this
 }
 
 // Send given element all the way to the back
 export function back () {
-  if (this.position() > 0) {
-    this.parent().removeElement(this).add(this, 0)
-  }
+  var p = this.parent()
+
+  // Move node back
+  p.add(this.remove(), 0)
 
   return this
 }