refactor: migrate react tests to typescript

.github/scripts/tsconfig.json

@@ -0,0 +1,7 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "composite": true,
+    "allowJs": true
+  }
+}

.github/workflows/ci.yml

@@ -141,7 +141,7 @@ jobs:
         run: pnpm run publint
 
       - name: Type-check test files
-        run: pnpm -C packages/astro run typecheck:tests
+        run: pnpm run typecheck:tests
 
   test:
     name: 'Test (${{ matrix.TEST_SUITE.name }}): ${{ matrix.os }} (node@${{ matrix.NODE_VERSION }})'

knip.js

@@ -1,5 +1,5 @@
 // @ts-check
-const testEntry = 'test/**/*.test.js';
+const testEntry = 'test/**/*.test.{js,ts}';
 
 /** @type {import('knip').KnipConfig} */
 export default {

package.json

@@ -38,6 +38,7 @@
     "test:e2e": "cd packages/astro && pnpm playwright install firefox && pnpm run test:e2e",
     "test:e2e:match": "cd packages/astro && pnpm playwright install firefox && pnpm run test:e2e:match",
     "test:e2e:hosts": "turbo run test:hosted",
+    "typecheck:tests": "pnpm -r typecheck:tests",
     "benchmark": "astro-benchmark",
     "lint": "biome lint && knip && eslint . --report-unused-disable-directives-severity=warn --concurrency=auto",
     "lint:ci": "knip && pnpm run eslint:ci",

packages/astro/package.json

@@ -112,8 +112,8 @@
     "test:e2e:match": "playwright test -g",
     "test:e2e:chrome": "playwright test",
     "test:e2e:firefox": "playwright test --config playwright.firefox.config.js",
-    "test:types": "tsc --project test/types/tsconfig.json",
-    "typecheck:tests": "tsc --project tsconfig.test.json",
+    "test:types": "tsc --build test/types/tsconfig.json",
+    "typecheck:tests": "tsc --build tsconfig.test.json",
     "test:unit": "astro-scripts test \"test/units/**/*.test.ts\" --strip-types --teardown ./test/units/teardown.ts",
     "test:integration": "pnpm run test:integration:js && pnpm run test:integration:ts",
     "test:integration:js": "astro-scripts test \"test/*.test.js\"",

packages/astro/test/types/schemas.ts

@@ -1,9 +1,9 @@
 import { describe, it } from 'node:test';
 import { expectTypeOf } from 'expect-type';
 import type * as z from 'zod/v4';
-import { type FontProviderSchema, FontFamilySchema } from '../../src/assets/fonts/config.js';
-import type { FontProvider, FontFamily } from '../../src/assets/fonts/types.js';
-import type { CacheSchema, RouteRulesSchema } from '../../src/core/cache/config.js';
+import { type FontProviderSchema, FontFamilySchema } from '../../dist/assets/fonts/config.js';
+import type { FontProvider, FontFamily } from '../../dist/assets/fonts/types.js';
+import type { CacheSchema, RouteRulesSchema } from '../../dist/core/cache/config.js';
 import type { CacheProviderConfig, RouteRules } from '../../dist/core/cache/types.js';
 import type { SessionDriverConfigSchema } from '../../dist/core/session/config.js';
 import type { SessionDriverConfig } from '../../dist/core/session/types.js';

packages/astro/test/types/tsconfig.json

@@ -1,8 +1,8 @@
 {
   "extends": "../../../../tsconfig.base.json",
   "compilerOptions": {
+    "composite": true,
     "allowJs": true,
-    "emitDeclarationOnly": false,
-    "noEmit": true
+    "emitDeclarationOnly": false
   }
 }

packages/astro/tsconfig.json

@@ -1,13 +1,15 @@
 {
   "extends": "../../tsconfig.base.json",
-  "include": ["src", "dev-only.d.ts"],
+  "include": ["src", "dev-only.d.ts", "package.json"],
   "exclude": ["dist"],
   "compilerOptions": {
+    "composite": true,
     "rootDir": "./src",
     "allowJs": true,
     "declarationDir": "./dist",
     "outDir": "./dist",
     "jsx": "preserve",
+    "tsBuildInfoFile": "${configDir}/dist/._cache/tsconfig/tsbuildinfo.json",
     "erasableSyntaxOnly": true
   }
 }

packages/astro/tsconfig.test.json

@@ -1,12 +1,29 @@
 {
   "extends": "../../tsconfig.base.json",
-  "include": ["test/units/**/*.ts"],
+  "include": [
+    "test/units/**/*.ts",
+    "test/test-adapter.js",
+    "test/test-image-service.js",
+    "test/test-plugins.js",
+    "test/test-prerenderer.js",
+    "test/test-remote-image-service.js",
+    "test/test-utils.js"
+  ],
   "exclude": ["test/units/_temp-fixtures/**", "test/fixtures/**"],
   "compilerOptions": {
-    "noEmit": true,
+    "types": ["vite/client", "node"],
+    "composite": true,
     "allowJs": true,
     "noUnusedLocals": false,
     "noUnusedParameters": false,
     "rewriteRelativeImportExtensions": true
-  }
+  },
+  "references": [
+    {
+      "path": "./tsconfig.json"
+    },
+    {
+      "path": "../../scripts/tsconfig.json"
+    }
+  ]
 }

packages/integrations/react/package.json

@@ -36,7 +36,8 @@
     "build": "astro-scripts build \"src/**/*.ts\" && tsc",
     "build:ci": "astro-scripts build \"src/**/*.ts\"",
     "dev": "astro-scripts dev \"src/**/*.ts\"",
-    "test": "astro-scripts test \"test/**/*.test.js\""
+    "test": "astro-scripts test \"test/**/*.test.ts\"",
+    "typecheck:tests": "tsc --build tsconfig.test.json"
   },
   "dependencies": {
     "@astrojs/internal-helpers": "workspace:*",

packages/integrations/react/test/react-19-preloads.test.js → packages/integrations/react/test/react-19-preloads.test.ts

@@ -7,7 +7,7 @@ test.describe('React 19 SSR integration', () => {
 		const fixture = await loadFixture({
 			root: new URL('./fixtures/react-19-preloads/', import.meta.url),
 		});
-		await fixture.build();
+		await fixture.build({});
 
 		const html = await fixture.readFile('/index.html');
 		const islandPattern = /<astro-island[^>]*>([\s\S]*?)<\/astro-island>/;

packages/integrations/react/test/react-component.test.js → packages/integrations/react/test/react-component.test.ts

@@ -1,9 +1,14 @@
 import assert from 'node:assert/strict';
 import { after, before, describe, it } from 'node:test';
 import { load as cheerioLoad } from 'cheerio';
-import { isWindows, loadFixture } from '../../../astro/test/test-utils.js';
+import {
+	isWindows,
+	loadFixture,
+	type Fixture,
+	type DevServer,
+} from '../../../astro/test/test-utils.js';
 
-let fixture;
+let fixture: Fixture;
 
 describe('React Components', () => {
 	before(async () => {
@@ -14,7 +19,7 @@ describe('React Components', () => {
 
 	describe('build', () => {
 		before(async () => {
-			await fixture.build();
+			await fixture.build({});
 		});
 
 		it('Can load React', async () => {
@@ -144,8 +149,7 @@ describe('React Components', () => {
 	if (isWindows) return;
 
 	describe('dev', () => {
-		/** @type {import('../../../astro/test/test-utils.js').Fixture} */
-		let devServer;
+		let devServer: DevServer;
 
 		before(async () => {
 			devServer = await fixture.startDevServer();
@@ -156,7 +160,8 @@ describe('React Components', () => {
 		});
 
 		it('scripts proxy correctly', async () => {
-			const html = await fixture.fetch('/').then((res) => res.text());
+			const response = await fixture.fetch('/');
+			const html: string = await response.text();
 			const $ = cheerioLoad(html);
 
 			for (const script of $('script').toArray()) {
@@ -168,9 +173,10 @@ describe('React Components', () => {
 
 		// TODO: move this to separate dev test?
 		it.skip('Throws helpful error message on window SSR', async () => {
-			const html = await fixture.fetch('/window/index.html');
+			const response = await fixture.fetch('/window/index.html');
+			const html: string = await response.text();
 			assert.ok(
-				(await html.text()).includes(
+				html.includes(
 					`[/window]
 			The window object is not available during server-side rendering (SSR).
 			Try using \`import.meta.env.SSR\` to write SSR-friendly code.
@@ -181,19 +187,26 @@ describe('React Components', () => {
 
 		// In moving over to Vite, the jsx-runtime import is now obscured. TODO: update the method of finding this.
 		it.skip('uses the new JSX transform', async () => {
-			const html = await fixture.fetch('/index.html');
+			const response = await fixture.fetch('/index.html');
+			const html: string = await response.text();
 
 			// Grab the imports
 			const exp = /import\("(.+?)"\)/g;
-			let match, componentUrl;
+			let match, componentUrl: string | undefined;
 			while ((match = exp.exec(html))) {
 				if (match[1].includes('Research.js')) {
 					componentUrl = match[1];
 					break;
 				}
 			}
+			if (!componentUrl) {
+				throw new Error('Could not find component URL in HTML');
+			}
+
 			const component = await fixture.readFile(componentUrl);
-			const jsxRuntime = component.imports.filter((i) => i.specifier.includes('jsx-runtime'));
+			// @ts-ignore: error TS2339: Property 'imports' does not exist on type 'string'.
+			const imports = component.imports;
+			const jsxRuntime = imports.filter((i: any) => i.specifier.includes('jsx-runtime'));
 
 			// test 1: react/jsx-runtime is used for the component
 			assert.ok(jsxRuntime);

packages/integrations/react/tsconfig.test.json

@@ -0,0 +1,17 @@
+{
+  "extends": "../../../tsconfig.base.json",
+  "include": ["test/**/*.ts"],
+  "exclude": ["test/fixtures/**"],
+  "compilerOptions": {
+    "noEmit": true,
+    "allowJs": true,
+    "noUnusedLocals": false,
+    "noUnusedParameters": false,
+    "rewriteRelativeImportExtensions": true
+  },
+  "references": [
+    {
+      "path": "../../astro/tsconfig.test.json"
+    }
+  ]
+}

scripts/testing/github-test-reporter.js

@@ -20,7 +20,7 @@ export default new Transform({
 					file: event.data.file,
 					line: event.data.line,
 					column: event.data.column,
-					isSuite: event.data.details.type !== 'test',
+					isSuite: event.data.details.type !== 'suite',
 				});
 				break;
 		}

scripts/tsconfig.json

@@ -0,0 +1,12 @@
+{
+  "extends": "../tsconfig.base.json",
+  "compilerOptions": {
+    "composite": true,
+    "allowJs": true
+  },
+  "references": [
+    {
+      "path": "../.github/scripts/tsconfig.json"
+    }
+  ]
+}

tsconfig.base.json

@@ -14,6 +14,7 @@
     "noUnusedLocals": true,
     "noUnusedParameters": true,
     "erasableSyntaxOnly": true,
+    "outDir": "${configDir}/node_modules/.cache/tsconfig/out",
     "types": ["node"]
   }
 }