@jasonshimmy/vite-plugin-cer-app 0.1.1 → 0.1.2

package/src/__tests__/plugin/cer-app-plugin.test.ts

@@ -0,0 +1,409 @@
+import { vi, describe, it, expect, beforeEach } from 'vitest'
+
+vi.mock('@jasonshimmy/custom-elements-runtime/vite-plugin', () => ({
+  cerPlugin: vi.fn().mockReturnValue([{ name: 'cer-runtime-plugin' }]),
+}))
+vi.mock('../../plugin/dev-server.js', () => ({
+  configureCerDevServer: vi.fn().mockResolvedValue(undefined),
+}))
+vi.mock('../../plugin/scanner.js', () => ({
+  createWatcher: vi.fn().mockReturnValue({ on: vi.fn(), close: vi.fn() }),
+  scanDirectory: vi.fn().mockResolvedValue([]),
+}))
+vi.mock('../../plugin/dts-generator.js', () => ({
+  scanComposableExports: vi.fn().mockResolvedValue(new Map()),
+  writeAutoImportDts: vi.fn().mockResolvedValue(undefined),
+  writeTsconfigPaths: vi.fn(),
+}))
+vi.mock('../../plugin/virtual/routes.js', () => ({ generateRoutesCode: vi.fn().mockResolvedValue('// routes') }))
+vi.mock('../../plugin/virtual/layouts.js', () => ({ generateLayoutsCode: vi.fn().mockResolvedValue('// layouts') }))
+vi.mock('../../plugin/virtual/components.js', () => ({ generateComponentsCode: vi.fn().mockResolvedValue('// components') }))
+vi.mock('../../plugin/virtual/composables.js', () => ({ generateComposablesCode: vi.fn().mockResolvedValue('// composables') }))
+vi.mock('../../plugin/virtual/plugins.js', () => ({ generatePluginsCode: vi.fn().mockResolvedValue('// plugins') }))
+vi.mock('../../plugin/virtual/middleware.js', () => ({ generateMiddlewareCode: vi.fn().mockResolvedValue('// middleware') }))
+vi.mock('../../plugin/virtual/server-api.js', () => ({ generateServerApiCode: vi.fn().mockResolvedValue('// server-api') }))
+vi.mock('../../plugin/virtual/server-middleware.js', () => ({ generateServerMiddlewareCode: vi.fn().mockResolvedValue('// server-middleware') }))
+vi.mock('../../plugin/virtual/loading.js', () => ({ generateLoadingCode: vi.fn().mockResolvedValue('// loading') }))
+vi.mock('../../plugin/virtual/error.js', () => ({ generateErrorCode: vi.fn().mockResolvedValue('// error') }))
+vi.mock('../../plugin/transforms/auto-import.js', () => ({ autoImportTransform: vi.fn().mockReturnValue(null) }))
+
+import { cerApp } from '../../plugin/index.js'
+
+
+type TestPlugin = {
+  name: string
+  config: (viteConfig: Record<string, unknown>, env: Record<string, unknown>) => unknown
+  configResolved: (resolved: Record<string, unknown>) => void
+  resolveId: (id: string) => string | undefined
+  load: (id: string) => Promise<string | null>
+  transform: (code: string, id: string) => unknown
+  buildStart: () => Promise<void>
+  configureServer: (server: unknown) => Promise<void>
+}
+
+// Helper to get the cerAppPlugin (first plugin in the returned array)
+function getCerPlugin(userConfig = {}): TestPlugin {
+  return cerApp(userConfig)[0] as unknown as TestPlugin
+}
+
+// Minimal resolved config that mirrors what Vite passes to configResolved
+const FAKE_RESOLVED = { root: '/project' }
+
+describe('cerApp()', () => {
+  it('returns an array of plugins', () => {
+    const plugins = cerApp()
+    expect(Array.isArray(plugins)).toBe(true)
+    expect(plugins.length).toBeGreaterThan(0)
+  })
+
+  it('first plugin is named @jasonshimmy/vite-plugin-cer-app', () => {
+    const plugin = getCerPlugin()
+    expect(plugin.name).toBe('@jasonshimmy/vite-plugin-cer-app')
+  })
+})
+
+describe('cerApp plugin — config hook', () => {
+  it('returns build.target: esnext', () => {
+    const plugin = getCerPlugin()
+    const result = plugin.config({ root: '/project' }, { command: 'build', mode: 'production' }) as Record<string, unknown>
+    expect((result.build as Record<string, unknown>).target).toBe('esnext')
+  })
+
+  it('config hook resolves the root', () => {
+    const plugin = getCerPlugin()
+    const result = plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    expect(result).toBeDefined()
+  })
+})
+
+describe('cerApp plugin — configResolved hook', () => {
+  it('does not throw when called', () => {
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    expect(() => plugin.configResolved(FAKE_RESOLVED)).not.toThrow()
+  })
+})
+
+describe('cerApp plugin — resolveId hook', () => {
+  beforeEach(() => {
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    plugin.configResolved(FAKE_RESOLVED)
+  })
+
+  it('resolves virtual:cer-routes to \\0virtual:cer-routes', () => {
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    expect(plugin.resolveId('virtual:cer-routes')).toBe('\0virtual:cer-routes')
+  })
+
+  it('resolves virtual:cer-layouts', () => {
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    expect(plugin.resolveId('virtual:cer-layouts')).toBe('\0virtual:cer-layouts')
+  })
+
+  it('resolves virtual:cer-components', () => {
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    expect(plugin.resolveId('virtual:cer-components')).toBe('\0virtual:cer-components')
+  })
+
+  it('resolves virtual:cer-plugins', () => {
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    expect(plugin.resolveId('virtual:cer-plugins')).toBe('\0virtual:cer-plugins')
+  })
+
+  it('resolves virtual:cer-server-api', () => {
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    expect(plugin.resolveId('virtual:cer-server-api')).toBe('\0virtual:cer-server-api')
+  })
+
+  it('resolves virtual:cer-loading', () => {
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    expect(plugin.resolveId('virtual:cer-loading')).toBe('\0virtual:cer-loading')
+  })
+
+  it('resolves virtual:cer-error', () => {
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    expect(plugin.resolveId('virtual:cer-error')).toBe('\0virtual:cer-error')
+  })
+
+  it('returns undefined for unknown ids', () => {
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    expect(plugin.resolveId('some-unknown-id')).toBeUndefined()
+  })
+})
+
+describe('cerApp plugin — load hook', () => {
+  it('returns null for unknown resolved ids', async () => {
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    plugin.configResolved(FAKE_RESOLVED)
+    const result = await plugin.load('\0unknown-module')
+    expect(result).toBeNull()
+  })
+
+  it('loads virtual:cer-routes module code', async () => {
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    plugin.configResolved(FAKE_RESOLVED)
+    const result = await plugin.load('\0virtual:cer-routes')
+    expect(result).toBe('// routes')
+  })
+
+  it('loads virtual:cer-layouts module code', async () => {
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    plugin.configResolved(FAKE_RESOLVED)
+    const result = await plugin.load('\0virtual:cer-layouts')
+    expect(result).toBe('// layouts')
+  })
+
+  it('loads virtual:cer-components module code', async () => {
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    plugin.configResolved(FAKE_RESOLVED)
+    const result = await plugin.load('\0virtual:cer-components')
+    expect(result).toBe('// components')
+  })
+
+  it('loads virtual:cer-loading module code', async () => {
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    plugin.configResolved(FAKE_RESOLVED)
+    const result = await plugin.load('\0virtual:cer-loading')
+    expect(result).toBe('// loading')
+  })
+
+  it('loads virtual:cer-error module code', async () => {
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    plugin.configResolved(FAKE_RESOLVED)
+    const result = await plugin.load('\0virtual:cer-error')
+    expect(result).toBe('// error')
+  })
+
+  it('returns cached code on repeated load calls', async () => {
+    const { generateRoutesCode } = await import('../../plugin/virtual/routes.js')
+    vi.mocked(generateRoutesCode).mockClear()
+
+    // Use a SINGLE plugin instance so the module cache persists across calls
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    plugin.configResolved(FAKE_RESOLVED)
+
+    const first = await plugin.load('\0virtual:cer-routes')
+    const second = await plugin.load('\0virtual:cer-routes')
+
+    expect(first).toBe(second)
+    // generateRoutesCode should only be called once (cache hit on second call)
+    expect(generateRoutesCode).toHaveBeenCalledTimes(1)
+  })
+
+  it('loads virtual:cer-app-config and exports appConfig', async () => {
+    const plugin = getCerPlugin({ mode: 'ssg' })
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    plugin.configResolved(FAKE_RESOLVED)
+    const result = await plugin.load('\0virtual:cer-app-config') as string
+    expect(result).toContain('appConfig')
+    expect(result).toContain('ssg')
+  })
+})
+
+describe('cerApp plugin — transform hook', () => {
+  it('returns null for virtual module ids', async () => {
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    plugin.configResolved(FAKE_RESOLVED)
+    const result = plugin.transform('// code', '\0virtual:cer-routes')
+    expect(result).toBeNull()
+  })
+
+  it('calls autoImportTransform for regular files', async () => {
+    const { autoImportTransform } = await import('../../plugin/transforms/auto-import.js')
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    plugin.configResolved(FAKE_RESOLVED)
+
+    plugin.transform('const x = 1', '/project/app/pages/index.ts')
+    expect(autoImportTransform).toHaveBeenCalled()
+  })
+
+  it('returns null when autoImportTransform returns null', async () => {
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    plugin.configResolved(FAKE_RESOLVED)
+    const result = plugin.transform('const x = 1', '/project/app/pages/index.ts')
+    expect(result).toBeNull()
+  })
+
+  it('returns { code, map } when autoImportTransform returns a string', async () => {
+    const { autoImportTransform } = await import('../../plugin/transforms/auto-import.js')
+    vi.mocked(autoImportTransform).mockReturnValueOnce('transformed code')
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    plugin.configResolved(FAKE_RESOLVED)
+    const result = plugin.transform('const x = 1', '/project/app/pages/index.ts') as { code: string; map: null }
+    expect(result).toEqual({ code: 'transformed code', map: null })
+  })
+
+  it('returns null when autoImports.runtime is false', async () => {
+    const plugin = getCerPlugin({ autoImports: { runtime: false } })
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    plugin.configResolved(FAKE_RESOLVED)
+    const result = plugin.transform('const x = 1', '/project/app/pages/index.ts')
+    expect(result).toBeNull()
+  })
+})
+
+describe('cerApp plugin — buildStart hook', () => {
+  it('calls scanComposableExports on build start', async () => {
+    const { scanComposableExports } = await import('../../plugin/dts-generator.js')
+    vi.mocked(scanComposableExports).mockClear()
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'build', mode: 'production' })
+    plugin.configResolved(FAKE_RESOLVED)
+    await plugin.buildStart()
+    expect(scanComposableExports).toHaveBeenCalledTimes(1)
+  })
+
+  it('calls writeAutoImportDts on build start', async () => {
+    const { writeAutoImportDts } = await import('../../plugin/dts-generator.js')
+    vi.mocked(writeAutoImportDts).mockClear()
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'build', mode: 'production' })
+    plugin.configResolved(FAKE_RESOLVED)
+    await plugin.buildStart()
+    expect(writeAutoImportDts).toHaveBeenCalledTimes(1)
+  })
+
+  it('calls writeTsconfigPaths on build start', async () => {
+    const { writeTsconfigPaths } = await import('../../plugin/dts-generator.js')
+    vi.mocked(writeTsconfigPaths).mockClear()
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'build', mode: 'production' })
+    plugin.configResolved(FAKE_RESOLVED)
+    await plugin.buildStart()
+    expect(writeTsconfigPaths).toHaveBeenCalledTimes(1)
+  })
+})
+
+describe('cerApp plugin — configureServer hook', () => {
+  it('calls scanComposableExports on server configure', async () => {
+    const { scanComposableExports } = await import('../../plugin/dts-generator.js')
+    vi.mocked(scanComposableExports).mockClear()
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    plugin.configResolved(FAKE_RESOLVED)
+
+    const mockServer = {
+      watcher: { on: vi.fn() },
+      moduleGraph: { getModuleById: vi.fn().mockReturnValue(null), invalidateModule: vi.fn() },
+      ws: { send: vi.fn() },
+    }
+    await plugin.configureServer(mockServer)
+    expect(scanComposableExports).toHaveBeenCalled()
+  })
+
+  it('calls configureCerDevServer on server configure', async () => {
+    const { configureCerDevServer } = await import('../../plugin/dev-server.js')
+    vi.mocked(configureCerDevServer).mockClear()
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    plugin.configResolved(FAKE_RESOLVED)
+
+    const mockServer = {
+      watcher: { on: vi.fn() },
+      moduleGraph: { getModuleById: vi.fn().mockReturnValue(null), invalidateModule: vi.fn() },
+      ws: { send: vi.fn() },
+    }
+    await plugin.configureServer(mockServer)
+    expect(configureCerDevServer).toHaveBeenCalled()
+  })
+
+  it('invokes the file-change watcher callback on add event', async () => {
+    const { createWatcher } = await import('../../plugin/scanner.js')
+    const { scanComposableExports } = await import('../../plugin/dts-generator.js')
+    vi.mocked(scanComposableExports).mockClear()
+
+    let capturedCallback: ((event: string, file: string) => void) | null = null
+    vi.mocked(createWatcher).mockImplementationOnce((_watcher, _dirs, cb) => {
+      capturedCallback = cb
+      return { on: vi.fn(), close: vi.fn() } as unknown as ReturnType<typeof createWatcher>
+    })
+
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    plugin.configResolved(FAKE_RESOLVED)
+
+    const mockServer = {
+      watcher: { on: vi.fn() },
+      moduleGraph: { getModuleById: vi.fn().mockReturnValue(null), invalidateModule: vi.fn() },
+      ws: { send: vi.fn() },
+    }
+    await plugin.configureServer(mockServer)
+
+    // Simulate an 'add' event on a pages file — covers getDirtyVirtualIds and watcher callback
+    await capturedCallback!('add', '/project/app/pages/new-page.ts')
+    expect((mockServer.ws.send as ReturnType<typeof vi.fn>)).toHaveBeenCalledWith({ type: 'full-reload' })
+  })
+
+  it('re-scans composables when a composable file is added', async () => {
+    const { createWatcher } = await import('../../plugin/scanner.js')
+    const { scanComposableExports } = await import('../../plugin/dts-generator.js')
+    vi.mocked(scanComposableExports).mockClear()
+
+    let capturedCallback: ((event: string, file: string) => void) | null = null
+    vi.mocked(createWatcher).mockImplementationOnce((_watcher, _dirs, cb) => {
+      capturedCallback = cb
+      return { on: vi.fn(), close: vi.fn() } as unknown as ReturnType<typeof createWatcher>
+    })
+
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    plugin.configResolved(FAKE_RESOLVED)
+
+    const mockServer = {
+      watcher: { on: vi.fn() },
+      moduleGraph: { getModuleById: vi.fn().mockReturnValue(null), invalidateModule: vi.fn() },
+      ws: { send: vi.fn() },
+    }
+    await plugin.configureServer(mockServer)
+
+    const callsBeforeEvent = vi.mocked(scanComposableExports).mock.calls.length
+    await capturedCallback!('add', '/project/app/composables/use-new.ts')
+    expect(vi.mocked(scanComposableExports).mock.calls.length).toBeGreaterThan(callsBeforeEvent)
+  })
+
+  it('does not trigger HMR on non-add/unlink events', async () => {
+    const { createWatcher } = await import('../../plugin/scanner.js')
+
+    let capturedCallback: ((event: string, file: string) => void) | null = null
+    vi.mocked(createWatcher).mockImplementationOnce((_watcher, _dirs, cb) => {
+      capturedCallback = cb
+      return { on: vi.fn(), close: vi.fn() } as unknown as ReturnType<typeof createWatcher>
+    })
+
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    plugin.configResolved(FAKE_RESOLVED)
+
+    const wsSend = vi.fn()
+    const mockServer = {
+      watcher: { on: vi.fn() },
+      moduleGraph: { getModuleById: vi.fn().mockReturnValue(null), invalidateModule: vi.fn() },
+      ws: { send: wsSend },
+    }
+    await plugin.configureServer(mockServer)
+    wsSend.mockClear()
+
+    await capturedCallback!('change', '/project/app/pages/index.ts')
+    expect(wsSend).not.toHaveBeenCalled()
+  })
+})

package/src/__tests__/plugin/dts-generator.test.ts

@@ -0,0 +1,246 @@
+import { vi, describe, it, expect, beforeEach } from 'vitest'
+
+vi.mock('node:fs', async (importOriginal) => {
+  const actual = await importOriginal<typeof import('node:fs')>()
+  return {
+    ...actual,
+    existsSync: vi.fn().mockReturnValue(false),
+    writeFileSync: vi.fn(),
+    readFileSync: vi.fn().mockReturnValue(''),
+  }
+})
+vi.mock('../../plugin/scanner.js', () => ({ scanDirectory: vi.fn().mockResolvedValue([]) }))
+
+import { existsSync, writeFileSync, readFileSync } from 'node:fs'
+import { scanDirectory } from '../../plugin/scanner.js'
+import {
+  writeTsconfigPaths,
+  scanComposableExports,
+  generateAutoImportDts,
+  generateVirtualModuleDts,
+  writeAutoImportDts,
+} from '../../plugin/dts-generator.js'
+
+const ROOT = '/project'
+const COMPOSABLES_DIR = '/project/app/composables'
+
+beforeEach(() => {
+  vi.mocked(existsSync).mockReturnValue(false)
+  vi.mocked(writeFileSync).mockClear()
+  vi.mocked(scanDirectory).mockResolvedValue([])
+  vi.mocked(readFileSync).mockReturnValue('')
+})
+
+describe('writeTsconfigPaths', () => {
+  it('writes cer-tsconfig.json to the root directory', () => {
+    writeTsconfigPaths(ROOT, `${ROOT}/app`)
+    expect(writeFileSync).toHaveBeenCalledWith(
+      `${ROOT}/cer-tsconfig.json`,
+      expect.any(String),
+      'utf-8',
+    )
+  })
+
+  it('includes ~/\\* path alias in tsconfig', () => {
+    writeTsconfigPaths(ROOT, `${ROOT}/app`)
+    const content = vi.mocked(writeFileSync).mock.calls[0][1] as string
+    expect(content).toContain('~/*')
+  })
+
+  it('includes ~/pages/* path alias', () => {
+    writeTsconfigPaths(ROOT, `${ROOT}/app`)
+    const content = vi.mocked(writeFileSync).mock.calls[0][1] as string
+    expect(content).toContain('~/pages/*')
+  })
+
+  it('generates valid JSON', () => {
+    writeTsconfigPaths(ROOT, `${ROOT}/app`)
+    const content = vi.mocked(writeFileSync).mock.calls[0][1] as string
+    expect(() => JSON.parse(content)).not.toThrow()
+  })
+
+  it('wraps paths in compilerOptions', () => {
+    writeTsconfigPaths(ROOT, `${ROOT}/app`)
+    const content = vi.mocked(writeFileSync).mock.calls[0][1] as string
+    const json = JSON.parse(content)
+    expect(json).toHaveProperty('compilerOptions.paths')
+  })
+})
+
+describe('scanComposableExports', () => {
+  it('returns empty map when composablesDir does not exist', async () => {
+    const result = await scanComposableExports(COMPOSABLES_DIR)
+    expect(result.size).toBe(0)
+  })
+
+  it('returns empty map when no files found', async () => {
+    vi.mocked(existsSync).mockReturnValue(true)
+    const result = await scanComposableExports(COMPOSABLES_DIR)
+    expect(result.size).toBe(0)
+  })
+
+  it('finds exported functions', async () => {
+    vi.mocked(existsSync).mockReturnValue(true)
+    vi.mocked(scanDirectory).mockResolvedValue([`${COMPOSABLES_DIR}/use-counter.ts`])
+    vi.mocked(readFileSync).mockReturnValue('export function useCounter() {}')
+    const result = await scanComposableExports(COMPOSABLES_DIR)
+    expect(result.has('useCounter')).toBe(true)
+    expect(result.get('useCounter')).toBe(`${COMPOSABLES_DIR}/use-counter.ts`)
+  })
+
+  it('finds exported const', async () => {
+    vi.mocked(existsSync).mockReturnValue(true)
+    vi.mocked(scanDirectory).mockResolvedValue([`${COMPOSABLES_DIR}/use-state.ts`])
+    vi.mocked(readFileSync).mockReturnValue('export const useState = () => {}')
+    const result = await scanComposableExports(COMPOSABLES_DIR)
+    expect(result.has('useState')).toBe(true)
+  })
+
+  it('finds multiple exports from a single file', async () => {
+    vi.mocked(existsSync).mockReturnValue(true)
+    vi.mocked(scanDirectory).mockResolvedValue([`${COMPOSABLES_DIR}/utils.ts`])
+    vi.mocked(readFileSync).mockReturnValue(`
+export function useFoo() {}
+export const useBar = () => {}
+    `)
+    const result = await scanComposableExports(COMPOSABLES_DIR)
+    expect(result.has('useFoo')).toBe(true)
+    expect(result.has('useBar')).toBe(true)
+  })
+
+  it('handles multiple files', async () => {
+    vi.mocked(existsSync).mockReturnValue(true)
+    vi.mocked(scanDirectory).mockResolvedValue([
+      `${COMPOSABLES_DIR}/a.ts`,
+      `${COMPOSABLES_DIR}/b.ts`,
+    ])
+    vi.mocked(readFileSync)
+      .mockReturnValueOnce('export function useA() {}')
+      .mockReturnValueOnce('export function useB() {}')
+    const result = await scanComposableExports(COMPOSABLES_DIR)
+    expect(result.has('useA')).toBe(true)
+    expect(result.has('useB')).toBe(true)
+  })
+})
+
+describe('generateAutoImportDts', () => {
+  it('includes AUTO-GENERATED comment', async () => {
+    const dts = await generateAutoImportDts(ROOT, COMPOSABLES_DIR)
+    expect(dts).toContain('AUTO-GENERATED')
+  })
+
+  it('declares component as a global', async () => {
+    const dts = await generateAutoImportDts(ROOT, COMPOSABLES_DIR)
+    expect(dts).toContain("const component: typeof import('@jasonshimmy/custom-elements-runtime')['component']")
+  })
+
+  it('declares html as a global', async () => {
+    const dts = await generateAutoImportDts(ROOT, COMPOSABLES_DIR)
+    expect(dts).toContain("const html: typeof import('@jasonshimmy/custom-elements-runtime')['html']")
+  })
+
+  it('declares ref as a global', async () => {
+    const dts = await generateAutoImportDts(ROOT, COMPOSABLES_DIR)
+    expect(dts).toContain("const ref: typeof import('@jasonshimmy/custom-elements-runtime')['ref']")
+  })
+
+  it('declares useHead as a framework global', async () => {
+    const dts = await generateAutoImportDts(ROOT, COMPOSABLES_DIR)
+    expect(dts).toContain("const useHead: typeof import('@jasonshimmy/vite-plugin-cer-app/composables')['useHead']")
+  })
+
+  it('declares usePageData as a framework global', async () => {
+    const dts = await generateAutoImportDts(ROOT, COMPOSABLES_DIR)
+    expect(dts).toContain("const usePageData: typeof import('@jasonshimmy/vite-plugin-cer-app/composables')['usePageData']")
+  })
+
+  it('declares when directive as a global', async () => {
+    const dts = await generateAutoImportDts(ROOT, COMPOSABLES_DIR)
+    expect(dts).toContain("const when: typeof import('@jasonshimmy/custom-elements-runtime/directives')['when']")
+  })
+
+  it('declares __CER_DATA__ global variable', async () => {
+    const dts = await generateAutoImportDts(ROOT, COMPOSABLES_DIR)
+    expect(dts).toContain('var __CER_DATA__')
+  })
+
+  it('wraps declarations in declare global block', async () => {
+    const dts = await generateAutoImportDts(ROOT, COMPOSABLES_DIR)
+    expect(dts).toContain('declare global {')
+    expect(dts).toContain('}')
+  })
+
+  it('includes user composable exports when provided', async () => {
+    const exports = new Map([['useMyThing', `${COMPOSABLES_DIR}/my-thing.ts`]])
+    const dts = await generateAutoImportDts(ROOT, COMPOSABLES_DIR, exports)
+    expect(dts).toContain('useMyThing')
+  })
+
+  it('uses relative path for user composables', async () => {
+    const exports = new Map([['useFoo', `${ROOT}/app/composables/foo.ts`]])
+    const dts = await generateAutoImportDts(ROOT, COMPOSABLES_DIR, exports)
+    // Path should be relative from root
+    expect(dts).toContain('./app/composables/foo')
+  })
+})
+
+describe('generateVirtualModuleDts', () => {
+  it('includes AUTO-GENERATED comment', async () => {
+    const dts = await generateVirtualModuleDts(ROOT, COMPOSABLES_DIR)
+    expect(dts).toContain('AUTO-GENERATED')
+  })
+
+  it('declares virtual:cer-routes module', async () => {
+    const dts = await generateVirtualModuleDts(ROOT, COMPOSABLES_DIR)
+    expect(dts).toContain("declare module 'virtual:cer-routes'")
+  })
+
+  it('declares virtual:cer-layouts module', async () => {
+    const dts = await generateVirtualModuleDts(ROOT, COMPOSABLES_DIR)
+    expect(dts).toContain("declare module 'virtual:cer-layouts'")
+  })
+
+  it('declares virtual:cer-plugins module', async () => {
+    const dts = await generateVirtualModuleDts(ROOT, COMPOSABLES_DIR)
+    expect(dts).toContain("declare module 'virtual:cer-plugins'")
+  })
+
+  it('declares virtual:cer-loading module with hasLoading and loadingTag', async () => {
+    const dts = await generateVirtualModuleDts(ROOT, COMPOSABLES_DIR)
+    expect(dts).toContain("declare module 'virtual:cer-loading'")
+    expect(dts).toContain('hasLoading')
+    expect(dts).toContain('loadingTag')
+  })
+
+  it('declares virtual:cer-error module with hasError and errorTag', async () => {
+    const dts = await generateVirtualModuleDts(ROOT, COMPOSABLES_DIR)
+    expect(dts).toContain("declare module 'virtual:cer-error'")
+    expect(dts).toContain('hasError')
+    expect(dts).toContain('errorTag')
+  })
+
+  it('includes user composable re-exports in virtual:cer-composables', async () => {
+    const exports = new Map([['useMyThing', `${ROOT}/app/composables/my-thing.ts`]])
+    const dts = await generateVirtualModuleDts(ROOT, COMPOSABLES_DIR, exports)
+    expect(dts).toContain('useMyThing')
+  })
+})
+
+describe('writeAutoImportDts', () => {
+  it('writes cer-auto-imports.d.ts to root', async () => {
+    await writeAutoImportDts(ROOT, COMPOSABLES_DIR)
+    const paths = vi.mocked(writeFileSync).mock.calls.map(([p]) => String(p))
+    expect(paths.some(p => p.includes('cer-auto-imports.d.ts'))).toBe(true)
+  })
+
+  it('writes cer-env.d.ts to root', async () => {
+    await writeAutoImportDts(ROOT, COMPOSABLES_DIR)
+    const paths = vi.mocked(writeFileSync).mock.calls.map(([p]) => String(p))
+    expect(paths.some(p => p.includes('cer-env.d.ts'))).toBe(true)
+  })
+
+  it('writes exactly two files', async () => {
+    await writeAutoImportDts(ROOT, COMPOSABLES_DIR)
+    expect(writeFileSync).toHaveBeenCalledTimes(2)
+  })
+})