diff --git a/src/components/canvas/connections/BlockConnection.ts b/src/components/canvas/connections/BlockConnection.ts index 581d6f7b..7390ee05 100644 --- a/src/components/canvas/connections/BlockConnection.ts +++ b/src/components/canvas/connections/BlockConnection.ts @@ -33,7 +33,7 @@ export class BlockConnection { public readonly cursor = "pointer"; - protected path2d: Path2D; + protected path2d: Path2D = new Path2D(); protected labelGeometry: { x: number; y: number; width: number; height: number } | undefined = undefined; @@ -238,6 +238,7 @@ export class BlockConnection this.geometry.x2 = this.connectionPoints[1].x; this.geometry.y2 = this.connectionPoints[1].y; + this.generatePath(); this.applyShape(); } diff --git a/src/components/canvas/connections/bezierHelpers.test.ts b/src/components/canvas/connections/bezierHelpers.test.ts new file mode 100644 index 00000000..a65dfc73 --- /dev/null +++ b/src/components/canvas/connections/bezierHelpers.test.ts @@ -0,0 +1,29 @@ +import { isPointInStroke } from "./bezierHelpers"; + +describe("isPointInStroke", () => { + it("returns false when path is undefined", () => { + const ctx = document.createElement("canvas").getContext("2d"); + + expect(isPointInStroke(ctx, undefined, 0, 0)).toBe(false); + }); + + it("returns false when path is not a Path2D instance", () => { + const ctx = document.createElement("canvas").getContext("2d"); + + expect(isPointInStroke(ctx, {} as Path2D, 0, 0)).toBe(false); + }); + + it("returns false when context is missing", () => { + const path = new Path2D(); + + expect(isPointInStroke(null, path, 0, 0)).toBe(false); + }); + + it("does not throw when path is invalid", () => { + const ctx = document.createElement("canvas").getContext("2d"); + + expect(() => isPointInStroke(ctx, undefined, 0, 0)).not.toThrow(); + expect(() => isPointInStroke(ctx, {} as Path2D, 0, 0)).not.toThrow(); + expect(() => isPointInStroke(null, new Path2D(), 0, 0)).not.toThrow(); + }); +}); diff --git a/src/components/canvas/connections/bezierHelpers.ts b/src/components/canvas/connections/bezierHelpers.ts index c0e9ee2f..4aa6014e 100644 --- a/src/components/canvas/connections/bezierHelpers.ts +++ b/src/components/canvas/connections/bezierHelpers.ts @@ -57,7 +57,17 @@ export function getPointOfBezierCurve( /* eslint-enable no-restricted-properties */ } -export function isPointInStroke(ctx: CanvasRenderingContext2D, path: Path2D, x: number, y: number, threshold?: number) { +export function isPointInStroke( + ctx: CanvasRenderingContext2D | undefined | null, + path: Path2D | undefined | null, + x: number, + y: number, + threshold?: number +): boolean { + if (!ctx || !path || !(path instanceof Path2D)) { + return false; + } + const l = ctx.lineWidth; if (threshold) { ctx.lineWidth = threshold;