cheogram-www

created pr with cheogram-www/react-compiler-fixes.1 on 2026-11-10T18:57:22Z · by 3c31bc8c

commented on 2026-11-10T18:57:22Z · by 3c31bc8c

Changes are available at https://tangled.org/mrry.band/cheogram-www on branch react-compiler-fixes.

cmds

checkout latest patchset:

ssh pr.pico.sh pull cheogram-www:react-compiler-fixes | git am -3

checkout specific patchset revision:

ssh pr.pico.sh pull cheogram-www:react-compiler-fixes [rev] | git am -3

add changes to patch request:

git format-patch main --stdout | ssh pr.pico.sh cheogram-www:react-compiler-fixes

add comment to patch request:

ssh pr.pico.sh comment cheogram-www:react-compiler-fixes "lgtm!"

Patchset `cheogram-www/react-compiler-fixes.1` on 2026-11-10T18:57:22Z · commit 273d232

→ Test each file for compilability

Eric Roberts 2026-11-10T17:11:18Z

Fix Account.tsx for react-compiler

Eric Roberts 2026-11-10T17:23:58Z

Fix Accounts.tsx for react-compiler

Eric Roberts 2026-11-10T17:26:31Z

Fix Chat.tsx for react-compiler

Eric Roberts 2026-11-10T17:29:12Z

Fix Chats.tsx for react-compiler

Eric Roberts 2026-11-10T17:32:03Z

Fix Login.tsx for react-compiler

Eric Roberts 2026-11-10T17:33:10Z

Fix MessageDebugger.tsx for react-compiler

Eric Roberts 2026-11-10T17:33:57Z

Fix MessageMenuInChat.tsx for react-compiler

Eric Roberts 2026-11-10T17:34:29Z

Fix Quill.tsx for react-compiler

Eric Roberts 2026-11-10T17:35:10Z

Fix Register.tsx for react-compiler

Eric Roberts 2026-11-10T17:36:03Z

Test each file for compilability

Eric Roberts 2026-11-10T17:11:18Z

We were testing that we actually run the compiler at all, which is good.
But the compiler's default behaviour is to skip files it can't handle,
and not tell you about it, which is not great.

This adds it as a warning on build, but a failure for the tests, and we
test each file individually to make sure it compiles.

As of this commit I'm ignoring all existing failed compilations so that
tests still pass. As I fix things I will remove each exception.

Semantic diff summary

0 added, 2 modified, 0 signature changed, 0 removed across 2 analyzed files (1 file skipped: unsupported file type)

scripts/compiler.test.mjs

chunk lines 1-57 modified

vite.config.js

chunk lines 24-35 modified

+1 -1 package.json #

......@@ -63,7 +63,7 @@
	"scripts": {
		"dev": "vite",
		"build": "npm run format:check ; npm test && tsc -b && vite build",
		"test": "vitest run --reporter=dot && node --test scripts/compiler.test.mjs",
		"test": "vitest run --reporter=dot && node --test --test-reporter=dot scripts/compiler.test.mjs",
		"test:e2e": "node scripts/e2e.mjs --headed",
		"test:e2e:debug": "node scripts/e2e.mjs --debug",
		"test:e2e:headless": "node scripts/e2e.mjs",

+45 -6 scripts/compiler.test.mjs #

......@@ -1,18 +1,57 @@
import assert from "node:assert/strict";
import { glob } from "node:fs/promises";
import { test } from "node:test";
import { createServer } from "vite";

test("runs React Compiler through the Vite configuration", async () => {
const compilerSkips = new Set([
	"components/Account.tsx",
	"components/Accounts.tsx",
	"components/Chat.tsx",
	"components/Chats.tsx",
	"components/Login.tsx",
	"components/MessageDebugger.tsx",
	"components/MessageMenuInChat.tsx",
	"components/Quill.tsx",
	"components/Register.tsx",
]);

test("React Compiler", async (t) => {
	const server = await createServer({
		server: { middlewareMode: true, hmr: false, ws: false, watch: null },
		mode: "compiler-test",
		server: {
			middlewareMode: true,
			hmr: false,
			ws: false,
			watch: null,
			preTransformRequests: false,
		},
		optimizeDeps: { noDiscovery: true, include: [] },
	});

	try {
		const result = await server.transformRequest(
			"/scripts/compiler-fixture.tsx",
		await t.test(
			"runs React Compiler through the Vite configuration",
			async () => {
				const result = await server.transformRequest(
					"/scripts/compiler-fixture.tsx",
				);
				assert.ok(result);
				assert.match(result.code, /react-compiler-runtime/);
			},
		);
		assert.ok(result);
		assert.match(result.code, /react-compiler-runtime/);

		for await (const file of glob("**/*.{ts,tsx}", {
			cwd: "src",
			exclude: ["**/*.test.*", "**/*.d.ts"],
		})) {
			await t.test(
				`compiles src/${file}`,
				{ skip: compilerSkips.has(file) && "Known React Compiler diagnostics" },
				async () => {
					assert.ok(await server.transformRequest(`/src/${file}`));
				},
			);
		}
	} finally {
		await server.close();
	}

+6 -1 vite.config.js #

......@@ -24,7 +24,12 @@ export default defineConfig(({ mode }) => {
						(await git.raw(["describe", "--always"])).trim(),
				},
			}),
			react({ compiler: { target: "18" } }),
			react({
				compiler: {
					target: "18",
					panicThreshold: mode === "compiler-test" ? "all_errors" : "none",
				},
			}),
			svgr(),
			!isTest && eslint({ failOnError: false }),
			VitePWA({

...	...		@@ -63,7 +63,7 @@
63	63		"scripts": {
64	64		"dev": "vite",
65	65		"build": "npm run format:check ; npm test && tsc -b && vite build",
66		-	"test": "vitest run --reporter=dot && node --test scripts/compiler.test.mjs",
	66	+	"test": "vitest run --reporter=dot && node --test --test-reporter=dot scripts/compiler.test.mjs",
67	67		"test:e2e": "node scripts/e2e.mjs --headed",
68	68		"test:e2e:debug": "node scripts/e2e.mjs --debug",
69	69		"test:e2e:headless": "node scripts/e2e.mjs",

...	...		@@ -1,18 +1,57 @@
1	1		import assert from "node:assert/strict";
	2	+	import { glob } from "node:fs/promises";
2	3		import { test } from "node:test";
3	4		import { createServer } from "vite";
4	5
5		-	test("runs React Compiler through the Vite configuration", async () => {
	6	+	const compilerSkips = new Set([
	7	+	"components/Account.tsx",
	8	+	"components/Accounts.tsx",
	9	+	"components/Chat.tsx",
	10	+	"components/Chats.tsx",
	11	+	"components/Login.tsx",
	12	+	"components/MessageDebugger.tsx",
	13	+	"components/MessageMenuInChat.tsx",
	14	+	"components/Quill.tsx",
	15	+	"components/Register.tsx",
	16	+	]);
	17	+
	18	+	test("React Compiler", async (t) => {
6	19		const server = await createServer({
7		-	server: { middlewareMode: true, hmr: false, ws: false, watch: null },
	20	+	mode: "compiler-test",
	21	+	server: {
	22	+	middlewareMode: true,
	23	+	hmr: false,
	24	+	ws: false,
	25	+	watch: null,
	26	+	preTransformRequests: false,
	27	+	},
8	28		optimizeDeps: { noDiscovery: true, include: [] },
9	29		});
	30	+
10	31		try {
11		-	const result = await server.transformRequest(
12		-	"/scripts/compiler-fixture.tsx",
	32	+	await t.test(
	33	+	"runs React Compiler through the Vite configuration",
	34	+	async () => {
	35	+	const result = await server.transformRequest(
	36	+	"/scripts/compiler-fixture.tsx",
	37	+	);
	38	+	assert.ok(result);
	39	+	assert.match(result.code, /react-compiler-runtime/);
	40	+	},
13	41		);
14		-	assert.ok(result);
15		-	assert.match(result.code, /react-compiler-runtime/);
	42	+
	43	+	for await (const file of glob("*/.{ts,tsx}", {
	44	+	cwd: "src",
	45	+	exclude: ["*/.test.", "/.d.ts"],
	46	+	})) {
	47	+	await t.test(
	48	+	`compiles src/${file}`,
	49	+	{ skip: compilerSkips.has(file) && "Known React Compiler diagnostics" },
	50	+	async () => {
	51	+	assert.ok(await server.transformRequest(`/src/${file}`));
	52	+	},
	53	+	);
	54	+	}
16	55		} finally {
17	56		await server.close();
18	57		}

...	...		@@ -24,7 +24,12 @@ export default defineConfig(({ mode }) => {
24	24		(await git.raw(["describe", "--always"])).trim(),
25	25		},
26	26		}),
27		-	react({ compiler: { target: "18" } }),
	27	+	react({
	28	+	compiler: {
	29	+	target: "18",
	30	+	panicThreshold: mode === "compiler-test" ? "all_errors" : "none",
	31	+	},
	32	+	}),
28	33		svgr(),
29	34		!isTest && eslint({ failOnError: false }),
30	35		VitePWA({

cheogram-www

Patchset cheogram-www/react-compiler-fixes.1 on 2026-11-10T18:57:22Z · commit 273d232

Patchset `cheogram-www/react-compiler-fixes.1` on 2026-11-10T18:57:22Z · commit 273d232