Adding specs and some refactoring for the Path#lineTo method
This commit is contained in:
parent
381df8bf93
commit
bb37848265
@ -75,7 +75,7 @@ exports[`VerticalLayout rendering with connectors 1`] = `
|
||||
withConnectors={true}
|
||||
>
|
||||
<path
|
||||
d="M10,60q0,-10 10,-10H20M130,60q0,-10 -10,-10H120M0,160c15,0 10,0 20,0H20M140,160c-15,0 -10,0 -20,0H120M10,260q0,10 10,10H20M130,260q0,10 -10,10H120M0,160q10,0 10,-10V60M140,160q-10,0 -10,-10V60M0,160q10,0 10,10V260M140,160q-10,0 -10,10V260"
|
||||
d="M10,60q0,-10 10,-10M130,60q0,-10 -10,-10M0,160c15,0 10,0 20,0M140,160c-15,0 -10,0 -20,0M10,260q0,10 10,10M130,260q0,10 -10,10M0,160q10,0 10,-10V60M140,160q-10,0 -10,-10V60M0,160q10,0 10,10V260M140,160q-10,0 -10,10V260"
|
||||
style={
|
||||
Object {
|
||||
"fillOpacity": 0,
|
||||
|
@ -26,22 +26,37 @@ class Path {
|
||||
}
|
||||
|
||||
lineTo({ x, y, relative }) {
|
||||
relative = relative === undefined ? this.relative : relative;
|
||||
if (x !== undefined && (y === undefined || y === this.currentPosition.y)) {
|
||||
if (relative === undefined) {
|
||||
relative = this.relative;
|
||||
}
|
||||
if (x === undefined) {
|
||||
x = relative ? 0 : this.currentPosition.x;
|
||||
}
|
||||
if (y === undefined) {
|
||||
y = relative ? 0 : this.currentPosition.y;
|
||||
}
|
||||
|
||||
if ((relative && x === 0 && y === 0)
|
||||
|| (!relative && x === this.currentPosition.x && y === this.currentPosition.y)) {
|
||||
return this;
|
||||
}
|
||||
|
||||
if (y === (relative ? 0 : this.currentPosition.y)) {
|
||||
const command = relative ? 'h' : 'H';
|
||||
this.pathParts.push(`${command}${x}`);
|
||||
this.currentPosition.x = relative ? this.currentPosition.x + x : x;
|
||||
} else if (y !== undefined && (x === undefined || x === this.currentPosition.x)) {
|
||||
} else if (x === (relative ? 0 : this.currentPosition.x)) {
|
||||
const command = relative ? 'v' : 'V';
|
||||
this.pathParts.push(`${command}${y}`);
|
||||
this.currentPosition.y = relative ? this.currentPosition.y + y : y;
|
||||
} else {
|
||||
const command = relative ? 'l' : 'L';
|
||||
this.pathParts.push(`${command}${x},${y}`);
|
||||
this.currentPosition.x = relative ? this.currentPosition.x + x : x;
|
||||
this.currentPosition.y = relative ? this.currentPosition.y + y : y;
|
||||
}
|
||||
|
||||
this.currentPosition = {
|
||||
x: relative ? this.currentPosition.x + x : x,
|
||||
y: relative ? this.currentPosition.y + y : y
|
||||
};
|
||||
|
||||
return this;
|
||||
}
|
||||
|
||||
|
27
src/components/SVG/path.test.js
Normal file
27
src/components/SVG/path.test.js
Normal file
@ -0,0 +1,27 @@
|
||||
import Path from './path';
|
||||
|
||||
describe('Path', () => {
|
||||
[
|
||||
// lineTo
|
||||
[ 'lineTo', { x: 5, y: 1 }, 'L5,1' ],
|
||||
[ 'lineTo', { x: 5, y: 0 }, 'H5' ],
|
||||
[ 'lineTo', { x: 0, y: 1 }, 'V1' ],
|
||||
[ 'lineTo', { x: 0, y: 0 }, '' ],
|
||||
[ 'lineTo', { x: 5 }, 'H5' ],
|
||||
[ 'lineTo', { y: 1 }, 'V1' ],
|
||||
[ 'lineTo', {}, '' ],
|
||||
[ 'lineTo', { x: 5, y: 1, relative: true }, 'l5,1' ],
|
||||
[ 'lineTo', { x: 5, y: 0, relative: true }, 'h5' ],
|
||||
[ 'lineTo', { x: 0, y: 1, relative: true }, 'v1' ],
|
||||
[ 'lineTo', { x: 0, y: 0, relative: true }, '' ],
|
||||
[ 'lineTo', { x: 5, relative: true }, 'h5' ],
|
||||
[ 'lineTo', { y: 1, relative: true }, 'v1' ],
|
||||
[ 'lineTo', { relative: true }, '' ],
|
||||
].forEach(([ cmd, args, str ], i) => (
|
||||
test(`case #${ i }`, () => {
|
||||
const path = new Path();
|
||||
path[cmd](args);
|
||||
expect(path.toString()).toEqual(str);
|
||||
})
|
||||
));
|
||||
});
|
Loading…
Reference in New Issue
Block a user