@remix-run/test 0.1.0 → 0.3.0

package/src/lib/ts-transform.ts

@@ -0,0 +1,36 @@
+import { transform, type TsconfigRaw } from 'esbuild'
+import { getTsconfig, type TsConfigResult } from 'get-tsconfig'
+import * as path from 'node:path'
+
+const tsconfigCache = new Map<string, TsConfigResult | null>()
+
+/*
+ * Transform a TypeScript file to JavaScript using esbuild with an inline
+ * source map and no minification. Used by the coverage ESM loader hook (so V8
+ * instruments readable JS), the coverage collector (so byte offsets can be
+ * re-derived and mapped back to TypeScript lines), and the browser harness
+ * server (so the bytes V8 sees in the browser match what the collector
+ * re-derives). Identical inputs must produce identical outputs across all
+ * call sites or coverage offsets won't line up.
+ *
+ * Compiler options (notably JSX) are taken from the nearest `tsconfig.json`
+ * walking up from the file's directory, so each project picks up its own
+ * `jsxImportSource` etc. Discovery results are cached by directory.
+ */
+export async function transformTypeScript(
+  source: string,
+  filePath: string,
+): Promise<{ code: string }> {
+  let loader: 'ts' | 'tsx' = filePath.endsWith('.tsx') ? 'tsx' : 'ts'
+
+  let tsConfig = getTsconfig(path.dirname(filePath), 'tsconfig.json', tsconfigCache)
+
+  let result = await transform(source, {
+    loader,
+    sourcemap: 'inline',
+    sourcesContent: true,
+    sourcefile: filePath,
+    tsconfigRaw: { compilerOptions: tsConfig?.config.compilerOptions ?? {} },
+  })
+  return { code: result.code }
+}

package/src/lib/worker-e2e-file.ts

@@ -0,0 +1,98 @@
+import { runTests } from './executor.ts'
+import { importModule } from './import-module.ts'
+import {
+  getBrowserLauncher,
+  getPlaywrightLaunchOptions,
+  getPlaywrightPageOptions,
+  type PlaywrightUseOpts,
+} from './playwright.ts'
+import type { CoverageConfig } from './coverage.ts'
+import type { TestResults } from './reporters/results.ts'
+import { createFailedResults } from './worker-results.ts'
+import { isRecord, parseCoverageConfig } from './worker-server.ts'
+
+export interface E2ETestWorkerData {
+  file: string
+  coverage?: CoverageConfig
+  open?: boolean
+  playwrightUseOpts?: PlaywrightUseOpts
+}
+
+export async function runE2ETestFile(
+  value: unknown,
+  onOpenResults?: (results: TestResults) => void | Promise<void>,
+): Promise<TestResults | undefined> {
+  try {
+    let workerData = parseE2ETestWorkerData(value)
+
+    await importModule(workerData.file, import.meta)
+
+    let launcher = await getBrowserLauncher(workerData.playwrightUseOpts)
+    let opts = getPlaywrightLaunchOptions(workerData.playwrightUseOpts)
+    let browser = await launcher.launch(opts)
+    let browserClosed = false
+
+    try {
+      let results = await runTests({
+        browser,
+        open: workerData.open ?? false,
+        playwrightPageOptions: getPlaywrightPageOptions(workerData.playwrightUseOpts),
+        coverage: !!workerData.coverage,
+      })
+
+      if (workerData.open) {
+        await onOpenResults?.(results)
+        console.log('\nBrowser is open. Press Ctrl+C to close.')
+        await new Promise<void>((resolve) => browser.on('disconnected', () => resolve()))
+        return undefined
+      }
+
+      await browser.close()
+      browserClosed = true
+      return results
+    } finally {
+      if (!browserClosed) {
+        await browser.close()
+      }
+    }
+  } catch (error) {
+    return createFailedResults(error)
+  }
+}
+
+function parseE2ETestWorkerData(value: unknown): E2ETestWorkerData {
+  if (!isRecord(value) || typeof value.file !== 'string') {
+    throw new Error('Invalid E2E test worker data')
+  }
+
+  return {
+    file: value.file,
+    coverage: parseCoverageConfig(value.coverage),
+    open: parseBoolean(value.open, 'open'),
+    playwrightUseOpts: parsePlaywrightUseOpts(value.playwrightUseOpts),
+  }
+}
+
+function parseBoolean(value: unknown, name: string): boolean | undefined {
+  if (value === undefined) {
+    return undefined
+  }
+
+  if (typeof value !== 'boolean') {
+    throw new Error(`Invalid E2E test worker ${name}`)
+  }
+
+  return value
+}
+
+function parsePlaywrightUseOpts(value: unknown): PlaywrightUseOpts | undefined {
+  if (value === undefined) {
+    return undefined
+  }
+
+  if (!isRecord(value)) {
+    throw new Error('Invalid E2E test worker playwright options')
+  }
+
+  return value as PlaywrightUseOpts
+}

package/src/lib/worker-e2e.ts

@@ -1,52 +1,17 @@
-import { workerData, parentPort } from 'node:worker_threads'
-import { tsImport } from 'tsx/esm/api'
-import { createServer } from './e2e-server.ts'
-import { runTests, type TestResults } from './executor.ts'
-import {
-  getBrowserLauncher,
-  getPlaywrightLaunchOptions,
-  getPlaywrightPageOptions,
-} from './playwright.ts'
+import { parentPort, workerData } from 'node:worker_threads'
+import { runE2ETestFile } from './worker-e2e-file.ts'
 
-try {
-  await tsImport(workerData.file, import.meta.url)
+if (!parentPort) {
+  throw new Error('E2E test worker is missing a parent port')
+}
+
+const port = parentPort
+const results = await runE2ETestFile(workerData, (openResults) => {
+  port.postMessage(openResults)
+})
 
-  let launcher = await getBrowserLauncher(workerData.playwrightUseOpts)
-  let opts = getPlaywrightLaunchOptions(workerData.playwrightUseOpts)
-  let browser = await launcher.launch(opts)
-  try {
-    let results = await runTests({
-      browser,
-      createServer,
-      open: workerData.open,
-      playwrightPageOptions: getPlaywrightPageOptions(workerData.playwrightUseOpts),
-    })
-    parentPort!.postMessage(results)
-    if (workerData.open) {
-      console.log('\nBrowser is open. Press Ctrl+C to close.')
-      await new Promise<void>((resolve) => browser.on('disconnected', () => resolve()))
-    }
-  } finally {
-    await browser.close()
-  }
-} catch (e) {
-  let results: TestResults = {
-    passed: 0,
-    failed: 1,
-    skipped: 0,
-    todo: 0,
-    tests: [
-      {
-        name: '',
-        suiteName: '',
-        status: 'failed',
-        duration: 0,
-        error: {
-          message: e instanceof Error ? e.message : String(e),
-          stack: e instanceof Error ? e.stack : undefined,
-        },
-      },
-    ],
-  }
-  parentPort!.postMessage(results)
+if (results) {
+  port.postMessage(results)
 }
+
+process.exit(0)

package/src/lib/worker-process.ts

@@ -0,0 +1,69 @@
+import { runE2ETestFile } from './worker-e2e-file.ts'
+import type { TestResults } from './reporters/results.ts'
+import { runServerTestFile } from './worker-server.ts'
+import { createFailedResults } from './worker-results.ts'
+
+const workerData = await readWorkerData()
+
+const results = await runWorkerProcessFile(workerData)
+
+if (results) {
+  await sendResults(results)
+}
+
+if (process.connected) {
+  process.disconnect()
+}
+
+process.exitCode = 0
+
+function readWorkerData(): Promise<unknown> {
+  return new Promise((resolve, reject) => {
+    function cleanup() {
+      process.off('message', onMessage)
+      process.off('disconnect', onDisconnect)
+    }
+
+    function onMessage(value: unknown) {
+      cleanup()
+      resolve(value)
+    }
+
+    function onDisconnect() {
+      cleanup()
+      reject(new Error('Test worker process disconnected'))
+    }
+
+    process.once('message', onMessage)
+    process.once('disconnect', onDisconnect)
+  })
+}
+
+async function runWorkerProcessFile(value: unknown): Promise<TestResults | undefined> {
+  try {
+    if (!isRecord(value) || (value.type !== 'server' && value.type !== 'e2e')) {
+      throw new Error('Invalid test worker process data')
+    }
+
+    return value.type === 'e2e'
+      ? await runE2ETestFile(value, sendResults)
+      : await runServerTestFile(value)
+  } catch (error) {
+    return createFailedResults(error)
+  }
+}
+
+async function sendResults(results: TestResults): Promise<void> {
+  if (!process.send) {
+    throw new Error('Test worker process is missing an IPC channel')
+  }
+
+  let send = process.send.bind(process)
+  await new Promise<void>((resolve, reject) => {
+    send(results, undefined, undefined, (error) => (error ? reject(error) : resolve()))
+  })
+}
+
+function isRecord(value: unknown): value is Record<string, unknown> {
+  return typeof value === 'object' && value !== null
+}

package/src/lib/worker-results.ts

@@ -0,0 +1,22 @@
+import type { TestResults } from './reporters/results.ts'
+
+export function createFailedResults(error: unknown): TestResults {
+  return {
+    passed: 0,
+    failed: 1,
+    skipped: 0,
+    todo: 0,
+    tests: [
+      {
+        name: '',
+        suiteName: '',
+        status: 'failed',
+        duration: 0,
+        error: {
+          message: error instanceof Error ? error.message : String(error),
+          stack: error instanceof Error ? error.stack : undefined,
+        },
+      },
+    ],
+  }
+}

package/src/lib/worker-server.ts

@@ -0,0 +1,123 @@
+import * as mod from 'node:module'
+import { IS_RUNNING_FROM_SRC } from './config.ts'
+import { importModule } from './import-module.ts'
+import type { CoverageConfig } from './coverage.ts'
+import type { TestResults } from './reporters/results.ts'
+import { runTests } from './executor.ts'
+import { IS_BUN } from './runtime.ts'
+import { createFailedResults } from './worker-results.ts'
+
+export interface ServerTestWorkerData {
+  file: string
+  coverage?: CoverageConfig
+}
+
+export async function runServerTestFile(value: unknown): Promise<TestResults> {
+  let workerData: ServerTestWorkerData | undefined
+
+  try {
+    workerData = parseServerTestWorkerData(value)
+
+    // When coverage is enabled in Node, we use a coverage-friendly TypeScript loader which
+    // replaces tsx's minified transformation with a non-minified esbuild transform
+    // so V8 coverage byte offsets align with readable source lines. This hook runs
+    // before the inherited tsx hook (hooks are LIFO), so it intercepts .ts imports and
+    // short-circuits before tsx transforms them.
+    if (workerData.coverage && !IS_BUN) {
+      // Ensure we load the right file whether we're running in the monorepo (TS) or
+      // from a published package (JS)
+      let ext = IS_RUNNING_FROM_SRC ? '.ts' : '.js'
+      mod.register(new URL(`./coverage-loader${ext}`, import.meta.url), import.meta.url)
+      await import(workerData.file)
+    } else {
+      await importModule(workerData.file, import.meta)
+    }
+
+    let results = await runTests()
+    await takeCoverage(workerData.coverage)
+    return results
+  } catch (e) {
+    try {
+      await takeCoverage(workerData?.coverage)
+    } catch (coverageError) {
+      e = coverageError
+    }
+
+    return createFailedResults(e)
+  }
+}
+
+function parseServerTestWorkerData(value: unknown): ServerTestWorkerData {
+  if (!isRecord(value) || typeof value.file !== 'string') {
+    throw new Error('Invalid server test worker data')
+  }
+
+  return {
+    file: value.file,
+    coverage: parseCoverageConfig(value.coverage),
+  }
+}
+
+export function isRecord(value: unknown): value is Record<string, unknown> {
+  return typeof value === 'object' && value !== null
+}
+
+export function parseCoverageConfig(value: unknown): CoverageConfig | undefined {
+  if (value === undefined) {
+    return undefined
+  }
+
+  if (!isRecord(value) || typeof value.dir !== 'string') {
+    throw new Error('Invalid server test worker coverage config')
+  }
+
+  let coverage: CoverageConfig = {
+    dir: value.dir,
+  }
+  let include = parseStringArray(value.include, 'include')
+  let exclude = parseStringArray(value.exclude, 'exclude')
+  let statements = parseNumber(value.statements, 'statements')
+  let lines = parseNumber(value.lines, 'lines')
+  let branches = parseNumber(value.branches, 'branches')
+  let functions = parseNumber(value.functions, 'functions')
+
+  if (include) coverage.include = include
+  if (exclude) coverage.exclude = exclude
+  if (statements !== undefined) coverage.statements = statements
+  if (lines !== undefined) coverage.lines = lines
+  if (branches !== undefined) coverage.branches = branches
+  if (functions !== undefined) coverage.functions = functions
+
+  return coverage
+}
+
+function parseStringArray(value: unknown, name: string): string[] | undefined {
+  if (value === undefined) {
+    return undefined
+  }
+
+  if (!Array.isArray(value) || value.some((item) => typeof item !== 'string')) {
+    throw new Error(`Invalid server test worker coverage ${name}`)
+  }
+
+  return value
+}
+
+function parseNumber(value: unknown, name: string): number | undefined {
+  if (value === undefined) {
+    return undefined
+  }
+
+  if (typeof value !== 'number') {
+    throw new Error(`Invalid server test worker coverage ${name}`)
+  }
+
+  return value
+}
+
+async function takeCoverage(coverage: CoverageConfig | undefined): Promise<void> {
+  if (coverage && !IS_BUN) {
+    let v8 = await import('node:v8')
+    v8.takeCoverage()
+  }
+}

package/src/lib/worker.ts

@@ -1,30 +1,10 @@
-import { workerData, parentPort } from 'node:worker_threads'
-import { tsImport } from 'tsx/esm/api'
-import { runTests, type TestResults } from './executor.ts'
+import { parentPort, workerData } from 'node:worker_threads'
+import { runServerTestFile } from './worker-server.ts'
 
-try {
-  await tsImport(workerData.file, import.meta.url)
-
-  let results = await runTests()
-  parentPort!.postMessage(results)
-} catch (e) {
-  let results: TestResults = {
-    passed: 0,
-    failed: 1,
-    skipped: 0,
-    todo: 0,
-    tests: [
-      {
-        name: '',
-        suiteName: '',
-        status: 'failed',
-        duration: 0,
-        error: {
-          message: e instanceof Error ? e.message : String(e),
-          stack: e instanceof Error ? e.stack : undefined,
-        },
-      },
-    ],
-  }
-  parentPort!.postMessage(results)
+if (!parentPort) {
+  throw new Error('Server test worker is missing a parent port')
 }
+
+const results = await runServerTestFile(workerData)
+parentPort.postMessage(results)
+process.exit(0)

package/src/test/coverage/fixture.ts

@@ -0,0 +1,34 @@
+// This file exists solely to validate coverage accuracy.
+// Each function has a known expected coverage profile based on
+// which paths the associated tests exercise.
+
+// Fully covered — both statements and the single branch
+export function add(a: number, b: number): number {
+  return a + b
+}
+
+// Partially covered — only the `n > 0` branch is tested
+export function classify(n: number): string {
+  if (n > 0) {
+    return 'positive'
+  } else if (n < 0) {
+    return 'negative'
+  } else {
+    return 'zero'
+  }
+}
+
+// Never called — 0% across the board
+export function uncalledFunction(): string {
+  let result = 'never'
+  result += ' reached'
+  return result
+}
+
+// Partially covered — only the truthy `name` branch is tested
+export function greet(name?: string): string {
+  if (name) {
+    return `Hello, ${name}!`
+  }
+  return 'Hello, stranger!'
+}

package/src/test/coverage/test-browser.ts

@@ -0,0 +1,29 @@
+import * as assert from '@remix-run/assert'
+import { describe, it } from '../../lib/framework.ts'
+import { add, classify, greet } from './fixture.ts'
+
+// Expected coverage for coverage-fixture.ts (same as the server/e2e fixture
+// tests):
+//
+//   add             — 100% functions, statements, lines, branches
+//   classify        — function covered, but only the `n > 0` branch is hit
+//                     (the `n < 0` and `else` branches are uncovered)
+//   uncalledFunction — 0% across the board (never imported)
+//   greet           — function covered, but only the truthy `name` branch is hit
+//                     (the fallback `Hello, stranger!` line is uncovered)
+
+describe('browser coverage fixture', () => {
+  it('exercises some but not all code paths in the browser', () => {
+    assert.equal(add(2, 3), 5)
+    assert.equal(add(-1, 1), 0)
+
+    assert.equal(classify(42), 'positive')
+    assert.equal(classify(1), 'positive')
+    // deliberately NOT testing classify(-1) or classify(0)
+
+    assert.equal(greet('World'), 'Hello, World!')
+    // deliberately NOT testing greet() without an argument
+
+    // deliberately NOT importing or calling uncalledFunction
+  })
+})

package/src/test/coverage/test-e2e.ts

@@ -0,0 +1,70 @@
+import * as assert from '@remix-run/assert'
+import { createTestServer } from '@remix-run/node-fetch-server/test'
+import * as fsp from 'node:fs/promises'
+import * as path from 'node:path'
+import { describe, it } from '../../lib/framework.ts'
+import { transformTypeScript } from '../../lib/ts-transform.ts'
+
+// Expected coverage for coverage/fixture.ts (same as the server fixture test):
+//
+//   add             — 100% functions, statements, lines, branches
+//   classify        — function covered, but only the `n > 0` branch is hit
+//   uncalledFunction — 0% across the board (never called)
+//   greet           — function covered, but only the truthy `name` branch is hit
+
+describe('e2e coverage fixture', () => {
+  it('exercises some but not all code paths in the browser', async (t) => {
+    // Compile the fixture TypeScript to browser-ready JS
+    let fixturePath = path.resolve(import.meta.dirname, './fixture.ts')
+    let fixtureSource = await fsp.readFile(fixturePath, 'utf-8')
+    let { code: fixtureJs } = await transformTypeScript(fixtureSource, fixturePath)
+
+    let handler: (request: Request) => Response = (req) => {
+      let url = new URL(req.url)
+
+      if (url.pathname === '/') {
+        return new Response(
+          [
+            `<!doctype html>`,
+            `<html>`,
+            `<body>`,
+            `  <div id="result"></div>`,
+            `  <script type="module">`,
+            `    import { add, classify, greet } from '/src/test/coverage/fixture.ts'`,
+            `    // Exercise the same paths as the server fixture test:`,
+            `    // - add: fully covered`,
+            `    // - classify: only positive branch`,
+            `    // - greet: only with a name`,
+            `    // - uncalledFunction: never imported`,
+            `    let results = [`,
+            `      add(2, 3),`,
+            `      add(-1, 1),`,
+            `      classify(42),`,
+            `      classify(1),`,
+            `      greet('World'),`,
+            `    ]`,
+            `    document.getElementById('result').textContent = results.join(',')`,
+            `  </script>`,
+            `</body>`,
+            `</html>`,
+          ].join('\n'),
+          { headers: { 'Content-Type': 'text/html' } },
+        )
+      }
+
+      // Serve the compiled fixture at the path the import expects
+      if (url.pathname === '/src/test/coverage/fixture.ts') {
+        return new Response(fixtureJs, {
+          headers: { 'Content-Type': 'application/javascript' },
+        })
+      }
+
+      return new Response('Not found', { status: 404 })
+    }
+    let page = await t.serve(await createTestServer(handler))
+
+    await page.goto('/')
+    let result = await page.locator('#result').textContent()
+    assert.equal(result, '5,0,positive,positive,Hello, World!')
+  })
+})

package/src/test/coverage/test-unit.ts

@@ -0,0 +1,32 @@
+import * as assert from '@remix-run/assert'
+import { describe, it } from '../../lib/framework.ts'
+import { add, classify, greet } from './fixture.ts'
+
+// Expected coverage for coverage-fixture.ts:
+//
+//   add             — 100% functions, statements, lines, branches
+//   classify        — function covered, but only the `n > 0` branch is hit
+//                     (the `n < 0` and `else` branches are uncovered)
+//   uncalledFunction — 0% across the board (never imported)
+//   greet           — function covered, but only the truthy `name` branch is hit
+//                     (the fallback `Hello, stranger!` line is uncovered)
+
+describe('coverage/fixture.ts', () => {
+  it('add returns the sum', () => {
+    assert.equal(add(2, 3), 5)
+    assert.equal(add(-1, 1), 0)
+  })
+
+  it('classify identifies positive numbers only', () => {
+    assert.equal(classify(42), 'positive')
+    assert.equal(classify(1), 'positive')
+    // deliberately NOT testing classify(-1) or classify(0)
+  })
+
+  // deliberately NOT importing or calling uncalledFunction
+
+  it('greet with a name only', () => {
+    assert.equal(greet('World'), 'Hello, World!')
+    // deliberately NOT testing greet() without an argument
+  })
+})

package/tsconfig.json

@@ -2,13 +2,15 @@
   "compilerOptions": {
     "strict": true,
     "lib": ["ES2024", "DOM", "DOM.Iterable"],
+    "types": ["node", "dom-navigation"],
     "module": "ES2022",
     "moduleResolution": "Bundler",
     "target": "ESNext",
     "allowImportingTsExtensions": true,
     "rewriteRelativeImportExtensions": true,
     "verbatimModuleSyntax": true,
+    "skipLibCheck": true,
     "jsx": "react-jsx",
-    "jsxImportSource": "@remix-run/component"
+    "jsxImportSource": "@remix-run/ui"
   }
 }

package/dist/lib/e2e-server.d.ts

@@ -1,11 +0,0 @@
-export interface CreateServerFunction {
-    (handler: (req: Request) => Promise<Response>): Promise<{
-        baseUrl: string;
-        close(): Promise<void>;
-    }>;
-}
-export declare function createServer(handler: (req: Request) => Promise<Response>): Promise<{
-    baseUrl: string;
-    close(): Promise<void>;
-}>;
-//# sourceMappingURL=e2e-server.d.ts.map

package/dist/lib/e2e-server.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"e2e-server.d.ts","sourceRoot":"","sources":["../../src/lib/e2e-server.ts"],"names":[],"mappings":"AAGA,MAAM,WAAW,oBAAoB;IACnC,CAAC,OAAO,EAAE,CAAC,GAAG,EAAE,OAAO,KAAK,OAAO,CAAC,QAAQ,CAAC,GAAG,OAAO,CAAC;QACtD,OAAO,EAAE,MAAM,CAAA;QACf,KAAK,IAAI,OAAO,CAAC,IAAI,CAAC,CAAA;KACvB,CAAC,CAAA;CACH;AAED,wBAAgB,YAAY,CAAC,OAAO,EAAE,CAAC,GAAG,EAAE,OAAO,KAAK,OAAO,CAAC,QAAQ,CAAC,GAAG,OAAO,CAAC;IAClF,OAAO,EAAE,MAAM,CAAA;IACf,KAAK,IAAI,OAAO,CAAC,IAAI,CAAC,CAAA;CACvB,CAAC,CAcD"}

package/dist/lib/e2e-server.js

@@ -1,15 +0,0 @@
-import * as http from 'node:http';
-import { createRequestListener } from '@remix-run/node-fetch-server';
-export function createServer(handler) {
-    return new Promise((resolve, reject) => {
-        let server = http.createServer(createRequestListener(handler));
-        server.listen(0, '127.0.0.1', () => {
-            let addr = server.address();
-            resolve({
-                baseUrl: `http://127.0.0.1:${addr.port}`,
-                close: () => new Promise((r, rj) => server.close((e) => (e ? rj(e) : r()))),
-            });
-        });
-        server.on('error', reject);
-    });
-}

package/dist/lib/framework.test.d.ts

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=framework.test.d.ts.map

package/dist/lib/framework.test.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"framework.test.d.ts","sourceRoot":"","sources":["../../src/lib/framework.test.tsx"],"names":[],"mappings":""}