Fix Rect.setSize() not updating bounds (pointer event regression) (#1373)

* Fix Rect.setSize() not updating bounds (regression from TS conversion)

Rect.setSize() did not call updateBounds(), leaving bounds stale after
position or size changes. This broke pointer event broadphase lookups:
the QuadTree query rect always reported bounds at (0,0) instead of the
actual click position, causing moles at certain positions in the
whack-a-mole example to not respond to clicks.

Root cause: commit 4d185c9 (July 2024) replaced Rect.setShape(x,y,w,h)
with pos.set() + setSize() during the TypeScript conversion, but setSize()
never called updateBounds(). The old setShape() updated everything in one
call. See #817 for the underlying pos type mismatch.

Fix: add updateBounds() call in Rect.setSize().

Tests: add bounds validation tests for Rect.setSize(), pos.set()+setSize(),
Rect.copy(), and RoundRect equivalents.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

* Add recalc() call in Rect.setSize() for edge/normal consistency

setSize() now calls recalc() before updateBounds(), matching the
behavior of the width/height setters. Without this, edges, normals,
and indices were stale after setSize(), which could cause incorrect
SAT/collision results on resized rectangles.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

---------

Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: obiot

packages/melonjs/CHANGELOG.md

@@ -39,6 +39,7 @@
 - **BREAKING**: `Tween` no longer adds itself to `game.world` — uses event-based lifecycle (`TICK`, `GAME_AFTER_UPDATE`, `STATE_PAUSE`, `STATE_RESUME`, `GAME_RESET`) instead. Public API unchanged. `isPersistent` and `updateWhenPaused` properties still supported.
 
 ### Fixed
+- Geometry: `Rect.setSize()` now calls `updateBounds()` — fixes a regression from July 2024 (`4d185c902`) where replacing `Rect.setShape()` with `pos.set()` + `setSize()` during the TypeScript conversion left bounds stale, causing pointer event broadphase lookups to use `(0,0)` instead of the actual pointer position (see #817)
 - WebGL: depth buffer now correctly used for 3D mesh rendering with `gl.LESS` depth function
 - Canvas: backface culling corrected for Y-flipped screen space (was culling front faces instead of back)
 - Canvas: triangle seam expansion (0.5px) to cover anti-aliasing gaps between adjacent triangles

packages/melonjs/src/geometries/rectangle.ts

@@ -38,6 +38,8 @@ export class Rect extends Polygon {
 		this.points[1].set(width, 0); // 1, 0
 		this.points[2].set(width, height); // 1, 1
 		this.points[3].set(0, height); // 0, 1
+		this.recalc();
+		this.updateBounds();
 		return this;
 	}
 

packages/melonjs/tests/rectangle.spec.ts

@@ -241,4 +241,56 @@ describe("Shape : Rect", () => {
 			expect(rect6.isFinite()).toEqual(false);
 		});
 	});
+
+	describe("setSize", () => {
+		it("should update bounds when setSize is called", () => {
+			const rect = new Rect(0, 0, 10, 10);
+			rect.setSize(50, 30);
+			const bounds = rect.getBounds();
+			expect(bounds.width).toEqual(50);
+			expect(bounds.height).toEqual(30);
+		});
+
+		it("should reflect position in bounds after pos.set + setSize", () => {
+			const rect = new Rect(0, 0, 1, 1);
+			rect.pos.set(100, 200);
+			rect.setSize(50, 30);
+			const bounds = rect.getBounds();
+			expect(bounds.x).toEqual(100);
+			expect(bounds.y).toEqual(200);
+			expect(bounds.width).toEqual(50);
+			expect(bounds.height).toEqual(30);
+		});
+
+		it("should update bounds when only setSize is called after construction", () => {
+			const rect = new Rect(500, 300, 1, 1);
+			rect.setSize(20, 15);
+			const bounds = rect.getBounds();
+			expect(bounds.x).toEqual(500);
+			expect(bounds.y).toEqual(300);
+			expect(bounds.width).toEqual(20);
+			expect(bounds.height).toEqual(15);
+		});
+
+		it("should recalculate edges and normals after setSize", () => {
+			const rect = new Rect(0, 0, 10, 10);
+			rect.setSize(50, 30);
+			// edges should reflect the new dimensions
+			expect(rect.edges[0].x).toEqual(50); // top edge
+			expect(rect.edges[1].y).toEqual(30); // right edge
+		});
+	});
+
+	describe("copy", () => {
+		it("should update bounds after copy", () => {
+			const src = new Rect(100, 200, 50, 30);
+			const dst = new Rect(0, 0, 1, 1);
+			dst.copy(src);
+			const bounds = dst.getBounds();
+			expect(bounds.x).toEqual(100);
+			expect(bounds.y).toEqual(200);
+			expect(bounds.width).toEqual(50);
+			expect(bounds.height).toEqual(30);
+		});
+	});
 });

packages/melonjs/tests/roundrect.spec.ts

@@ -367,6 +367,40 @@ describe("Shape : RoundRect", () => {
 		});
 	});
 
+	describe("bounds updates", () => {
+		it("should update bounds after setSize", () => {
+			const rr = new RoundRect(100, 200, 50, 30, 10);
+			rr.setSize(80, 60);
+			const bounds = rr.getBounds();
+			expect(bounds.x).toEqual(100);
+			expect(bounds.y).toEqual(200);
+			expect(bounds.width).toEqual(80);
+			expect(bounds.height).toEqual(60);
+		});
+
+		it("should update bounds after pos.set + setSize", () => {
+			const rr = new RoundRect(0, 0, 1, 1, 0);
+			rr.pos.set(300, 400);
+			rr.setSize(50, 30);
+			const bounds = rr.getBounds();
+			expect(bounds.x).toEqual(300);
+			expect(bounds.y).toEqual(400);
+			expect(bounds.width).toEqual(50);
+			expect(bounds.height).toEqual(30);
+		});
+
+		it("should update bounds after copy", () => {
+			const src = new RoundRect(100, 200, 80, 60, 15);
+			const dst = new RoundRect(0, 0, 1, 1, 0);
+			dst.copy(src);
+			const bounds = dst.getBounds();
+			expect(bounds.x).toEqual(100);
+			expect(bounds.y).toEqual(200);
+			expect(bounds.width).toEqual(80);
+			expect(bounds.height).toEqual(60);
+		});
+	});
+
 	describe("vertex reuse optimization", () => {
 		it("should reuse vertex objects when radius stays > 0 and size changes", () => {
 			const rr = new RoundRect(0, 0, 100, 100, 20);