chore: Added unit tests around drawBackgroundRect and drawRect

This commit is contained in:
Alexander Sage 2019-07-23 19:15:54 -07:00
parent 1b001cf1e8
commit 8b05eeaa59
4 changed files with 77 additions and 77 deletions

8
__mocks__/d3.js vendored
View File

@ -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 __name () { return name },
get __parent () { return parent }
get __children () { return children },
get __name () { return name },
get __parent () { return parent }
}
elem.append = (name) => {
const mockElem = MockD3(name, elem)

View File

@ -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:

View File

@ -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.

View File

@ -1,75 +1,76 @@
/* eslint-env jasmine */
const svgDraw = require('./svgDraw')
const { MockD3 } = require('d3')
console.log(MockD3)
describe('svgDraw', function () {
describe('drawRect', function () {
it('it should append a rectangle', function () {
const svg = MockD3('svg')
svgDraw.drawRect(svg, {
x: 10,
y: 10,
fill: '#ccc',
stroke: 'red',
width: '20',
height: '20',
rx: '10',
ry: '10',
class: 'unitTestRectangleClass',
})
expect(svg.__children.length).toBe(1)
const rect = svg.__children[0]
expect(rect.__name).toBe('rect')
expect(rect.attr).toHaveBeenCalledWith('x', 10)
expect(rect.attr).toHaveBeenCalledWith('y', 10)
expect(rect.attr).toHaveBeenCalledWith('fill', '#ccc')
expect(rect.attr).toHaveBeenCalledWith('stroke', 'red')
expect(rect.attr).toHaveBeenCalledWith('width', '20')
expect(rect.attr).toHaveBeenCalledWith('height', '20')
expect(rect.attr).toHaveBeenCalledWith('rx', '10')
expect(rect.attr).toHaveBeenCalledWith('ry', '10')
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('drawRect', function () {
it('it should append a rectangle', function () {
const svg = MockD3('svg')
svgDraw.drawRect(svg, {
x: 10,
y: 10,
fill: '#ccc',
stroke: 'red',
width: '20',
height: '20',
rx: '10',
ry: '10',
class: 'unitTestRectangleClass'
})
expect(svg.__children.length).toBe(1)
const rect = svg.__children[0]
expect(rect.__name).toBe('rect')
expect(rect.attr).toHaveBeenCalledWith('x', 10)
expect(rect.attr).toHaveBeenCalledWith('y', 10)
expect(rect.attr).toHaveBeenCalledWith('fill', '#ccc')
expect(rect.attr).toHaveBeenCalledWith('stroke', 'red')
expect(rect.attr).toHaveBeenCalledWith('width', '20')
expect(rect.attr).toHaveBeenCalledWith('height', '20')
expect(rect.attr).toHaveBeenCalledWith('rx', '10')
expect(rect.attr).toHaveBeenCalledWith('ry', '10')
expect(rect.attr).toHaveBeenCalledWith('class', 'unitTestRectangleClass')
})
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()
})
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 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()
})
})
})