diff --git a/packages/astro/test/0-css.test.js b/packages/astro/test/0-css.test.ts
similarity index 87%
rename from packages/astro/test/0-css.test.js
rename to packages/astro/test/0-css.test.ts
index 35ca255f06cc..3aa14d9f13ee 100644
--- a/packages/astro/test/0-css.test.js
+++ b/packages/astro/test/0-css.test.ts
@@ -7,10 +7,9 @@
 import assert from 'node:assert/strict';
 import { after, before, describe, it } from 'node:test';
 import * as cheerio from 'cheerio';
-import { loadFixture } from './test-utils.js';
+import { loadFixture, type DevServer, type Fixture } from './test-utils.js';
 
-/** @type {import('./test-utils').Fixture} */
-let fixture;
+let fixture: Fixture;
 
 describe('CSS', function () {
 	before(async () => {
@@ -19,9 +18,9 @@ describe('CSS', function () {
 
 	// test HTML and CSS contents for accuracy
 	describe('build', () => {
-		let $;
-		let html;
-		let bundledCSS;
+		let $: cheerio.CheerioAPI;
+		let html: string;
+		let bundledCSS: string;
 
 		before(
 			async () => {
@@ -30,7 +29,7 @@ describe('CSS', function () {
 				// get bundled CSS (will be hashed, hence DOM query)
 				html = await fixture.readFile('/index.html');
 				$ = cheerio.load(html);
-				const bundledCSSHREF = $('link[rel=stylesheet][href^=/_astro/]').attr('href');
+				const bundledCSSHREF = $('link[rel=stylesheet][href^=/_astro/]').attr('href')!;
 				const bundledCSSFilePath = bundledCSSHREF.replace(/^\/?/, '/');
 				bundledCSS = (await fixture.readFile(bundledCSSFilePath))
 					.replace(/\s/g, '')
@@ -85,7 +84,7 @@ describe('CSS', function () {
 			});
 
 			it('Using hydrated components adds astro-island styles', async () => {
-				const inline = $('style').html();
+				const inline = $('style').html()!;
 				assert.equal(inline.includes('display:contents'), true);
 			});
 
@@ -100,7 +99,7 @@ describe('CSS', function () {
 			it('Styles through barrel files should only include used Astro scoped styles', async () => {
 				const barrelHtml = await fixture.readFile('/barrel-styles/index.html');
 				const barrel$ = cheerio.load(barrelHtml);
-				const barrelBundledCssHref = barrel$('link[rel=stylesheet][href^=/_astro/]').attr('href');
+				const barrelBundledCssHref = barrel$('link[rel=stylesheet][href^=/_astro/]').attr('href')!;
 				const style = await fixture.readFile(barrelBundledCssHref.replace(/^\/?/, '/'));
 				assert.match(style, /\.comp-a\[data-astro-cid/);
 				assert.match(style, /\.comp-c\{/);
@@ -110,7 +109,7 @@ describe('CSS', function () {
 			it('CSS modules imported in both frontmatter and script should not duplicate', async () => {
 				const duplicateHtml = await fixture.readFile('/css-module-duplicate/index.html');
 				const $duplicate = cheerio.load(duplicateHtml);
-				const cssHref = $duplicate('link[rel=stylesheet][href^=/_astro/]').attr('href');
+				const cssHref = $duplicate('link[rel=stylesheet][href^=/_astro/]').attr('href')!;
 				const css = await fixture.readFile(cssHref.replace(/^\/?/, '/'));
 
 				const normalizedCSS = css.replace(/\s+/g, '');
@@ -145,11 +144,12 @@ describe('CSS', function () {
 
 			it('.module.css', async () => {
 				const el = $('#react-module-css');
-				const classes = el.attr('class').split(' ');
-				const moduleClass = classes.find((name) => /^_title_[\w-]+/.test(name));
+				const classAttr = el.attr('class')!;
+				const classes = classAttr.split(' ');
+				const moduleClass = classes.find((name) => /^_title_[\w-]+/.test(name))!;
 
 				// 1. check HTML
-				assert.equal(el.attr('class').includes(moduleClass), true);
+				assert.equal(classAttr.includes(moduleClass), true);
 
 				// 2. check CSS
 				assert.match(bundledCSS, new RegExp(`.${moduleClass}[^{]*{font-family:fantasy`));
@@ -159,7 +159,7 @@ describe('CSS', function () {
 				const el = $('#react-sass');
 
 				// 1. check HTML
-				assert.equal(el.attr('class').includes('react-sass-title'), true);
+				assert.equal(el.attr('class')!.includes('react-sass-title'), true);
 
 				// 2. check CSS
 				assert.match(bundledCSS, /.react-sass-title[^{]*\{font-family:fantasy/);
@@ -169,7 +169,7 @@ describe('CSS', function () {
 				const el = $('#react-scss');
 
 				// 1. check HTML
-				assert.equal(el.attr('class').includes('react-scss-title'), true);
+				assert.equal(el.attr('class')!.includes('react-scss-title'), true);
 
 				// 2. check CSS
 				assert.match(bundledCSS, /.react-scss-title[^{]*\{font-family:fantasy/);
@@ -177,11 +177,12 @@ describe('CSS', function () {
 
 			it('.module.sass', async () => {
 				const el = $('#react-module-sass');
-				const classes = el.attr('class').split(' ');
-				const moduleClass = classes.find((name) => /^_title_[\w-]+/.test(name));
+				const classAttr = el.attr('class')!;
+				const classes = classAttr.split(' ');
+				const moduleClass = classes.find((name) => /^_title_[\w-]+/.test(name))!;
 
 				// 1. check HTML
-				assert.equal(el.attr('class').includes(moduleClass), true);
+				assert.equal(classAttr.includes(moduleClass), true);
 
 				// 2. check CSS
 				assert.match(bundledCSS, new RegExp(`.${moduleClass}[^{]*{font-family:fantasy`));
@@ -189,11 +190,12 @@ describe('CSS', function () {
 
 			it('.module.scss', async () => {
 				const el = $('#react-module-scss');
-				const classes = el.attr('class').split(' ');
-				const moduleClass = classes.find((name) => /^_title_[\w-]+/.test(name));
+				const classAttr = el.attr('class')!;
+				const classes = classAttr.split(' ');
+				const moduleClass = classes.find((name) => /^_title_[\w-]+/.test(name))!;
 
 				// 1. check HTML
-				assert.equal(el.attr('class').includes(moduleClass), true);
+				assert.equal(classAttr.includes(moduleClass), true);
 
 				// 2. check CSS
 				assert.match(bundledCSS, new RegExp(`.${moduleClass}[^{]*{font-family:fantasy`));
@@ -214,7 +216,7 @@ describe('CSS', function () {
 				const el = $('#vue-css');
 
 				// 1. check HTML
-				assert.equal(el.attr('class').includes('vue-css'), true);
+				assert.equal(el.attr('class')!.includes('vue-css'), true);
 
 				// 2. check CSS
 				assert.match(bundledCSS, /.vue-css[^{]*\{font-family:cursive/);
@@ -224,12 +226,12 @@ describe('CSS', function () {
 				const el = $('#vue-scoped');
 
 				// find data-v-* attribute (how Vue CSS scoping works)
-				const { attribs } = el.get(0);
+				const { attribs } = el.get(0)!;
 				const scopeId = Object.keys(attribs).find((k) => k.startsWith('data-v-'));
 				assert.ok(scopeId);
 
 				// 1. check HTML
-				assert.equal(el.attr('class').includes('vue-scoped'), true);
+				assert.equal(el.attr('class')!.includes('vue-scoped'), true);
 
 				// 2. check CSS
 				assert.equal(bundledCSS.includes(`.vue-scoped[${scopeId}]`), true);
@@ -237,11 +239,12 @@ describe('CSS', function () {
 
 			it('<style module>', async () => {
 				const el = $('#vue-modules');
-				const classes = el.attr('class').split(' ');
-				const moduleClass = classes.find((name) => /^_vueModules_[\w-]+/.test(name));
+				const classAttr = el.attr('class')!;
+				const classes = classAttr.split(' ');
+				const moduleClass = classes.find((name) => /^_vueModules_[\w-]+/.test(name))!;
 
 				// 1. check HTML
-				assert.equal(el.attr('class').includes(moduleClass), true);
+				assert.equal(classAttr.includes(moduleClass), true);
 
 				// 2. check CSS
 				assert.match(bundledCSS, new RegExp(`.${moduleClass}[^{]*{font-family:cursive`));
@@ -251,7 +254,7 @@ describe('CSS', function () {
 				const el = $('#vue-sass');
 
 				// 1. check HTML
-				assert.equal(el.attr('class').includes('vue-sass'), true);
+				assert.equal(el.attr('class')!.includes('vue-sass'), true);
 
 				// 2. check CSS
 				assert.match(bundledCSS, /.vue-sass[^{]*\{font-family:cursive/);
@@ -261,7 +264,7 @@ describe('CSS', function () {
 				const el = $('#vue-scss');
 
 				// 1. check HTML
-				assert.equal(el.attr('class').includes('vue-scss'), true);
+				assert.equal(el.attr('class')!.includes('vue-scss'), true);
 
 				// 2. check CSS
 				assert.match(bundledCSS, /.vue-scss[^{]*\{font-family:cursive/);
@@ -271,13 +274,14 @@ describe('CSS', function () {
 		describe('Svelte', () => {
 			it('<style>', async () => {
 				const el = $('#svelte-css');
-				const classes = el.attr('class').split(' ');
+				const classAttr = el.attr('class')!;
+				const classes = classAttr.split(' ');
 				const scopedClass = classes.find(
 					(name) => name !== 'svelte-css' && /^svelte-[A-Za-z\d-]+/.test(name),
 				);
 
 				// 1. check HTML
-				assert.equal(el.attr('class').includes('svelte-css'), true);
+				assert.equal(classAttr.includes('svelte-css'), true);
 
 				// 2. check CSS
 				assert.match(
@@ -288,13 +292,14 @@ describe('CSS', function () {
 
 			it('<style lang="sass">', async () => {
 				const el = $('#svelte-sass');
-				const classes = el.attr('class').split(' ');
+				const classAttr = el.attr('class')!;
+				const classes = classAttr.split(' ');
 				const scopedClass = classes.find(
 					(name) => name !== 'svelte-sass' && /^svelte-[A-Za-z\d-]+/.test(name),
 				);
 
 				// 1. check HTML
-				assert.equal(el.attr('class').includes('svelte-sass'), true);
+				assert.equal(classAttr.includes('svelte-sass'), true);
 
 				// 2. check CSS
 				assert.match(
@@ -305,13 +310,14 @@ describe('CSS', function () {
 
 			it('<style lang="scss">', async () => {
 				const el = $('#svelte-scss');
-				const classes = el.attr('class').split(' ');
+				const classAttr = el.attr('class')!;
+				const classes = classAttr.split(' ');
 				const scopedClass = classes.find(
 					(name) => name !== 'svelte-scss' && /^svelte-[A-Za-z\d-]+/.test(name),
 				);
 
 				// 1. check HTML
-				assert.equal(el.attr('class').includes('svelte-scss'), true);
+				assert.equal(classAttr.includes('svelte-scss'), true);
 
 				// 2. check CSS
 				assert.match(
@@ -323,12 +329,12 @@ describe('CSS', function () {
 			it('client:only and SSR in two pages, both should have styles', async () => {
 				const onlyHtml = await fixture.readFile('/client-only-and-ssr/only/index.html');
 				const $onlyHtml = cheerio.load(onlyHtml);
-				const onlyHtmlCssHref = $onlyHtml('link[rel=stylesheet][href^=/_astro/]').attr('href');
+				const onlyHtmlCssHref = $onlyHtml('link[rel=stylesheet][href^=/_astro/]').attr('href')!;
 				const onlyHtmlCss = await fixture.readFile(onlyHtmlCssHref.replace(/^\/?/, '/'));
 
 				const ssrHtml = await fixture.readFile('/client-only-and-ssr/ssr/index.html');
 				const $ssrHtml = cheerio.load(ssrHtml);
-				const ssrHtmlCssHref = $ssrHtml('link[rel=stylesheet][href^=/_astro/]').attr('href');
+				const ssrHtmlCssHref = $ssrHtml('link[rel=stylesheet][href^=/_astro/]').attr('href')!;
 				const ssrHtmlCss = await fixture.readFile(ssrHtmlCssHref.replace(/^\/?/, '/'));
 
 				assert.equal(onlyHtmlCss.includes('.svelte-only-and-ssr'), true);
@@ -349,11 +355,11 @@ describe('CSS', function () {
 			const unusedCssAsset = bundledAssets.find((asset) => /SvelteDynamic\..*\.css/.test(asset));
 			assert.equal(unusedCssAsset, undefined, 'Found unused style ' + unusedCssAsset);
 
-			let foundVitePreloadCSS = false;
+			let foundVitePreloadCSS: string | false = false;
 			const bundledJS = await fixture.glob('**/*.?(m)js');
 			for (const filename of bundledJS) {
 				const content = await fixture.readFile(filename);
-				if (content.match(/ReactDynamic\..*\.css/)) {
+				if (/ReactDynamic\..*\.css/.test(content)) {
 					foundVitePreloadCSS = filename;
 				}
 			}
@@ -367,8 +373,8 @@ describe('CSS', function () {
 
 	// with "build" handling CSS checking, the dev tests are mostly testing the paths resolve in dev
 	describe('dev', () => {
-		let devServer;
-		let $;
+		let devServer: DevServer;
+		let $: cheerio.CheerioAPI;
 
 		before(async () => {
 			devServer = await fixture.startDevServer();
@@ -381,7 +387,7 @@ describe('CSS', function () {
 		});
 
 		it('resolves CSS in public/', async () => {
-			const href = $('link[href="/global.css"]').attr('href');
+			const href = $('link[href="/global.css"]').attr('href')!;
 			assert.equal((await fixture.fetch(href)).status, 200);
 		});
 
@@ -419,7 +425,7 @@ describe('CSS', function () {
 				'ReactModules.module.sass',
 			];
 			for (const style of styles) {
-				const href = $(`style[data-vite-dev-id$="${style}"]`).attr('data-vite-dev-id');
+				const href = $(`style[data-vite-dev-id$="${style}"]`).attr('data-vite-dev-id')!;
 				assert.equal((await fixture.fetch(href)).status, 200);
 			}
 
diff --git a/packages/astro/test/css-assets.test.js b/packages/astro/test/css-assets.test.ts
similarity index 79%
rename from packages/astro/test/css-assets.test.js
rename to packages/astro/test/css-assets.test.ts
index 194094c05a32..e466365a2d48 100644
--- a/packages/astro/test/css-assets.test.js
+++ b/packages/astro/test/css-assets.test.ts
@@ -1,10 +1,10 @@
 import * as assert from 'node:assert/strict';
 import { before, describe, it } from 'node:test';
 import * as cheerio from 'cheerio';
-import { loadFixture } from './test-utils.js';
+import { loadFixture, type Fixture } from './test-utils.js';
 
 describe('Assets in CSS', () => {
-	let fixture;
+	let fixture: Fixture;
 
 	before(async () => {
 		fixture = await loadFixture({
@@ -18,18 +18,18 @@ describe('Assets in CSS', () => {
 		await fixture.build();
 	});
 
-	function getAllMatches(re, text) {
+	function getAllMatches(re: RegExp, text: string): number {
 		let count = 0;
-		while (re.exec(text) !== null) {
+		while (re.test(text)) {
 			++count;
 		}
 		return count;
 	}
 
-	async function getCSSForPage(pathname) {
+	async function getCSSForPage(pathname: string): Promise<string> {
 		const html = await fixture.readFile(pathname);
 		const $ = cheerio.load(html);
-		const cssPath = $('link').attr('href');
+		const cssPath = $('link').attr('href')!;
 		const css = await fixture.readFile(cssPath);
 		return css;
 	}
diff --git a/packages/astro/test/css-dangling-references.test.js b/packages/astro/test/css-dangling-references.test.ts
similarity index 93%
rename from packages/astro/test/css-dangling-references.test.js
rename to packages/astro/test/css-dangling-references.test.ts
index 5788be87f0a6..b2562f7b28db 100644
--- a/packages/astro/test/css-dangling-references.test.js
+++ b/packages/astro/test/css-dangling-references.test.ts
@@ -1,11 +1,11 @@
 import * as assert from 'node:assert/strict';
 import { before, describe, it } from 'node:test';
-import { loadFixture } from './test-utils.js';
+import { loadFixture, type Fixture } from './test-utils.js';
 
 const cssAssetReferenceRegExp = /_astro\/[A-Za-z\d\-]+\.[\da-f]{8}\.css/g;
 
 describe("When Vite's preloadModule polyfill is used", async () => {
-	let fixture;
+	let fixture: Fixture;
 
 	before(async () => {
 		fixture = await loadFixture({
diff --git a/packages/astro/test/css-deduplication.test.js b/packages/astro/test/css-deduplication.test.ts
similarity index 92%
rename from packages/astro/test/css-deduplication.test.js
rename to packages/astro/test/css-deduplication.test.ts
index 26a17d30358f..a38b0ca07318 100644
--- a/packages/astro/test/css-deduplication.test.js
+++ b/packages/astro/test/css-deduplication.test.ts
@@ -1,11 +1,11 @@
 import * as assert from 'node:assert/strict';
 import { before, describe, it } from 'node:test';
 import * as cheerio from 'cheerio';
-import { loadFixture } from './test-utils.js';
+import { loadFixture, type Fixture } from './test-utils.js';
 
 describe('CSS deduplication for hydrated components', () => {
 	describe('inlineStylesheets: never', () => {
-		let fixture;
+		let fixture: Fixture;
 		before(async () => {
 			fixture = await loadFixture({
 				site: 'https://test.dev/',
@@ -41,7 +41,7 @@ describe('CSS deduplication for hydrated components', () => {
 	});
 
 	describe('inlineStylesheets: always', () => {
-		let fixture;
+		let fixture: Fixture;
 		before(async () => {
 			fixture = await loadFixture({
 				site: 'https://test.dev/',
@@ -62,13 +62,13 @@ describe('CSS deduplication for hydrated components', () => {
 			const $ = cheerio.load(html);
 
 			// Get all <style> tag contents
-			const styles = [];
+			const styles: string[] = [];
 			$('style').each((_i, el) => {
 				styles.push($(el).text().replace(/\s+/g, ''));
 			});
 
 			// Ensure no <style> tag content is duplicated
-			const seen = new Set();
+			const seen = new Set<string>();
 			for (const style of styles) {
 				if (seen.has(style)) {
 					assert.fail('Duplicate <style> tag content found in index.html');
diff --git a/packages/astro/test/css-double-bundle.test.js b/packages/astro/test/css-double-bundle.test.ts
similarity index 92%
rename from packages/astro/test/css-double-bundle.test.js
rename to packages/astro/test/css-double-bundle.test.ts
index f03ba17fe51c..556cc17efaa9 100644
--- a/packages/astro/test/css-double-bundle.test.js
+++ b/packages/astro/test/css-double-bundle.test.ts
@@ -1,11 +1,10 @@
 import assert from 'node:assert/strict';
 import { before, describe, it } from 'node:test';
 import * as cheerio from 'cheerio';
-import { loadFixture } from './test-utils.js';
+import { loadFixture, type Fixture } from './test-utils.js';
 
 describe('CSS Double Bundling Prevention', function () {
-	/** @type {import('./test-utils').Fixture} */
-	let fixture;
+	let fixture: Fixture;
 
 	before(async () => {
 		fixture = await loadFixture({
@@ -29,7 +28,7 @@ describe('CSS Double Bundling Prevention', function () {
 		// Check linked stylesheets
 		const cssLinks = $('link[rel="stylesheet"][href^="/_astro/"]');
 		for (let i = 0; i < cssLinks.length; i++) {
-			const href = cssLinks.eq(i).attr('href');
+			const href = cssLinks.eq(i).attr('href')!;
 			const cssContent = await fixture.readFile(href.replace(/^\//, '/'));
 			allCss += cssContent;
 		}
diff --git a/packages/astro/test/css-dynamic-import-dev.test.js b/packages/astro/test/css-dynamic-import-dev.test.ts
similarity index 86%
rename from packages/astro/test/css-dynamic-import-dev.test.js
rename to packages/astro/test/css-dynamic-import-dev.test.ts
index c13f2c977cfc..e6847a4744f6 100644
--- a/packages/astro/test/css-dynamic-import-dev.test.js
+++ b/packages/astro/test/css-dynamic-import-dev.test.ts
@@ -1,12 +1,12 @@
 import assert from 'node:assert/strict';
 import { after, before, describe, it } from 'node:test';
 import * as cheerio from 'cheerio';
-import { loadFixture } from './test-utils.js';
+import { loadFixture, type DevServer, type Fixture } from './test-utils.js';
 
 describe('CSS - dynamic import in dev', () => {
-	let fixture;
-	let devServer;
-	let $;
+	let fixture: Fixture;
+	let devServer: DevServer;
+	let $: cheerio.CheerioAPI;
 
 	before(
 		async () => {
diff --git a/packages/astro/test/css-import-as-inline.test.js b/packages/astro/test/css-import-as-inline.test.ts
similarity index 93%
rename from packages/astro/test/css-import-as-inline.test.js
rename to packages/astro/test/css-import-as-inline.test.ts
index 9941887062c3..da2b11f1077a 100644
--- a/packages/astro/test/css-import-as-inline.test.js
+++ b/packages/astro/test/css-import-as-inline.test.ts
@@ -1,10 +1,10 @@
 import * as assert from 'node:assert/strict';
 import { after, before, describe, it } from 'node:test';
 import * as cheerio from 'cheerio';
-import { loadFixture } from './test-utils.js';
+import { loadFixture, type DevServer, type Fixture } from './test-utils.js';
 
 describe('Importing raw/inlined CSS', () => {
-	let fixture;
+	let fixture: Fixture;
 	before(async () => {
 		fixture = await loadFixture({
 			root: './fixtures/css-import-as-inline/',
@@ -36,8 +36,7 @@ describe('Importing raw/inlined CSS', () => {
 	});
 
 	describe('Dev', () => {
-		/** @type {import('./test-utils').DevServer} */
-		let devServer;
+		let devServer: DevServer;
 
 		before(async () => {
 			devServer = await fixture.startDevServer();
diff --git a/packages/astro/test/css-inline-stylesheets.test.js b/packages/astro/test/css-inline-stylesheets.test.ts
similarity index 89%
rename from packages/astro/test/css-inline-stylesheets.test.js
rename to packages/astro/test/css-inline-stylesheets.test.ts
index a4dd33c5adba..b5ba34b44e6f 100644
--- a/packages/astro/test/css-inline-stylesheets.test.js
+++ b/packages/astro/test/css-inline-stylesheets.test.ts
@@ -2,10 +2,10 @@ import * as assert from 'node:assert/strict';
 import { before, describe, it } from 'node:test';
 import * as cheerio from 'cheerio';
 import testAdapter from './test-adapter.js';
-import { loadFixture } from './test-utils.js';
+import { loadFixture, type App, type Fixture } from './test-utils.js';
 
 describe('Setting inlineStylesheets to never in static output', () => {
-	let fixture;
+	let fixture: Fixture;
 
 	before(async () => {
 		fixture = await loadFixture({
@@ -32,7 +32,7 @@ describe('Setting inlineStylesheets to never in static output', () => {
 
 	describe('Inspect linked stylesheets', () => {
 		// object, so it can be passed by reference
-		const allStyles = {};
+		const allStyles = { value: '' };
 
 		before(async () => {
 			allStyles.value = await stylesFromStaticOutput(fixture);
@@ -43,7 +43,7 @@ describe('Setting inlineStylesheets to never in static output', () => {
 });
 
 describe('Setting inlineStylesheets to never in server output', () => {
-	let app;
+	let app: App;
 
 	before(async () => {
 		const fixture = await loadFixture({
@@ -73,7 +73,7 @@ describe('Setting inlineStylesheets to never in server output', () => {
 	});
 
 	describe('Inspect linked stylesheets', () => {
-		const allStyles = {};
+		const allStyles = { value: '' };
 
 		before(async () => {
 			allStyles.value = await stylesFromServer(app);
@@ -84,7 +84,7 @@ describe('Setting inlineStylesheets to never in server output', () => {
 });
 
 describe('Setting inlineStylesheets to auto in static output', () => {
-	let fixture;
+	let fixture: Fixture;
 
 	before(async () => {
 		fixture = await loadFixture({
@@ -117,7 +117,7 @@ describe('Setting inlineStylesheets to auto in static output', () => {
 	});
 
 	describe('Inspect linked and inlined stylesheets', () => {
-		const allStyles = {};
+		const allStyles = { value: '' };
 
 		before(async () => {
 			allStyles.value = await stylesFromStaticOutput(fixture);
@@ -128,7 +128,7 @@ describe('Setting inlineStylesheets to auto in static output', () => {
 });
 
 describe('Setting inlineStylesheets to auto in server output', () => {
-	let app;
+	let app: App;
 
 	before(async () => {
 		const fixture = await loadFixture({
@@ -166,7 +166,7 @@ describe('Setting inlineStylesheets to auto in server output', () => {
 	});
 
 	describe('Inspect linked and inlined stylesheets', () => {
-		const allStyles = {};
+		const allStyles = { value: '' };
 
 		before(async () => {
 			allStyles.value = await stylesFromServer(app);
@@ -177,7 +177,7 @@ describe('Setting inlineStylesheets to auto in server output', () => {
 });
 
 describe('Setting inlineStylesheets to always in static output', () => {
-	let fixture;
+	let fixture: Fixture;
 
 	before(async () => {
 		fixture = await loadFixture({
@@ -203,7 +203,7 @@ describe('Setting inlineStylesheets to always in static output', () => {
 	});
 
 	describe('Inspect inlined stylesheets', () => {
-		const allStyles = {};
+		const allStyles = { value: '' };
 
 		before(async () => {
 			allStyles.value = await stylesFromStaticOutput(fixture);
@@ -214,7 +214,7 @@ describe('Setting inlineStylesheets to always in static output', () => {
 });
 
 describe('Setting inlineStylesheets to always in server output', () => {
-	let app;
+	let app: App;
 
 	before(async () => {
 		const fixture = await loadFixture({
@@ -244,7 +244,7 @@ describe('Setting inlineStylesheets to always in server output', () => {
 	});
 
 	describe('Inspect inlined stylesheets', () => {
-		const allStyles = {};
+		const allStyles = { value: '' };
 
 		before(async () => {
 			allStyles.value = await stylesFromServer(app);
@@ -254,7 +254,7 @@ describe('Setting inlineStylesheets to always in server output', () => {
 	});
 });
 
-async function stylesFromStaticOutput(fixture) {
+async function stylesFromStaticOutput(fixture: Fixture): Promise<string> {
 	const html = await fixture.readFile('/index.html');
 	const $ = cheerio.load(html);
 
@@ -264,13 +264,15 @@ async function stylesFromStaticOutput(fixture) {
 	const allLinkedStyles = allLinkedStylesheets.join('');
 
 	const styles = $('style');
-	const allInlinedStylesheets = styles.map((_, styleEl) => styleEl.children[0].data).toArray();
+	const allInlinedStylesheets = styles
+		.map((_, styleEl) => (styleEl.children[0] as { data?: string }).data ?? '')
+		.toArray();
 	const allInlinedStyles = allInlinedStylesheets.join('');
 
 	return allLinkedStyles + allInlinedStyles;
 }
 
-async function stylesFromServer(app) {
+async function stylesFromServer(app: App): Promise<string> {
 	const request = new Request('http://example.com/');
 	const response = await app.render(request);
 	const html = await response.text();
@@ -288,12 +290,14 @@ async function stylesFromServer(app) {
 	const allLinkedStyles = allLinkedStylesheets.join('');
 
 	const styles = $('style');
-	const allInlinedStylesheets = styles.map((_, styleEl) => styleEl.children[0].data).toArray();
+	const allInlinedStylesheets = styles
+		.map((_, styleEl) => (styleEl.children[0] as { data?: string }).data ?? '')
+		.toArray();
 	const allInlinedStyles = allInlinedStylesheets.join('');
 	return allLinkedStyles + allInlinedStyles;
 }
 
-function commonExpectations(allStyles) {
+function commonExpectations(allStyles: { value: string }) {
 	it('Includes all authored css', () => {
 		// authored in imported.css
 		assert.ok(allStyles.value.includes('.bg-lightcoral'));
@@ -310,6 +314,6 @@ function commonExpectations(allStyles) {
 
 	it('Styles used both in content layout and directly in page are included only once', () => {
 		// authored in components/Button.astro
-		assert.equal(allStyles.value.match(/cubic-bezier/g).length, 1);
+		assert.equal(allStyles.value.match(/cubic-bezier/g)!.length, 1);
 	});
 }
diff --git a/packages/astro/test/css-no-code-split.test.js b/packages/astro/test/css-no-code-split.test.ts
similarity index 85%
rename from packages/astro/test/css-no-code-split.test.js
rename to packages/astro/test/css-no-code-split.test.ts
index 5d7731bcd106..576a8c5d3480 100644
--- a/packages/astro/test/css-no-code-split.test.js
+++ b/packages/astro/test/css-no-code-split.test.ts
@@ -1,11 +1,10 @@
 import * as assert from 'node:assert/strict';
 import { before, describe, it } from 'node:test';
 import * as cheerio from 'cheerio';
-import { loadFixture } from './test-utils.js';
+import { loadFixture, type Fixture } from './test-utils.js';
 
 describe('vite.build.cssCodeSplit: false', () => {
-	/** @type {import('./test-utils').Fixture} */
-	let fixture;
+	let fixture: Fixture;
 
 	before(async () => {
 		fixture = await loadFixture({
@@ -19,7 +18,7 @@ describe('vite.build.cssCodeSplit: false', () => {
 	it('loads styles correctly', async () => {
 		let html = await fixture.readFile('/index.html');
 		let $ = cheerio.load(html);
-		const cssHref = $('link[rel=stylesheet][href^=/_astro/]').attr('href');
+		const cssHref = $('link[rel=stylesheet][href^=/_astro/]').attr('href')!;
 		assert.match(cssHref, /\/_astro\/style\..*?\.css/);
 	});
 });
diff --git a/packages/astro/test/css-order-import.test.js b/packages/astro/test/css-order-import.test.ts
similarity index 86%
rename from packages/astro/test/css-order-import.test.js
rename to packages/astro/test/css-order-import.test.ts
index 6d94286f4568..94e2ff39143d 100644
--- a/packages/astro/test/css-order-import.test.js
+++ b/packages/astro/test/css-order-import.test.ts
@@ -1,11 +1,10 @@
 import * as assert from 'node:assert/strict';
 import { after, before, describe, it } from 'node:test';
 import * as cheerio from 'cheerio';
-import { loadFixture } from './test-utils.js';
+import { loadFixture, type DevServer, type Fixture } from './test-utils.js';
 
 describe('CSS ordering - import order', () => {
-	/** @type {import('./test-utils').Fixture} */
-	let fixture;
+	let fixture: Fixture;
 	before(async () => {
 		fixture = await loadFixture({
 			root: './fixtures/css-order-import/',
@@ -14,42 +13,34 @@ describe('CSS ordering - import order', () => {
 		});
 	});
 
-	/**
-	 *
-	 * @param {string} html
-	 * @returns {string[]}
-	 */
-	function getLinks(html) {
+	function getLinks(html: string): string[] {
 		let $ = cheerio.load(html);
-		let out = [];
+		let out: string[] = [];
 		$('link[rel=stylesheet]').each((_i, el) => {
-			out.push($(el).attr('href'));
+			out.push($(el).attr('href')!);
 		});
 		return out;
 	}
 
-	function getStyles(html) {
+	function getStyles(html: string): string[] {
 		let $ = cheerio.load(html);
-		let out = [];
+		let out: string[] = [];
 		$('style').each((_i, el) => {
 			out.push($(el).text());
 		});
 		return out;
 	}
 
-	/**
-	 *
-	 * @param {string} href
-	 * @returns {Promise<{ href: string; css: string; }>}
-	 */
-	async function getLinkContent(href, f = fixture) {
+	async function getLinkContent(
+		href: string,
+		f: Fixture = fixture,
+	): Promise<{ href: string; css: string }> {
 		const css = await f.readFile(href);
 		return { href, css };
 	}
 
 	describe('Development', () => {
-		/** @type {import('./test-utils').DevServer} */
-		let devServer;
+		let devServer: DevServer;
 
 		before(async () => {
 			devServer = await fixture.startDevServer();
@@ -127,13 +118,13 @@ describe('CSS ordering - import order', () => {
 
 			const content = await Promise.all(getLinks(html).map((href) => getLinkContent(href)));
 			const css = content.map((c) => c.css).join('');
-			assert.equal(/\.astro-jsx/.exec(css).length, 1, '.astro-jsx class is duplicated');
+			assert.equal(/\.astro-jsx/.exec(css)!.length, 1, '.astro-jsx class is duplicated');
 		});
 	});
 
 	describe('Dynamic import', () => {
 		// eslint-disable-next-line @typescript-eslint/no-shadow
-		let fixture;
+		let fixture: Fixture;
 		before(async () => {
 			fixture = await loadFixture({
 				root: './fixtures/css-order-dynamic-import/',
diff --git a/packages/astro/test/css-order-layout.test.js b/packages/astro/test/css-order-layout.test.ts
similarity index 77%
rename from packages/astro/test/css-order-layout.test.js
rename to packages/astro/test/css-order-layout.test.ts
index c08c5be1c7ed..1ff177f6db67 100644
--- a/packages/astro/test/css-order-layout.test.js
+++ b/packages/astro/test/css-order-layout.test.ts
@@ -1,11 +1,10 @@
 import * as assert from 'node:assert/strict';
 import { before, describe, it } from 'node:test';
 import * as cheerio from 'cheerio';
-import { loadFixture } from './test-utils.js';
+import { loadFixture, type Fixture } from './test-utils.js';
 
 describe('CSS ordering - import order with layouts', () => {
-	/** @type {import('./test-utils').Fixture} */
-	let fixture;
+	let fixture: Fixture;
 	before(async () => {
 		fixture = await loadFixture({
 			root: './fixtures/css-order-layout/',
@@ -14,26 +13,16 @@ describe('CSS ordering - import order with layouts', () => {
 		});
 	});
 
-	/**
-	 *
-	 * @param {string} html
-	 * @returns {string[]}
-	 */
-	function getLinks(html) {
+	function getLinks(html: string): string[] {
 		let $ = cheerio.load(html);
-		let out = [];
+		let out: string[] = [];
 		$('link[rel=stylesheet]').each((_i, el) => {
-			out.push($(el).attr('href'));
+			out.push($(el).attr('href')!);
 		});
 		return out;
 	}
 
-	/**
-	 *
-	 * @param {string} href
-	 * @returns {Promise<{ href: string; css: string; }>}
-	 */
-	async function getLinkContent(href) {
+	async function getLinkContent(href: string): Promise<{ href: string; css: string }> {
 		const css = await fixture.readFile(href);
 		return { href, css };
 	}
diff --git a/packages/astro/test/css-order.test.js b/packages/astro/test/css-order.test.ts
similarity index 85%
rename from packages/astro/test/css-order.test.js
rename to packages/astro/test/css-order.test.ts
index 9ade2cb999c6..f3ce06c88dbc 100644
--- a/packages/astro/test/css-order.test.js
+++ b/packages/astro/test/css-order.test.ts
@@ -2,32 +2,29 @@ import * as assert from 'node:assert/strict';
 import { before, describe, it } from 'node:test';
 import * as cheerio from 'cheerio';
 import testAdapter from './test-adapter.js';
-import { loadFixture } from './test-utils.js';
+import { loadFixture, type Fixture } from './test-utils.js';
 
 describe('CSS production ordering', () => {
-	function getLinks(html) {
+	function getLinks(html: string): string[] {
 		let $ = cheerio.load(html);
-		let out = [];
+		let out: string[] = [];
 		$('link[rel=stylesheet]').each((_i, el) => {
-			out.push($(el).attr('href'));
+			out.push($(el).attr('href')!);
 		});
 		return out;
 	}
 
-	/**
-	 *
-	 * @param {import('./test-utils').Fixture} fixture
-	 * @param {string} href
-	 * @returns {Promise<{ href: string; css: string; }>}
-	 */
-	async function getLinkContent(fixture, href) {
+	async function getLinkContent(
+		fixture: Fixture,
+		href: string,
+	): Promise<{ href: string; css: string }> {
 		const css = await fixture.readFile(href);
 		return { href, css };
 	}
 
 	describe('SSG and SSR parity', () => {
-		let staticHTML, serverHTML;
-		let staticCSS, serverCSS;
+		let staticHTML: string, serverHTML: string;
+		let staticCSS: { href: string; css: string }[], serverCSS: { href: string; css: string }[];
 
 		const commonConfig = Object.freeze({
 			root: './fixtures/css-order/',
@@ -69,8 +66,7 @@ describe('CSS production ordering', () => {
 	});
 
 	describe('Page vs. Shared CSS', () => {
-		/** @type {import('./test-utils').Fixture} */
-		let fixture;
+		let fixture: Fixture;
 		before(async () => {
 			fixture = await loadFixture({
 				root: './fixtures/css-order/',
@@ -87,7 +83,7 @@ describe('CSS production ordering', () => {
 				getLinks(html).map((href) => getLinkContent(fixture, href)),
 			);
 
-			assert.ok(content.length, 3, 'there are 3 stylesheets');
+			assert.equal(content.length, 3, 'there are 3 stylesheets');
 			const [, sharedStyles, pageStyles] = content;
 
 			assert.ok(/red/.exec(sharedStyles.css));
@@ -111,8 +107,7 @@ describe('CSS production ordering', () => {
 	});
 
 	describe('Changes order when transparentScriptOrder is enabled', () => {
-		/** @type {import('./test-utils').Fixture} */
-		let fixture;
+		let fixture: Fixture;
 
 		before(async () => {
 			fixture = await loadFixture({