dom: make SafeTriangle smaller, add tests

src/vs/base/browser/dom.ts

@@ -2521,43 +2521,37 @@ export function trackAttributes(from: Element, to: Element, filter?: string[]):
  * @see https://www.smashingmagazine.com/2023/08/better-context-menus-safe-triangles/ for example
  */
 export class SafeTriangle {
-	// 4 triangles, 2 points (x, y) stored for each
-	private triangles: number[] = [];
+	// 4 points (x, y), 8 length
+	private points = new Int16Array(8);
 
 	constructor(
 		private readonly originX: number,
 		private readonly originY: number,
 		target: HTMLElement
 	) {
 		const { top, left, right, bottom } = target.getBoundingClientRect();
-		const t = this.triangles;
+		const t = this.points;
 		let i = 0;
 
 		t[i++] = left;
 		t[i++] = top;
-		t[i++] = right;
-		t[i++] = top;
-
-		t[i++] = left;
-		t[i++] = top;
-		t[i++] = left;
-		t[i++] = bottom;
 
 		t[i++] = right;
 		t[i++] = top;
-		t[i++] = right;
-		t[i++] = bottom;
 
 		t[i++] = left;
 		t[i++] = bottom;
+
 		t[i++] = right;
 		t[i++] = bottom;
 	}
 
 	public contains(x: number, y: number) {
-		const { triangles, originX, originY } = this;
+		const { points, originX, originY } = this;
 		for (let i = 0; i < 4; i++) {
-			if (isPointWithinTriangle(x, y, originX, originY, triangles[2 * i], triangles[2 * i + 1], triangles[2 * i + 2], triangles[2 * i + 3])) {
+			const p1 = 2 * i;
+			const p2 = 2 * ((i + 1) % 4);
+			if (isPointWithinTriangle(x, y, originX, originY, points[p1], points[p1 + 1], points[p2], points[p2 + 1])) {
 				return true;
 			}
 		}

src/vs/base/test/browser/dom.test.ts

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 
 import assert from 'assert';
-import { $, asCssValueWithDefault, h, multibyteAwareBtoa, trackAttributes, copyAttributes, disposableWindowInterval, getWindows, getWindowsCount, getWindowId, getWindowById, hasWindow, getWindow, getDocument, isHTMLElement } from 'vs/base/browser/dom';
+import { $, asCssValueWithDefault, h, multibyteAwareBtoa, trackAttributes, copyAttributes, disposableWindowInterval, getWindows, getWindowsCount, getWindowId, getWindowById, hasWindow, getWindow, getDocument, isHTMLElement, SafeTriangle } from 'vs/base/browser/dom';
 import { ensureCodeWindow, isAuxiliaryWindow, mainWindow } from 'vs/base/browser/window';
 import { DeferredPromise, timeout } from 'vs/base/common/async';
 import { runWithFakedTimers } from 'vs/base/test/common/timeTravelScheduler';
@@ -407,5 +407,38 @@ suite('dom', () => {
 		});
 	});
 
+	suite('SafeTriangle', () => {
+		const fakeElement = (left: number, right: number, top: number, bottom: number): HTMLElement => {
+			return { getBoundingClientRect: () => ({ left, right, top, bottom }) } as any;
+		};
+
+		test('works', () => {
+			const safeTriangle = new SafeTriangle(0, 0, fakeElement(10, 20, 10, 20));
+
+			assert.strictEqual(safeTriangle.contains(5, 5), true); // in triangle region
+			assert.strictEqual(safeTriangle.contains(15, 5), false);
+			assert.strictEqual(safeTriangle.contains(25, 5), false);
+
+			assert.strictEqual(safeTriangle.contains(5, 15), false);
+			assert.strictEqual(safeTriangle.contains(15, 15), true);
+			assert.strictEqual(safeTriangle.contains(25, 15), false);
+
+			assert.strictEqual(safeTriangle.contains(5, 25), false);
+			assert.strictEqual(safeTriangle.contains(15, 25), false);
+			assert.strictEqual(safeTriangle.contains(25, 25), false);
+		});
+
+		test('other dirations', () => {
+			const a = new SafeTriangle(30, 30, fakeElement(10, 20, 10, 20));
+			assert.strictEqual(a.contains(25, 25), true);
+
+			const b = new SafeTriangle(0, 30, fakeElement(10, 20, 10, 20));
+			assert.strictEqual(b.contains(5, 25), true);
+
+			const c = new SafeTriangle(30, 0, fakeElement(10, 20, 10, 20));
+			assert.strictEqual(c.contains(25, 5), true);
+		});
+	});
+
 	ensureNoDisposablesAreLeakedInTestSuite();
 });