@js-draw/math 1.16.0 → 1.18.0

package/src/shapes/Path.test.ts

@@ -1,7 +1,7 @@
 import LineSegment2 from './LineSegment2';
-import Path, { PathCommandType } from './Path';
+import Path, { CurveIndexRecord, PathCommandType } from './Path';
 import Rect2 from './Rect2';
-import { Vec2 } from '../Vec2';
+import { Point2, Vec2 } from '../Vec2';
 import CubicBezier from './CubicBezier';
 import QuadraticBezier from './QuadraticBezier';
 
@@ -60,6 +60,24 @@ describe('Path', () => {
 		);
 	});
 
+	it.each([
+		[ 'm0,0 L1,1', 'M0,0 L1,1', true ],
+		[ 'm0,0 L1,1', 'M1,1 L0,0', false ],
+		[ 'm0,0 L1,1 Q2,3 4,5', 'M1,1 L0,0', false ],
+		[ 'm0,0 L1,1 Q2,3 4,5', 'M1,1 L0,0 Q2,3 4,5', false ],
+		[ 'm0,0 L1,1 Q2,3 4,5', 'M0,0 L1,1 Q2,3 4,5', true ],
+		[ 'm0,0 L1,1 Q2,3 4,5 C4,5 6,7 8,9', 'M0,0 L1,1 Q2,3 4,5 C4,5 6,7 8,9', true ],
+		[ 'm0,0 L1,1 Q2,3 4,5 C4,5 6,7 8,9Z', 'M0,0 L1,1 Q2,3 4,5 C4,5 6,7 8,9', false ],
+		[ 'm0,0 L1,1 Q2,3 4,5 C4,5 6,7 8,9', 'M0,0 L1,1 Q2,3 4,5 C4,5 6,7 8,9Z', false ],
+		[ 'm0,0 L1,1 Q2,3 4,5 C4,5 6,7 8,9', 'M0,0 L1,1 Q2,3 4,5 C4,5 6,7 8,9.01', false ],
+		[ 'm0,0 L1,1 Q2,3 4,5 C4,5 6,7 8,9', 'M0,0 L1,1 Q2,3 4,5 C4,5 6,7.01 8,9', false ],
+		[ 'm0,0 L1,1 Q2,3 4,5 C4,5 6,7 8,9', 'M0,0 L1,1 Q2,3 4,5 C4,5.01 6,7 8,9', false ],
+	])('.eq should check equality', (path1Str, path2Str, shouldEqual) => {
+		expect(Path.fromString(path1Str)).objEq(Path.fromString(path1Str));
+		expect(Path.fromString(path2Str)).objEq(Path.fromString(path2Str));
+		expect(Path.fromString(path1Str).eq(Path.fromString(path2Str))).toBe(shouldEqual);
+	});
+
 	describe('intersection', () => {
 		it('should give all intersections for a path made up of lines', () => {
 			const lineStart = Vec2.of(100, 100);
@@ -179,7 +197,7 @@ describe('Path', () => {
 			});
 		});
 
-		it('should give all intersections for a Bézier stroked path', () => {
+		it('should correctly report intersections for a simple Bézier curve path', () => {
 			const lineStart = Vec2.zero;
 			const path = new Path(lineStart, [
 				{
@@ -196,13 +214,45 @@ describe('Path', () => {
 			let intersections = path.intersection(
 				new LineSegment2(Vec2.of(-1, 0.5), Vec2.of(2, 0.5)), strokeWidth,
 			);
-			expect(intersections.length).toBe(0);
+			expect(intersections).toHaveLength(0);
 
 			// Should be an intersection when exiting/entering the edge of the stroke
 			intersections = path.intersection(
 				new LineSegment2(Vec2.of(0, 0.5), Vec2.of(8, 0.5)), strokeWidth,
 			);
-			expect(intersections.length).toBe(1);
+			expect(intersections).toHaveLength(1);
+		});
+
+		it('should correctly report intersections near the cap of a line-like Bézier', () => {
+			const path = Path.fromString('M0,0Q14,0 27,0');
+			expect(
+				path.intersection(
+					new LineSegment2(Vec2.of(0, -100), Vec2.of(0, 100)),
+					10,
+				),
+
+				// Should have intersections, despite being at the cap of the Bézier
+				// curve.
+			).toHaveLength(2);
+		});
+
+		it.each([
+			[new LineSegment2(Vec2.of(43.5,-12.5), Vec2.of(40.5,24.5)), 0],
+			[new LineSegment2(Vec2.of(35.5,19.5), Vec2.of(38.5,-17.5)), 0],
+		])('should correctly report positive intersections with a line-like Bézier', (line, strokeRadius) => {
+			const bezier = Path.fromString('M0,0 Q50,0 100,0');
+			expect(bezier.intersection(line, strokeRadius).length).toBeGreaterThan(0);
+		});
+
+		it('should handle near-vertical lines', () => {
+			const intersections = Path.fromString('M0,0 Q50,0 100,0').intersection(new LineSegment2(Vec2.of(44, -12), Vec2.of(39, 25)));
+			expect(intersections).toHaveLength(1);
+		});
+
+		it('should handle single-point strokes', () => {
+			const stroke = new Path(Vec2.zero, []);
+			expect(stroke.intersection(new LineSegment2(Vec2.of(-2, -20), Vec2.of(-2, -1)), 1)).toHaveLength(0);
+			expect(stroke.intersection(new LineSegment2(Vec2.of(-2, -2), Vec2.of(2, 2)), 1)).toHaveLength(2);
 		});
 	});
 
@@ -306,4 +356,182 @@ describe('Path', () => {
 			expect(strokedRect.startPoint).objEq(lastSegment.point);
 		});
 	});
+
+	describe('splitAt', () => {
+		it.each([
+			2, 3, 4, 5,
+		])('should split a line into %d sections', (numSections) => {
+			const path = Path.fromString('m0,0 l1,0');
+
+			const splitIndices: CurveIndexRecord[] = [];
+			for (let i = 0; i < numSections; i++) {
+				splitIndices.push({ curveIndex: 0, parameterValue: (i + 1) / (numSections + 1) });
+			}
+			const split = path.splitAt(splitIndices);
+
+			expect(split).toHaveLength(numSections + 1);
+			expect(split[numSections].getEndPoint()).objEq(Vec2.unitX);
+			for (let i = 0; i < numSections; i ++) {
+				expect(split[i].geometry).toHaveLength(1);
+				const geom = split[i].geometry[0] as LineSegment2;
+				expect(geom.p1.y).toBeCloseTo(0);
+				expect(geom.p1.x).toBeCloseTo(i / (numSections + 1));
+				expect(geom.p2.y).toBeCloseTo(0);
+				expect(geom.p2.x).toBeCloseTo((i + 1) / (numSections + 1));
+			}
+		});
+
+		it('should handle the case where the first division is at the beginning of the path', () => {
+			const path = Path.fromString('m0,0 l1,0');
+			const beginningSplit = path.splitAt({ curveIndex: 0, parameterValue: 0 });
+			expect(beginningSplit).toHaveLength(1);
+
+			const endSplit = path.splitAt({ curveIndex: 0, parameterValue: 1 });
+			expect(endSplit).toHaveLength(1);
+
+			expect(beginningSplit[0]).objEq(path);
+			expect(beginningSplit[0]).objEq(endSplit[0]);
+		});
+	});
+
+	describe('splitNear', () => {
+		it('should divide a line in half', () => {
+			const path = Path.fromString('m0,0l8,0');
+			const split = path.splitNear(Vec2.of(4, 0));
+			expect(split).toHaveLength(2);
+			expect(split[0].toString()).toBe('M0,0L4,0');
+			expect(split[1]!.toString()).toBe('M4,0L8,0');
+		});
+
+		it('should divide a polyline into parts', () => {
+			const path = Path.fromString('m0,0L8,0L8,8');
+			const split = path.splitNear(Vec2.of(8, 4));
+			expect(split).toHaveLength(2);
+			expect(split[0].toString()).toBe('M0,0L8,0L8,4');
+			expect(split[1]!.toString()).toBe('M8,4L8,8');
+		});
+
+		it('should divide a quadratic Bézier in half', () => {
+			const path = Path.fromString('m0,0 Q4,0 8,0');
+			const split = path.splitNear(Vec2.of(4, 0));
+			expect(split).toHaveLength(2);
+			expect(split[0].toString()).toBe('M0,0Q2,0 4,0');
+			expect(split[1]!.toString()).toBe('M4,0Q6,0 8,0');
+		});
+
+		it('should divide two quadratic Béziers half', () => {
+			const path = Path.fromString('m0,0 Q4,0 8,0 Q8,4 8,8');
+			const split = path.splitNear(Vec2.of(8, 4));
+			expect(split).toHaveLength(2);
+			expect(split[0].toString()).toBe('M0,0Q4,0 8,0Q8,2 8,4');
+			expect(split[1]!.toString()).toBe('M8,4Q8,6 8,8');
+		});
+
+		it.each([
+			{
+				original: 'm0,0 Q4,0 8,0 Q8,4 8,8',
+				near: Vec2.of(8, 4),
+				map: (p: Point2) => p.plus(Vec2.of(1, 1)),
+				expected: [ 'M0,0Q4,0 8,0Q9,3 9,5', 'M9,5Q9,7 9,9' ],
+			},
+			{
+				original: 'm0,0 L0,10',
+				near: Vec2.of(0, 5),
+				map: (p: Point2) => p.plus(Vec2.of(100, 0)),
+				expected: [ 'M0,0L100,5', 'M100,5L0,10' ],
+			},
+			{
+				// Tested using SVG data similar to:
+				//   <path d="m1,1 C1,2 2,10 4,4 C5,0 9,3 7,7" fill="none" stroke="#ff0000"/>
+				//   <path d="M2,6C3,6 3,6 4,4C5,0 9,3 7,7" fill="none" stroke="#00ff0080"/>
+				// Because of the rounding, the fit path should be slightly off.
+				original: 'm1,1 C1,2 2,10 4,4 C5,0 9,3 7,7',
+				near: Vec2.of(3, 5),
+				map: (p: Point2) => Vec2.of(Math.round(p.x), Math.round(p.y)),
+				expected: [ 'M1,1C1,2 1,6 2,6', 'M2,6C3,6 3,6 4,4C5,0 9,3 7,7' ],
+			},
+		])('should support mapping newly-added points while splitting (case %j)', ({ original, near, map, expected }) => {
+			const path = Path.fromString(original);
+			const split = path.splitNear(near, { mapNewPoint: map });
+			expect(split.map(p => p.toString(false))).toMatchObject(expected);
+		});
+	});
+
+	describe('spliced', () => {
+		it.each([
+			// should support insertion splicing
+			{
+				curve: 'm0,0 l2,0',
+				from: { i: 0, t: 0.5 },
+				to: { i: 0, t: 0.5 },
+				insert: 'm1,0 l0,10 z',
+				expected: 'M0,0 L1,0 L1,10 L1,0 L2,0',
+			},
+
+			// should support removing a segment when splicing
+			{
+				curve: 'm0,0 l4,0',
+				from: { i: 0, t: 0.25 },
+				to: { i: 0, t: 0.75 },
+				insert: 'M1,0 L1,1 L3,1 L3,0',
+				expected: 'M0,0 L1,0 L1,1 L3,1 L3,0 L4,0',
+			},
+
+			// should support reverse splicing and reverse `insert` as necessary
+			{
+				curve: 'M0,0 l4,0',
+				from: { i: 0, t: 0.75 },
+				to: { i: 0, t: 0.25 },
+				insert: 'M1,0 L1,1 L3,1 L3,0',
+				expected: 'M1,0 L3,0 L3,1 L1,1 L1,0',
+			},
+		])('.spliced should support inserting paths inbetween other paths (case %#)', ({ curve, from, to, insert, expected }) => {
+			const originalCurve = Path.fromString(curve);
+			expect(
+				originalCurve.spliced(
+					{ curveIndex: from.i, parameterValue: from.t },
+					{ curveIndex: to.i, parameterValue: to.t },
+					Path.fromString(insert),
+				)
+			).objEq(Path.fromString(expected));
+		});
+	});
+
+	it.each([
+		[ 'm0,0 L1,1', 'M1,1 L0,0' ],
+		[ 'm0,0 L1,1', 'M1,1 L0,0' ],
+		[ 'M0,0 L1,1 Q2,2 3,3', 'M3,3 Q2,2 1,1 L0,0' ],
+		[ 'M0,0 L1,1 Q4,2 5,3 C12,13 10,9 8,7', 'M8,7 C 10,9 12,13 5,3 Q 4,2 1,1 L 0,0' ],
+	])('.reversed should reverse paths', (original, expected) => {
+		expect(Path.fromString(original).reversed()).objEq(Path.fromString(expected));
+		expect(Path.fromString(expected).reversed()).objEq(Path.fromString(original));
+		expect(Path.fromString(original).reversed().reversed()).objEq(Path.fromString(original));
+	});
+
+	it.each([
+		[ 'm0,0 l1,0', Vec2.of(0, 0), Vec2.of(0, 0) ],
+		[ 'm0,0 l1,0', Vec2.of(0.5, 0), Vec2.of(0.5, 0) ],
+		[ 'm0,0 Q1,0 1,2', Vec2.of(1, 0), Vec2.of(0.6236, 0.299) ],
+	])('.nearestPointTo should return the closest point on a path to the given parameter (case %#)', (path, point, expectedClosest) => {
+		expect(Path.fromString(path).nearestPointTo(point).point).objEq(expectedClosest, 0.002);
+	});
+
+	it.each([
+		// Polyline
+		[ 'm0,0 l1,0 l0,1', [ 0, 0.5 ], Vec2.of(1, 0) ],
+		[ 'm0,0 l1,0 l0,1', [ 0, 0.99 ], Vec2.of(1, 0) ],
+		[ 'm0,0 l1,0 l0,1', [ 1, 0 ], Vec2.of(0, 1) ],
+		[ 'm0,0 l1,0 l0,1', [ 1, 0.5 ], Vec2.of(0, 1) ],
+		[ 'm0,0 l1,0 l0,1', [ 1, 1 ], Vec2.of(0, 1) ],
+
+		// Shape with quadratic Bézier curves
+		[ 'M0,0 Q1,0 0,1', [ 0, 0 ], Vec2.of(1, 0) ],
+		[ 'M0,0 Q1,1 0,1', [ 0, 1 ], Vec2.of(-1, 0) ],
+		[ 'M0,0 Q1,0 1,1 Q0,1 0,2', [ 0, 1 ], Vec2.of(0, 1) ],
+		[ 'M0,0 Q1,0 1,1 Q0,1 0,2', [ 1, 1 ], Vec2.of(0, 1) ],
+	])('.tangentAt should point in the direction of increasing parameter values, for curve %s at %j', (pathString, evalAt, expected) => {
+		const at: CurveIndexRecord = { curveIndex: evalAt[0], parameterValue: evalAt[1] };
+		const path = Path.fromString(pathString);
+		expect(path.tangentAt(at)).objEq(expected);
+	});
 });