Migrate tests to Vitest 4 (#67)

* migrate tests to vitest 4

Co-authored-by: Kent C. Dodds <me+github@kentcdodds.com>

* Fix vitest alias path resolution

Co-authored-by: Kent C. Dodds <me+github@kentcdodds.com>

* Fix stopProcess signal exit handling

Co-authored-by: Kent C. Dodds <me+github@kentcdodds.com>

* Fix resend mock output capture

Co-authored-by: Kent C. Dodds <me+github@kentcdodds.com>

* address vitest review feedback

Co-authored-by: Kent C. Dodds <me+github@kentcdodds.com>

* Fix mock server in ai runtime tests

Co-authored-by: Kent C. Dodds <me+github@kentcdodds.com>

* Fix ai runtime mock reset order

Co-authored-by: Kent C. Dodds <me+github@kentcdodds.com>

* Fix wrangler test process helpers

Co-authored-by: Kent C. Dodds <me+github@kentcdodds.com>

* address latest review feedback

Co-authored-by: Kent C. Dodds <me+github@kentcdodds.com>

---------

Co-authored-by: Cursor Agent <cursoragent@cursor.com>

Author: kentcdodds

.github/workflows/validate.yml

@@ -68,7 +68,7 @@ jobs:
 
   test:
     runs-on: ubuntu-latest
-    name: ✅ Bun Tests
+    name: ✅ Unit Tests
     if: >-
       github.event_name != 'pull_request' || github.event.pull_request.draft ==
       false
@@ -84,8 +84,8 @@ jobs:
       - name: 📥 Install Dependencies
         run: bun install --frozen-lockfile
 
-      - name: ✅ Run Bun Tests
-        run: bun test ./server ./mock-servers
+      - name: ✅ Run Unit Tests
+        run: bun run test:unit
 
   e2e:
     runs-on: ubuntu-latest

bun.lock

@@ -1,32 +1,34 @@
 /// <reference types="bun" />
-import { expect, mock, test } from 'bun:test'
+import { expect, test, vi } from 'vitest'
 import { type Handle } from 'remix/component'
 
 type QueueTask = Parameters<Handle['queueTask']>[0]
 
 const navigationListeners: Array<() => void> = []
 const queuedSessionResponses: Array<{ email: string } | null> = []
-const fetchSessionInfoMock = mock(async () => {
+const fetchSessionInfoMock = vi.fn(async () => {
 	return queuedSessionResponses.shift() ?? null
 })
 
-mock.module('./client-router.tsx', () => ({
-	routerEvents: new EventTarget(),
-	listenToRouterNavigation: (_handle: Handle, listener: () => void) => {
-		navigationListeners.push(listener)
-	},
-	getPathname: () => '/',
-	navigate: () => {
-		return
-	},
-	Router: () => () => null,
-}))
-
-mock.module('./session.ts', () => ({
-	fetchSessionInfo: fetchSessionInfoMock,
-}))
-
-const { App } = await import('./app.tsx')
+async function loadApp() {
+	vi.resetModules()
+	vi.doMock('./client-router.tsx', () => ({
+		routerEvents: new EventTarget(),
+		listenToRouterNavigation: (_handle: Handle, listener: () => void) => {
+			navigationListeners.push(listener)
+		},
+		getPathname: () => '/',
+		navigate: () => {
+			return
+		},
+		Router: () => () => null,
+	}))
+	vi.doMock('./session.ts', () => ({
+		fetchSessionInfo: fetchSessionInfoMock,
+	}))
+	const { App } = await import('./app.tsx')
+	return App
+}
 
 async function runNextTask(tasks: Array<QueueTask>, aborted: boolean) {
 	const task = tasks.shift()
@@ -40,6 +42,7 @@ test('aborted refresh does not erase a ready authenticated session', async () =>
 	navigationListeners.length = 0
 	queuedSessionResponses.length = 0
 	queuedSessionResponses.push({ email: 'signed-in@example.com' }, null)
+	fetchSessionInfoMock.mockClear()
 
 	const queuedTasks: Array<QueueTask> = []
 	const handle = {
@@ -54,24 +57,56 @@ test('aborted refresh does not erase a ready authenticated session', async () =>
 		},
 	} as unknown as Handle
 
+	const App = await loadApp()
 	const render = App(handle)
 	expect(navigationListeners).toHaveLength(1)
 
 	// Initial bootstrap task enqueues the session fetch.
 	await runNextTask(queuedTasks, false)
 	await runNextTask(queuedTasks, false)
 
-	const authenticatedUi = Bun.inspect(render())
-	expect(authenticatedUi).toContain('signed-in@example.com')
-	expect(authenticatedUi).toContain('Log out')
+	const authenticatedUi = render()
+	const navChildren = (authenticatedUi.props as { children: Array<unknown> })
+		.children[0] as {
+		props: { children: Array<unknown> }
+	}
+	const navItems = navChildren.props.children as Array<unknown>
+	const accountLink = navItems[2] as { props?: { children?: Array<unknown> } }
+	const accountEntry = (accountLink.props?.children ?? [])[1] as {
+		props?: { children?: string }
+	}
+	const logoutEntry = (accountLink.props?.children ?? [])[2] as {
+		props?: { children?: { props?: { children?: string } } }
+	}
+	expect(accountEntry.props?.children).toBe('signed-in@example.com')
+	expect(logoutEntry.props?.children?.props?.children).toBe('Log out')
 
 	// Re-run refresh via navigation, then abort in-flight fetch.
 	navigationListeners[0]!()
 	await runNextTask(queuedTasks, true)
 
-	const uiAfterAbort = Bun.inspect(render())
-	expect(uiAfterAbort).toContain('signed-in@example.com')
-	expect(uiAfterAbort).toContain('Log out')
-	expect(uiAfterAbort).not.toContain('>Login<')
-	expect(uiAfterAbort).not.toContain('>Signup<')
+	const uiAfterAbort = render()
+	const navAfterAbort = (uiAfterAbort.props as { children: Array<unknown> })
+		.children[0] as {
+		props: { children: Array<unknown> }
+	}
+	const navAfterAbortItems = navAfterAbort.props.children as Array<unknown>
+	expect(navAfterAbortItems).toHaveLength(3)
+	const accountLinkAfterAbort = navAfterAbortItems[2] as {
+		props?: { children?: Array<unknown> }
+	}
+	const accountEntryAfterAbort = (accountLinkAfterAbort.props?.children ?? [])[1] as {
+		props?: { children?: string }
+	}
+	const logoutEntryAfterAbort = (accountLinkAfterAbort.props?.children ?? [])[2] as {
+		props?: { children?: { props?: { children?: string } } }
+	}
+	expect(accountEntryAfterAbort.props?.children).toBe('signed-in@example.com')
+	expect(logoutEntryAfterAbort.props?.children?.props?.children).toBe('Log out')
+	const navAfterAbortText = JSON.stringify(navAfterAbort)
+	expect(navAfterAbortText).not.toContain('Login')
+	expect(navAfterAbortText).not.toContain('Signup')
+
+	vi.doUnmock('./client-router.tsx')
+	vi.doUnmock('./session.ts')
 })

client/app-session-refresh.test.ts

@@ -1,4 +1,4 @@
-import { afterEach, expect, test } from 'bun:test'
+import { afterEach, expect, test } from 'vitest'
 import { createWidgetHostBridge } from './widget-host-bridge.ts'
 
 type HostRequestMessage = {

client/mcp-apps/widget-host-bridge.test.ts

@@ -17,15 +17,15 @@ magic.
 - Write tests so they could run offline if necessary: avoid relying on the
   public internet and third-party services; prefer local fakes/fixtures.
 - Prefer fast unit tests for server logic; keep e2e tests focused on journeys.
-- Run server/unit tests with `bun test ./server ./mock-servers` to avoid
+- Run server/unit tests with `bun run test:unit` to avoid
   Playwright spec discovery and accidental matches like `mcp-server-e2e`.
 
 ## Examples
 
 ### `Symbol.dispose` with `using`
 
 ```ts
-import { test, expect } from 'bun:test'
+import { test, expect } from 'vitest'
 
 const createTempFile = () => {
 	const path = `/tmp/test-${crypto.randomUUID()}.txt`
@@ -53,7 +53,7 @@ test('reads a temp file', () => {
 ### `Symbol.asyncDispose` with `await using`
 
 ```ts
-import { test, expect } from 'bun:test'
+import { test, expect } from 'vitest'
 
 const createDisposableServer = async () => {
 	const server = Bun.serve({

docs/agents/testing-principles.md

@@ -1,5 +1,5 @@
 /// <reference types="bun" />
-import { expect, test } from 'bun:test'
+import { expect, test } from 'vitest'
 import { createMcpCallerContext, parseMcpCallerContext } from './context.ts'
 
 test('createMcpCallerContext normalizes missing user to null', () => {