From 7093b9922dc40302f446ab8b2ecf8c604d6f2fbe Mon Sep 17 00:00:00 2001
From: Lou Cyx <git@lou.cx>
Date: Wed, 17 Dec 2025 01:51:21 -0600
Subject: [PATCH 1/2] =?UTF-8?q?=E2=9E=95=20add=20@testing-library/preact.?=
 =?UTF-8?q?=20=E2=9E=95=20add=20@testing-library/react.=20=E2=9E=95=20add?=
 =?UTF-8?q?=20@testing-library/user-event.=20=F0=9F=94=A7=20ignore=20env?=
 =?UTF-8?q?=20instead=20of=20allowing=20it.=20=F0=9F=8E=A8=20simplify=20te?=
 =?UTF-8?q?st=20setup.=20=E2=9C=85=20simplify=20react=20and=20preact=20tes?=
 =?UTF-8?q?ts.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 @simulcast/preact/tests/useBroadcast.test.tsx | 71 ++++++----------
 @simulcast/react/tests/useBroadcast.test.tsx  | 85 +++++++------------
 deno.json                                     |  8 +-
 setupTests.ts                                 | 12 +++
 test/mockDOM.ts                               | 51 -----------
 test/setupTests.ts                            |  4 -
 test/timeout.ts                               |  2 -
 7 files changed, 72 insertions(+), 161 deletions(-)
 create mode 100644 setupTests.ts
 delete mode 100644 test/mockDOM.ts
 delete mode 100644 test/setupTests.ts
 delete mode 100644 test/timeout.ts

diff --git a/@simulcast/preact/tests/useBroadcast.test.tsx b/@simulcast/preact/tests/useBroadcast.test.tsx
index 536efc9..ec8c5e4 100644
--- a/@simulcast/preact/tests/useBroadcast.test.tsx
+++ b/@simulcast/preact/tests/useBroadcast.test.tsx
@@ -2,9 +2,9 @@
 import { broadcast, type EventRegistry } from "@simulcast/core";
 import { useBroadcast } from "@simulcast/preact";
 import { assertStrictEquals } from "@std/assert";
-import { mockDOM } from "@test/mockDOM.ts";
-import { timeout } from "@test/timeout.ts";
-import { type ComponentProps, render, type TargetedMouseEvent } from "preact";
+import { cleanup, render, screen } from "@testing-library/preact";
+import { userEvent } from "@testing-library/user-event";
+import type { ComponentProps, TargetedMouseEvent } from "preact";
 import { useState } from "preact/hooks";
 
 const CountComponent = (properties: ComponentProps<"button">) => {
@@ -12,8 +12,8 @@ const CountComponent = (properties: ComponentProps<"button">) => {
 
 	return (
 		<button
-			className="add"
 			onClick={() => setCount(count + 1)}
+			title="Add"
 			{...properties}
 		>
 			{count}
@@ -22,7 +22,6 @@ const CountComponent = (properties: ComponentProps<"button">) => {
 };
 
 const BroadcastComponent = ({
-	className,
 	registry,
 	state,
 	...properties
@@ -40,8 +39,8 @@ const BroadcastComponent = ({
 
 	return (
 		<button
-			className={className ?? "broadcast"}
 			onClick={emitClick}
+			title="Broadcast"
 			{...properties}
 		>
 			Click me!
@@ -49,13 +48,12 @@ const BroadcastComponent = ({
 	);
 };
 
+Deno.test.afterEach(cleanup);
+
 Deno.test(
 	"Broadcast's on handler is called once even when it re-renders",
 	async () => {
-		mockDOM({ fakeTimers: true });
-
 		const state = { calledTimes: 0 };
-		const root = document.querySelector("#root") as HTMLDivElement;
 		const { registry } = broadcast<{
 			click: TargetedMouseEvent<HTMLButtonElement>;
 		}>();
@@ -67,31 +65,24 @@ Deno.test(
 					<CountComponent />
 				</>
 			),
-			root,
 		);
 
-		const addButton = document.querySelector<HTMLButtonElement>(
-			"button.add",
-		) as HTMLButtonElement;
-		const broadcastButton = document.querySelector<HTMLButtonElement>(
-			"button.broadcast",
-		) as HTMLButtonElement;
-
-		addButton.click(); // Click button that will re-render once
-		await timeout(10);
-		addButton.click(); // Click button that will re-render twice
-		await timeout(10);
-		broadcastButton.click(); // Click broadcast button once
+		const addButton = screen.getByTitle<HTMLButtonElement>("Add");
+		const broadcastButton = screen.getByTitle<HTMLButtonElement>(
+			"Broadcast",
+		);
+
+		await userEvent.click(addButton); // Click button that will re-render once
+		await userEvent.click(addButton); // Click button that will re-render twice
+		await userEvent.click(broadcastButton); // Click broadcast button once
 		assertStrictEquals(state.calledTimes, 1); // State should be updated once
 		assertStrictEquals(addButton.textContent, "2"); // Even when it re-rendered twice
 	},
 );
 
 Deno.test("Broadcast's on handler is removed when unmounted", async () => {
-	mockDOM({ fakeTimers: true });
 	const state1 = { calledTimes: 0 };
 	const state2 = { calledTimes: 0 };
-	const root = document.querySelector("#root") as HTMLDivElement;
 	const { registry } = broadcast<{
 		click: TargetedMouseEvent<HTMLButtonElement>;
 	}>();
@@ -111,13 +102,13 @@ Deno.test("Broadcast's on handler is removed when unmounted", async () => {
 					)
 					: undefined}
 				<BroadcastComponent
-					className="always-visible-broadcast"
 					state={state2}
+					title="Always visible Broadcast"
 					{...{ registry }}
 				/>
 				<button
-					className="toggle"
 					onClick={() => setVisible(!visible)}
+					title="Toggle"
 					type="button"
 				>
 					Toggle Visibility
@@ -126,32 +117,22 @@ Deno.test("Broadcast's on handler is removed when unmounted", async () => {
 		);
 	};
 
-	render(<App />, root);
-
-	await timeout();
+	render(<App />);
 
-	const toggleButton = document.querySelector<HTMLButtonElement>(
-		"button.toggle",
-	) as HTMLButtonElement;
-	const broadcastButton = document.querySelector<HTMLButtonElement>(
-		"button.broadcast",
-	) as HTMLButtonElement;
-	const alwaysVisibleBroadcastButton = document.querySelector<
+	const toggleButton = screen.getByTitle<HTMLButtonElement>("Toggle");
+	const broadcastButton = screen.getByTitle<HTMLButtonElement>("Broadcast");
+	const alwaysVisibleBroadcastButton = screen.getByTitle<
 		HTMLButtonElement
-	>(
-		"button.always-visible-broadcast",
-	) as HTMLButtonElement;
+	>("Always visible Broadcast");
 
-	await timeout();
 	// Click broadcast button that will be removed from the DOM
-	broadcastButton.click();
+	await userEvent.click(broadcastButton);
 	// Click broadcast button that will stay in the DOM
-	alwaysVisibleBroadcastButton.click();
+	await userEvent.click(alwaysVisibleBroadcastButton);
 	// Click toggle button (removes the first broadcast button)
-	toggleButton.click();
-	await timeout();
+	await userEvent.click(toggleButton);
 	// Click broadcast button that stayed again
-	alwaysVisibleBroadcastButton.click();
+	await userEvent.click(alwaysVisibleBroadcastButton);
 	assertStrictEquals(state1.calledTimes, 2); // State 1 should have registered events until removed
 	assertStrictEquals(state2.calledTimes, 3); // State 2 should have registered all events
 });
diff --git a/@simulcast/react/tests/useBroadcast.test.tsx b/@simulcast/react/tests/useBroadcast.test.tsx
index 92ba5ce..170c888 100644
--- a/@simulcast/react/tests/useBroadcast.test.tsx
+++ b/@simulcast/react/tests/useBroadcast.test.tsx
@@ -2,18 +2,17 @@
 import { broadcast, type EventRegistry } from "@simulcast/core";
 import { useBroadcast } from "@simulcast/react";
 import { assertStrictEquals } from "@std/assert";
-import { mockDOM } from "@test/mockDOM.ts";
-import { timeout } from "@test/timeout.ts";
+import { cleanup, render, screen } from "@testing-library/react";
+import { userEvent } from "@testing-library/user-event";
 import { type ComponentProps, type MouseEvent, useState } from "react";
-import { createRoot } from "react-dom/client";
 
 const CountComponent = (properties: ComponentProps<"button">) => {
 	const [count, setCount] = useState(0);
 
 	return (
 		<button
-			className="add"
 			onClick={() => setCount(count + 1)}
+			title="Add"
 			{...properties}
 		>
 			{count}
@@ -22,7 +21,6 @@ const CountComponent = (properties: ComponentProps<"button">) => {
 };
 
 const BroadcastComponent = ({
-	className,
 	registry,
 	state,
 	...properties
@@ -38,8 +36,8 @@ const BroadcastComponent = ({
 
 	return (
 		<button
-			className={className ?? "broadcast"}
 			onClick={emitClick}
+			title="Broadcast"
 			{...properties}
 		>
 			Click me!
@@ -47,20 +45,17 @@ const BroadcastComponent = ({
 	);
 };
 
+Deno.test.afterEach(cleanup);
+
 Deno.test(
 	"Broadcast's on handler is called once even when it re-renders",
 	async () => {
-		mockDOM();
-		const root = createRoot(
-			document.querySelector("#root") as HTMLDivElement,
-		);
-
 		const state = { calledTimes: 0 };
 		const { registry } = broadcast<{
 			click: MouseEvent<HTMLButtonElement>;
 		}>();
 
-		root.render(
+		render(
 			(
 				<>
 					<BroadcastComponent {...{ registry, state }} />
@@ -69,30 +64,20 @@ Deno.test(
 			),
 		);
 
-		await timeout(10);
-
-		const addButton = document.querySelector<HTMLButtonElement>(
-			"button.add",
-		) as HTMLButtonElement;
-		const broadcastButton = document.querySelector<HTMLButtonElement>(
-			"button.broadcast",
-		) as HTMLButtonElement;
-
-		await timeout();
-		addButton.click(); // Click button that will re-render once
-		await timeout();
-		addButton.click(); // Click button that will re-render twice
-		await timeout();
-		broadcastButton.click(); // Click broadcast button once
+		const addButton = screen.getByTitle<HTMLButtonElement>("Add");
+		const broadcastButton = screen.getByTitle<HTMLButtonElement>(
+			"Broadcast",
+		);
+
+		await userEvent.click(addButton); // Click button that will re-render once
+		await userEvent.click(addButton); // Click button that will re-render twice
+		await userEvent.click(broadcastButton); // Click broadcast button once
 		assertStrictEquals(state.calledTimes, 1); // State should be updated once
 		assertStrictEquals(addButton.textContent, "2"); // Even when it re-rendered twice
 	},
 );
 
 Deno.test("Broadcast's on handler is removed when unmounted", async () => {
-	mockDOM();
-	const root = createRoot(document.querySelector("#root") as HTMLDivElement);
-
 	const state1 = { calledTimes: 0 };
 	const state2 = { calledTimes: 0 };
 	const { registry } = broadcast<{
@@ -108,19 +93,19 @@ Deno.test("Broadcast's on handler is removed when unmounted", async () => {
 				{visible
 					? (
 						<BroadcastComponent
-							{...{ registry }}
 							state={state1}
+							{...{ registry }}
 						/>
 					)
 					: undefined}
 				<BroadcastComponent
-					className="always-visible-broadcast"
-					{...{ registry }}
 					state={state2}
+					title="Always visible Broadcast"
+					{...{ registry }}
 				/>
 				<button
-					className="toggle"
 					onClick={() => setVisible(!visible)}
+					title="Toggle"
 					type="button"
 				>
 					Toggle Visibility
@@ -129,35 +114,23 @@ Deno.test("Broadcast's on handler is removed when unmounted", async () => {
 		);
 	};
 
-	root.render(<App />);
-
-	await timeout(10);
+	render(<App />);
 
-	const toggleButton = document.querySelector<HTMLButtonElement>(
-		"button.toggle",
-	) as HTMLButtonElement;
-	const broadcastButton = document.querySelector<HTMLButtonElement>(
-		"button.broadcast",
-	) as HTMLButtonElement;
-	const alwaysVisibleBroadcastButton = document.querySelector<
+	const toggleButton = screen.getByTitle<HTMLButtonElement>("Toggle");
+	const broadcastButton = screen.getByTitle<HTMLButtonElement>("Broadcast");
+	const alwaysVisibleBroadcastButton = screen.getByTitle<
 		HTMLButtonElement
-	>(
-		"button.always-visible-broadcast",
-	) as HTMLButtonElement;
+	>("Always visible Broadcast");
 
 	// Click broadcast button that will be removed from the DOM
-	await timeout();
-	broadcastButton.click();
-	await timeout();
+
+	await userEvent.click(broadcastButton);
 	// Click broadcast button that will stay in the DOM
-	alwaysVisibleBroadcastButton.click();
-	await timeout();
+	await userEvent.click(alwaysVisibleBroadcastButton);
 	// Click toggle button (removes the first broadcast button)
-	toggleButton.click();
-	await timeout();
+	await userEvent.click(toggleButton);
 	// Click broadcast button that stayed again
-	alwaysVisibleBroadcastButton.click();
-	await timeout();
+	await userEvent.click(alwaysVisibleBroadcastButton);
 	assertStrictEquals(state1.calledTimes, 2); // State 1 should have registered events until removed
 	assertStrictEquals(state2.calledTimes, 3); // State 2 should have registered all events
 });
diff --git a/deno.json b/deno.json
index 4e173a8..2f6fe0b 100644
--- a/deno.json
+++ b/deno.json
@@ -40,7 +40,9 @@
 	},
 	"imports": {
 		"@std/assert": "jsr:@std/assert@^1.0.16",
-		"@test/": "./test/",
+		"@testing-library/preact": "npm:@testing-library/preact@^3.2.4",
+		"@testing-library/react": "npm:@testing-library/react@^16.3.1",
+		"@testing-library/user-event": "npm:@testing-library/user-event@^14.6.1",
 		"@types/react": "npm:@types/react@^19.2.7",
 		"@types/react-dom": "npm:@types/react-dom@^19.2.3",
 		"@vue/test-utils": "npm:@vue/test-utils@^2.4.6",
@@ -95,8 +97,8 @@
 	"nodeModulesDir": "auto",
 	"tasks": {
 		"lint-docs": "deno doc --lint ./@coven/**/*.ts ./@simulcast/**/*.ts",
-		"test": "deno test --allow-env=NODE_ENV --import=./test/setupTests.ts --parallel",
-		"test-coverage": "deno test --allow-env=NODE_ENV --coverage --doc --import=./test/setupTests.ts --parallel --quiet"
+		"test": "deno test --ignore-env --import=./setupTests.ts --parallel",
+		"test-coverage": "deno test --ignore-env --coverage --doc --import=./setupTests.ts --parallel --quiet"
 	},
 	"workspace": [
 		"./@coven/compare",
diff --git a/setupTests.ts b/setupTests.ts
new file mode 100644
index 0000000..0b904a9
--- /dev/null
+++ b/setupTests.ts
@@ -0,0 +1,12 @@
+// deno-coverage-ignore-file
+import { Window } from "happy-dom";
+
+const {
+	Element, // Required by Vue
+	Node, // Required by Vue
+	SVGElement, // Required by Vue
+	document,
+	window,
+} = new Window();
+
+Object.assign(globalThis, { window, Element, Node, SVGElement, document });
diff --git a/test/mockDOM.ts b/test/mockDOM.ts
deleted file mode 100644
index c9e1595..0000000
--- a/test/mockDOM.ts
+++ /dev/null
@@ -1,51 +0,0 @@
-// deno-coverage-ignore-file
-import { Window } from "happy-dom";
-
-Error.stackTraceLimit = Infinity;
-
-const properties = [
-	"Element",
-	"Node",
-	"SVGElement",
-	"document",
-	"window",
-] as const satisfies ReadonlyArray<keyof InstanceType<typeof Window>>;
-
-/**
- * Sets a global mocked DOM or resets it if it's already set.
- *
- * @param template Optional template.
- */
-export const mockDOM = (
-	{
-		fakeTimers = false,
-		template = `
-			<html>
-				<body>
-					<div id="root"></div>
-				</body>
-			</html>
-		`,
-	}: {
-		fakeTimers?: boolean;
-		template?: string;
-	} = {},
-): void => {
-	const window = new Window();
-
-	window.document.body.innerHTML = template;
-
-	properties.forEach((property) =>
-		Object.assign(globalThis, { [property]: window[property] })
-	);
-
-	if (fakeTimers) {
-		const { setTimeout, setInterval } = globalThis;
-
-		globalThis.setTimeout = (handler, _timeout, ...args) =>
-			setTimeout(handler, 0, ...args);
-
-		globalThis.setInterval = (handler, _timeout, ...args) =>
-			setInterval(handler, 0, ...args);
-	}
-};
diff --git a/test/setupTests.ts b/test/setupTests.ts
deleted file mode 100644
index 8290c84..0000000
--- a/test/setupTests.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-// deno-coverage-ignore-file
-import { mockDOM } from "./mockDOM.ts";
-
-mockDOM();
diff --git a/test/timeout.ts b/test/timeout.ts
deleted file mode 100644
index 0772759..0000000
--- a/test/timeout.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export const timeout = (milliseconds = 0): Promise<void> =>
-	new Promise((resolve) => setTimeout(resolve, milliseconds));

From c99167dbf09217601bf2d38c208dd464ca5b0f58 Mon Sep 17 00:00:00 2001
From: Lou Cyx <git@lou.cx>
Date: Wed, 17 Dec 2025 01:59:16 -0600
Subject: [PATCH 2/2] =?UTF-8?q?=F0=9F=9B=82=20add=20CODEOWNERS?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .github/CODEOWNERS | 2 ++
 1 file changed, 2 insertions(+)
 create mode 100644 .github/CODEOWNERS

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
new file mode 100644
index 0000000..d5fb9d1
--- /dev/null
+++ b/.github/CODEOWNERS
@@ -0,0 +1,2 @@
+# Default owners for the whole repo (will be updated if we grow, but for now this is fine)
+*	@covenengineering/developers