chore: Added unit tests around drawBackgroundRect and drawRect

__mocks__/d3.js

@@ -1,4 +1,4 @@
-
+/* eslint-env jest */
 let NewD3 = function () {
   return {
     append: function () {
@@ -41,9 +41,9 @@ export const curveCardinal = 'cardinal'
 export const MockD3 = (name, parent) => {
   const children = []
   const elem = {
-      get __children () { return children },
+    get __children () { return children },
-      get __name () { return name },
+    get __name () { return name },
-      get __parent () { return parent }
+    get __parent () { return parent }
   }
   elem.append = (name) => {
     const mockElem = MockD3(name, elem)

src/diagrams/sequence/sequenceRenderer.js

@@ -417,7 +417,7 @@ export const draw = function (text, id) {
         break
       case parser.yy.LINETYPE.RECT_END:
         const rectData = bounds.endLoop()
-        svgDraw.drawBackgroundRect(diagram, rectData);
+        svgDraw.drawBackgroundRect(diagram, rectData)
         bounds.bumpVerticalPos(conf.boxMargin)
         break
       case parser.yy.LINETYPE.OPT_START:

src/diagrams/sequence/svgDraw.js

@@ -168,7 +168,6 @@ export const drawLoop = function (elem, bounds, labelText, conf) {
   }
 }
 
-
 /**
  * Draws a background rectangle
  * @param color - The fill color for the background
@@ -181,8 +180,8 @@ export const drawBackgroundRect = function (elem, bounds) {
     height: bounds.stopy - bounds.starty,
     fill: bounds.fill,
     class: 'rect'
-  });
+  })
-  rectElem.lower();
+  rectElem.lower()
 }
 /**
  * Setup arrow head and define the marker. The result is appended to the svg.

src/diagrams/sequence/svgDraw.spec.js

@@ -1,75 +1,76 @@
+/* eslint-env jasmine */
 const svgDraw = require('./svgDraw')
 const { MockD3 } = require('d3')
-console.log(MockD3)
+
 describe('svgDraw', function () {
-    describe('drawRect', function () {
+  describe('drawRect', function () {
-        it('it should append a rectangle', function () {
+    it('it should append a rectangle', function () {
-            const svg = MockD3('svg')
+      const svg = MockD3('svg')
-            svgDraw.drawRect(svg, {
+      svgDraw.drawRect(svg, {
-                x: 10,
+        x: 10,
-                y: 10,
+        y: 10,
-                fill: '#ccc',
+        fill: '#ccc',
-                stroke: 'red',
+        stroke: 'red',
-                width: '20',
+        width: '20',
-                height: '20',
+        height: '20',
-                rx: '10',
+        rx: '10',
-                ry: '10',
+        ry: '10',
-                class: 'unitTestRectangleClass',
+        class: 'unitTestRectangleClass'
-            })
+      })
-            expect(svg.__children.length).toBe(1)
+      expect(svg.__children.length).toBe(1)
-            const rect = svg.__children[0]
+      const rect = svg.__children[0]
-            expect(rect.__name).toBe('rect')
+      expect(rect.__name).toBe('rect')
-            expect(rect.attr).toHaveBeenCalledWith('x', 10)
+      expect(rect.attr).toHaveBeenCalledWith('x', 10)
-            expect(rect.attr).toHaveBeenCalledWith('y', 10)
+      expect(rect.attr).toHaveBeenCalledWith('y', 10)
-            expect(rect.attr).toHaveBeenCalledWith('fill', '#ccc')
+      expect(rect.attr).toHaveBeenCalledWith('fill', '#ccc')
-            expect(rect.attr).toHaveBeenCalledWith('stroke', 'red')
+      expect(rect.attr).toHaveBeenCalledWith('stroke', 'red')
-            expect(rect.attr).toHaveBeenCalledWith('width', '20')
+      expect(rect.attr).toHaveBeenCalledWith('width', '20')
-            expect(rect.attr).toHaveBeenCalledWith('height', '20')
+      expect(rect.attr).toHaveBeenCalledWith('height', '20')
-            expect(rect.attr).toHaveBeenCalledWith('rx', '10')
+      expect(rect.attr).toHaveBeenCalledWith('rx', '10')
-            expect(rect.attr).toHaveBeenCalledWith('ry', '10')
+      expect(rect.attr).toHaveBeenCalledWith('ry', '10')
-            expect(rect.attr).toHaveBeenCalledWith('class', 'unitTestRectangleClass')
+      expect(rect.attr).toHaveBeenCalledWith('class', 'unitTestRectangleClass')
-        })
-        it('it should not add the class attribute if a class isn`t provided', () => {
-            const svg = MockD3('svg')
-            svgDraw.drawRect(svg, {
-                x: 10,
-                y: 10,
-                fill: '#ccc',
-                stroke: 'red',
-                width: '20',
-                height: '20',
-                rx: '10',
-                ry: '10',
-            })
-            expect(svg.__children.length).toBe(1)
-            const rect = svg.__children[0]
-            expect(rect.__name).toBe('rect')
-            expect(rect.attr).toHaveBeenCalledWith('fill', '#ccc')
-            expect(rect.attr).not.toHaveBeenCalledWith('class', expect.anything())
-        })
     })
-    describe('drawBackgroundRect', function () {
+    it('it should not add the class attribute if a class isn`t provided', () => {
-        it('it should append a rect before the previous element within a given bound', function () {
+      const svg = MockD3('svg')
-            const svg = MockD3('svg')
+      svgDraw.drawRect(svg, {
-            const boundingRect = {
+        x: 10,
-                startx: 50,
+        y: 10,
-                starty: 200,
+        fill: '#ccc',
-                stopx: 150,
+        stroke: 'red',
-                stopy: 260,
+        width: '20',
-                title: undefined,
+        height: '20',
-                fill: '#ccc',
+        rx: '10',
-            }
+        ry: '10'
-            svgDraw.drawBackgroundRect(svg, boundingRect)
+      })
-            expect(svg.__children.length).toBe(1)
+      expect(svg.__children.length).toBe(1)
-            const rect = svg.__children[0]
+      const rect = svg.__children[0]
-            expect(rect.__name).toBe('rect')
+      expect(rect.__name).toBe('rect')
-            expect(rect.attr).toHaveBeenCalledWith('x', 50)
+      expect(rect.attr).toHaveBeenCalledWith('fill', '#ccc')
-            expect(rect.attr).toHaveBeenCalledWith('y', 200)
+      expect(rect.attr).not.toHaveBeenCalledWith('class', expect.anything())
-            expect(rect.attr).toHaveBeenCalledWith('width', 100)
-            expect(rect.attr).toHaveBeenCalledWith('height', 60)
-            expect(rect.attr).toHaveBeenCalledWith('fill', '#ccc')
-            expect(rect.attr).toHaveBeenCalledWith('class', 'rect')
-            expect(rect.lower).toHaveBeenCalled()
-        })
     })
+  })
+  describe('drawBackgroundRect', function () {
+    it('it should append a rect before the previous element within a given bound', function () {
+      const svg = MockD3('svg')
+      const boundingRect = {
+        startx: 50,
+        starty: 200,
+        stopx: 150,
+        stopy: 260,
+        title: undefined,
+        fill: '#ccc'
+      }
+      svgDraw.drawBackgroundRect(svg, boundingRect)
+      expect(svg.__children.length).toBe(1)
+      const rect = svg.__children[0]
+      expect(rect.__name).toBe('rect')
+      expect(rect.attr).toHaveBeenCalledWith('x', 50)
+      expect(rect.attr).toHaveBeenCalledWith('y', 200)
+      expect(rect.attr).toHaveBeenCalledWith('width', 100)
+      expect(rect.attr).toHaveBeenCalledWith('height', 60)
+      expect(rect.attr).toHaveBeenCalledWith('fill', '#ccc')
+      expect(rect.attr).toHaveBeenCalledWith('class', 'rect')
+      expect(rect.lower).toHaveBeenCalled()
+    })
+  })
 })