@barefootjs/hono 0.30.6 → 0.31.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@barefootjs/hono",
-  "version": "0.30.6",
+  "version": "0.31.0",
   "description": "Hono integration for BarefootJS",
   "type": "module",
   "main": "./dist/index.js",
@@ -38,10 +38,6 @@
       "types": "./dist/preload.d.ts",
       "import": "./dist/preload.js"
     },
-    "./dev": {
-      "types": "./dist/dev.d.ts",
-      "import": "./dist/dev.js"
-    },
     "./dev-worker": {
       "types": "./dist/dev-worker.d.ts",
       "import": "./dist/dev-worker.js"
@@ -65,9 +61,9 @@
     "./test-render": {
       "bun": "./src/test-render.ts"
     },
-    "./build": {
-      "types": "./dist/build.d.ts",
-      "import": "./dist/build.js"
+    "./vite": {
+      "types": "./dist/vite.d.ts",
+      "import": "./dist/vite.js"
     },
     "./app": {
       "types": "./dist/app.d.ts",
@@ -88,7 +84,7 @@
   ],
   "scripts": {
     "build": "bun run build:js && bun run build:types",
-    "build:js": "bun build ./src/index.ts ./src/adapter/index.ts ./src/scripts.tsx ./src/portals.tsx ./src/portal-ssr.tsx ./src/dialog-context.tsx ./src/client-shim.ts ./src/preload.tsx ./src/dev.tsx ./src/dev-worker.ts ./src/jsx/jsx-runtime/index.ts ./src/jsx/jsx-dev-runtime/index.ts ./src/async.tsx ./src/utils.ts ./src/build.ts ./src/app.ts ./src/render.ts ./src/request-env.ts --root ./src --outdir ./dist --format esm --external hono --external @barefootjs/client --external @barefootjs/jsx --external @barefootjs/shared",
+    "build:js": "bun build ./src/index.ts ./src/adapter/index.ts ./src/scripts.tsx ./src/portals.tsx ./src/portal-ssr.tsx ./src/dialog-context.tsx ./src/client-shim.ts ./src/preload.tsx ./src/dev-worker.ts ./src/jsx/jsx-runtime/index.ts ./src/jsx/jsx-dev-runtime/index.ts ./src/async.tsx ./src/utils.ts ./src/app.ts ./src/render.ts ./src/request-env.ts --root ./src --outdir ./dist --format esm --external hono --external @barefootjs/client --external @barefootjs/jsx --external @barefootjs/shared --external @barefootjs/vite --external vite && bun build ./src/vite.ts --outfile ./dist/vite.js --format esm --target node --external @barefootjs/vite --external vite --external typescript",
     "build:types": "tsgo --emitDeclarationOnly --outDir ./dist",
     "test": "bun test",
     "clean": "rm -rf dist",
@@ -112,13 +108,25 @@
     "@barefootjs/client": ">=0.2.0",
     "@barefootjs/jsx": ">=0.2.0",
     "@barefootjs/shared": ">=0.2.0",
-    "hono": "^4.0.0"
+    "@barefootjs/vite": ">=0.2.0",
+    "hono": "^4.0.0",
+    "vite": "^6.0.0"
+  },
+  "peerDependenciesMeta": {
+    "@barefootjs/vite": {
+      "optional": true
+    },
+    "vite": {
+      "optional": true
+    }
   },
   "devDependencies": {
     "@barefootjs/adapter-tests": "0.1.0",
+    "@barefootjs/vite": "0.31.0",
     "@types/jsdom": "^27.0.0",
     "hono": "^4.6.0",
     "jsdom": "^27.3.0",
-    "typescript": "^5.0.0"
+    "typescript": "^5.0.0",
+    "vite": "^6.0.0"
   }
 }

package/src/__tests__/scaffold.test.ts

@@ -124,15 +124,22 @@ describe.skipIf(!INTEGRATION)(
       expect(wrangler.name).toBe('demo-app')
     })
 
-    test('dev script wires bf build --watch + unocss + wrangler dev --live-reload', () => {
+    test('dev script wires vite dev + unocss + wrangler dev --live-reload', () => {
       const pkg = JSON.parse(
         readFileSync(path.join(projectDir, 'package.json'), 'utf-8'),
       ) as { scripts?: Record<string, string> }
-      expect(pkg.scripts?.dev).toContain('bf build --watch')
+      expect(pkg.scripts?.dev).toContain('vite build')
+      expect(pkg.scripts?.dev).toContain('vite dev')
       expect(pkg.scripts?.dev).toContain('unocss --watch')
       expect(pkg.scripts?.dev).toContain('wrangler dev --live-reload')
     })
 
+    test('vite.config.ts composes @barefootjs/hono/vite', () => {
+      const cfg = readFileSync(path.join(projectDir, 'vite.config.ts'), 'utf-8')
+      expect(cfg).toContain("from '@barefootjs/hono/vite'")
+      expect(cfg).toContain("base: '/components/'")
+    })
+
     test('deploy script targets Cloudflare Workers', () => {
       expect(result.stdout).toContain('Deploy:')
       expect(result.stdout).toMatch(/npm run deploy\s+# deploy to Cloudflare Workers/)

package/src/__tests__/script-assets.test.ts

@@ -0,0 +1,228 @@
+/**
+ * Coverage of `HonoAdapter.generate()`'s `AdapterGenerateOptions.scriptAssets`
+ * handling (see `scripts.tsx`'s `registerComponentScripts`/
+ * `wrapWithInlineScripts` docstrings and `hono-adapter.ts`'s `scriptAssets`
+ * field docstring for the full design).
+ *
+ * Mirrors `GoTemplateAdapter`'s own `scriptAssets` contract: `undefined` →
+ * no scriptAssets-driven output at all; `[]` → resolved, but nothing to
+ * register (server-only file, or a client file whose bundle isn't in the
+ * manifest yet) — no dead codegen; non-empty → bake exactly these URLs in
+ * via `registerComponentScripts`.
+ */
+import { describe, test, expect } from 'bun:test'
+import { compileJSX } from '@barefootjs/jsx'
+import type { ComponentIR } from '@barefootjs/jsx'
+import { HonoAdapter } from '../adapter'
+
+function compileMarkedTemplate(source: string, scriptAssets: string[] | undefined, file = 'Demo.tsx'): string {
+  const adapter = new HonoAdapter()
+  const result = compileJSX(source, file, { adapter, scriptAssets })
+  const errors = result.errors.filter((e) => e.severity === 'error')
+  expect(errors).toEqual([])
+  const tmpl = result.files.find((f) => f.type === 'markedTemplate')
+  expect(tmpl).toBeDefined()
+  return tmpl!.content
+}
+
+const CLIENT_COMPONENT = `'use client'
+import { createSignal } from '@barefootjs/client'
+
+export function Counter(props: { initial: number }) {
+  const [count, setCount] = createSignal(props.initial)
+  return <button onClick={() => setCount(count() + 1)}>{count()}</button>
+}
+`
+
+const CLIENT_COMPONENT_IF_ROOT = `'use client'
+import { createSignal } from '@barefootjs/client'
+
+export function Toggle(props: { asChild?: boolean }) {
+  const [open, setOpen] = createSignal(false)
+
+  if (props.asChild) {
+    return <span onClick={() => setOpen(!open())}>child</span>
+  }
+
+  return <button onClick={() => setOpen(!open())}>toggle</button>
+}
+`
+
+describe('HonoAdapter scriptAssets codegen', () => {
+  test('undefined scriptAssets: no scriptAssets-driven codegen at all', () => {
+    const output = compileMarkedTemplate(CLIENT_COMPONENT, undefined)
+    expect(output).not.toContain('registerComponentScripts')
+    expect(output).not.toContain('wrapWithInlineScripts')
+    expect(output).not.toContain("@barefootjs/hono/scripts'")
+  })
+
+  test('empty scriptAssets: resolved-but-empty emits no registration codegen', () => {
+    const output = compileMarkedTemplate(CLIENT_COMPONENT, [])
+    expect(output).not.toContain('registerComponentScripts')
+    expect(output).not.toContain('wrapWithInlineScripts')
+  })
+
+  test('non-empty scriptAssets: bakes registerComponentScripts + wraps the return, no separate runtime script', () => {
+    const output = compileMarkedTemplate(CLIENT_COMPONENT, ['/static/build/assets/Counter-abc123.js'])
+
+    expect(output).toContain("import { registerComponentScripts, wrapWithInlineScripts } from '@barefootjs/hono/scripts'")
+    expect(output).toContain('const __bfInlineScripts = registerComponentScripts(["/static/build/assets/Counter-abc123.js"])')
+    expect(output).toContain('return wrapWithInlineScripts((')
+    expect(output).toContain('), __bfInlineScripts)')
+    // No hand-rolled `barefoot.js` registration — the runtime is a shared
+    // ESM chunk the resolved entry already imports.
+    expect(output).not.toContain('barefoot.js')
+  })
+
+  test('multiple scriptAssets URLs are all baked into one registerComponentScripts call', () => {
+    const output = compileMarkedTemplate(CLIENT_COMPONENT, [
+      'http://localhost:5173/@vite/client',
+      'http://localhost:5173/src/components/Counter.tsx',
+    ])
+    expect(output).toContain(
+      'registerComponentScripts(["http://localhost:5173/@vite/client","http://localhost:5173/src/components/Counter.tsx"])',
+    )
+  })
+
+  test('if-statement root: both branches wrap their return with wrapWithInlineScripts', () => {
+    const output = compileMarkedTemplate(CLIENT_COMPONENT_IF_ROOT, ['/static/build/assets/Toggle-abc123.js'])
+
+    const wrapOpens = output.match(/return wrapWithInlineScripts\(\(/g) ?? []
+    const wrapCloses = output.match(/\), __bfInlineScripts\)/g) ?? []
+    // One wrapped return per branch (the `if` consequent and the trailing
+    // `return (...)` alternate) — an if-statement root never emits a bare,
+    // unwrapped `return (`.
+    expect(wrapOpens.length).toBe(2)
+    expect(wrapCloses.length).toBe(2)
+    // No branch falls back to a bare, unwrapped `return (`.
+    expect(output).not.toMatch(/return \(\n/)
+  })
+})
+
+/**
+ * Coverage of `HonoAdapter.generate()`'s `AdapterGenerateOptions.preloadAssets`
+ * handling — the sibling option to `scriptAssets` above. See
+ * `scripts.tsx`'s `registerComponentPreloads`/`wrapWithInlineScripts`
+ * docstrings and `hono-adapter.ts`'s `preloadAssets` field docstring for
+ * the full design.
+ *
+ * Same `undefined`/`[]`/non-empty contract as `scriptAssets`, with the
+ * added constraint that `preloadAssets` is only meaningful alongside a
+ * non-empty `scriptAssets` — see `AdapterGenerateOptions.preloadAssets`.
+ */
+/** IR for a source, for the tests that drive `generate()` directly rather
+ * than through `compileJSX` — `AdapterGenerateOptions`-only fields (e.g.
+ * `skipScriptRegistration`) have no `CompileOptions` counterpart to travel
+ * through. Mirrors the same helper in every other adapter's suite. */
+function compileToIR(source: string): ComponentIR {
+  const result = compileJSX(source.trimStart(), 'test.tsx', {
+    adapter: new HonoAdapter(),
+    outputIR: true,
+  })
+  const irFile = result.files.find(f => f.type === 'ir')
+  if (!irFile) throw new Error('No IR output')
+  return JSON.parse(irFile.content) as ComponentIR
+}
+
+function compileMarkedTemplateWithPreloads(
+  source: string,
+  scriptAssets: string[] | undefined,
+  preloadAssets: string[] | undefined,
+  file = 'Demo.tsx',
+): string {
+  const adapter = new HonoAdapter()
+  const result = compileJSX(source, file, { adapter, scriptAssets, preloadAssets })
+  const errors = result.errors.filter((e) => e.severity === 'error')
+  expect(errors).toEqual([])
+  const tmpl = result.files.find((f) => f.type === 'markedTemplate')
+  expect(tmpl).toBeDefined()
+  return tmpl!.content
+}
+
+describe('HonoAdapter preloadAssets codegen', () => {
+  test('preloadAssets bakes registerComponentPreloads and wraps the return with the preload list, before the script registration', () => {
+    const output = compileMarkedTemplateWithPreloads(
+      CLIENT_COMPONENT,
+      ['/static/build/assets/Counter-abc123.js'],
+      ['/static/build/assets/index-def456.js', '/static/build/assets/TodoItem-ghi789.js'],
+    )
+
+    expect(output).toContain("import { registerComponentScripts, registerComponentPreloads, wrapWithInlineScripts } from '@barefootjs/hono/scripts'")
+    expect(output).toContain(
+      'const __bfInlinePreloads = registerComponentPreloads(["/static/build/assets/index-def456.js","/static/build/assets/TodoItem-ghi789.js"])',
+    )
+    const preloadIdx = output.indexOf('registerComponentPreloads(')
+    const scriptIdx = output.indexOf('registerComponentScripts(')
+    expect(preloadIdx).toBeGreaterThanOrEqual(0)
+    expect(scriptIdx).toBeGreaterThan(preloadIdx)
+    expect(output).toContain('return wrapWithInlineScripts((')
+    expect(output).toContain('), __bfInlineScripts, __bfInlinePreloads)')
+  })
+
+  test('preloadAssets: [] emits no registerComponentPreloads codegen', () => {
+    const output = compileMarkedTemplateWithPreloads(
+      CLIENT_COMPONENT,
+      ['/static/build/assets/Counter-abc123.js'],
+      [],
+    )
+    expect(output).not.toContain('registerComponentPreloads')
+    expect(output).not.toContain('__bfInlinePreloads')
+    // scriptAssets codegen is unaffected — same wrap shape as before.
+    expect(output).toContain('), __bfInlineScripts)')
+  })
+
+  test('preloadAssets: undefined emits no registerComponentPreloads codegen', () => {
+    const output = compileMarkedTemplateWithPreloads(
+      CLIENT_COMPONENT,
+      ['/static/build/assets/Counter-abc123.js'],
+      undefined,
+    )
+    expect(output).not.toContain('registerComponentPreloads')
+    expect(output).not.toContain('__bfInlinePreloads')
+    expect(output).toContain('), __bfInlineScripts)')
+  })
+
+  test('preloadAssets is ignored when scriptAssets is empty (only meaningful alongside a non-empty scriptAssets)', () => {
+    const output = compileMarkedTemplateWithPreloads(CLIENT_COMPONENT, [], ['/static/build/assets/index-def456.js'])
+    expect(output).not.toContain('registerComponentPreloads')
+    expect(output).not.toContain('registerComponentScripts')
+  })
+
+  // `skipScriptRegistration` lives on `AdapterGenerateOptions`, NOT on
+  // `CompileOptions` — a parent adapter sets it when emitting a child, so it
+  // never travels through `compileJSX`. Exercising it therefore means calling
+  // `generate()` directly, the same way every other adapter's suite does.
+  //
+  // Note what actually enforces this: `hasPreloadAssets()` is conjoined with
+  // `hasScriptAssets()`, so suppressing scripts suppresses preloads
+  // structurally — mutating the `skipScriptRegistration` branch alone cannot
+  // make this test fail. The independent guarantee is pinned by the
+  // "ignored when scriptAssets is empty" test above, which DOES go red when
+  // that conjunct is dropped. Both are kept: this one states the intent a
+  // reader looks for, that one holds the line.
+  test('skipScriptRegistration suppresses the preload registration as well as the script registration', () => {
+    const ir = compileToIR(CLIENT_COMPONENT)
+    const { template } = new HonoAdapter().generate(ir, {
+      skipScriptRegistration: true,
+      scriptAssets: ['/static/build/assets/Counter-abc123.js'],
+      preloadAssets: ['/static/build/assets/index-def456.js'],
+    })
+    expect(template).not.toContain('registerComponentPreloads')
+    expect(template).not.toContain('registerComponentScripts')
+    expect(template).not.toContain('wrapWithInlineScripts')
+    expect(template).not.toContain("@barefootjs/hono/scripts'")
+  })
+
+  test('if-statement root: both branches wrap with wrapWithInlineScripts passing __bfInlinePreloads', () => {
+    const output = compileMarkedTemplateWithPreloads(
+      CLIENT_COMPONENT_IF_ROOT,
+      ['/static/build/assets/Toggle-abc123.js'],
+      ['/static/build/assets/index-def456.js'],
+    )
+
+    const wrapOpens = output.match(/return wrapWithInlineScripts\(\(/g) ?? []
+    const wrapCloses = output.match(/\), __bfInlineScripts, __bfInlinePreloads\)/g) ?? []
+    expect(wrapOpens.length).toBe(2)
+    expect(wrapCloses.length).toBe(2)
+  })
+})

package/src/__tests__/vite.test.ts

@@ -0,0 +1,144 @@
+/**
+ * Coverage of `@barefootjs/hono/vite`'s `barefoot()`:
+ *
+ * - one real `vite build()` end to end (mirrors `@barefootjs/go-template/
+ *   vite`'s own `vite.test.ts` rigor — a plugin that only passes mocked
+ *   unit tests hasn't been shown to work) against a checked-in fixture
+ *   (not a system tmpdir) so `@barefootjs/client` resolves through the
+ *   monorepo's real node_modules symlinks;
+ * - the `assets` → generated `bf-assets.ts` behavior, exercised the same
+ *   way (a real build, since it needs the real manifest Vite writes).
+ *
+ * Unlike Go, there is no `afterEmit`-driven combination step to test here
+ * (see `vite.ts`'s module docstring) — Hono's SSR template is
+ * self-contained per component, so `barefoot()` always returns a
+ * single-element array unless `assets` is set.
+ */
+import { describe, test, expect } from 'bun:test'
+import { build } from 'vite'
+import { mkdtemp, rm, readFile } from 'node:fs/promises'
+import { tmpdir } from 'node:os'
+import { join, resolve } from 'node:path'
+import { barefoot, barefoot as defaultBarefoot } from '../vite.ts'
+
+const FIXTURE_ROOT = resolve(import.meta.dirname, '../../e2e-fixture')
+
+describe('@barefootjs/hono/vite: real vite build', () => {
+  test('exports the same function as both named `barefoot` and default', () => {
+    expect(defaultBarefoot).toBe(barefoot)
+  })
+
+  test('returns a single-element plugin array when `assets` is omitted', () => {
+    const plugins = barefoot({ components: ['src/components'], templates: 'views' })
+    expect(plugins).toHaveLength(1)
+  })
+
+  // core's `barefoot()` attaches `api.options` (see `@barefootjs/vite`'s
+  // `BarefootPluginApi`) to the SAME plugin object this wrapper returns
+  // unchanged as `plugins[0]` — this pins that composition doesn't lose it,
+  // for either array shape (`assets` omitted vs. present, which adds a
+  // SECOND, unrelated companion plugin).
+  test('surfaces core\'s plugin.api.options unchanged on the returned plugin, with the HonoAdapter it constructed', () => {
+    const plugins = barefoot({ components: ['src/components', '../shared/blog'], templates: 'views' }) as any[]
+    const core = plugins[0]
+    expect(core.name).toBe('barefoot')
+    expect(core.api.options.components).toEqual(['src/components', '../shared/blog'])
+    expect(core.api.options.templates).toBe('views')
+    expect(core.api.options.adapter.constructor.name).toBe('HonoAdapter')
+  })
+
+  test('writes a self-contained SSR template with scriptAssets baked in, same as core alone would do', async () => {
+    const outDir = await mkdtemp(join(tmpdir(), 'barefoot-hono-vite-dist-'))
+    const templatesDir = await mkdtemp(join(tmpdir(), 'barefoot-hono-vite-views-'))
+
+    try {
+      await build({
+        configFile: false,
+        root: FIXTURE_ROOT,
+        base: '/static/build/',
+        logLevel: 'warn',
+        build: { outDir, emptyOutDir: true },
+        plugins: barefoot({
+          components: ['src/components'],
+          templates: templatesDir,
+        }),
+      })
+
+      const template = await readFile(join(templatesDir, 'Counter.tsx'), 'utf8')
+      // The scriptAssets-driven codegen path (see hono-adapter.ts).
+      expect(template).toContain('registerComponentScripts(')
+      expect(template).toContain("from '@barefootjs/hono/scripts'")
+      // No separate runtime registration — the shared `@barefootjs/client`
+      // chunk arrives as an ESM import the bundled entry already makes.
+      expect(template).not.toContain('barefoot.js')
+    } finally {
+      await rm(outDir, { recursive: true, force: true })
+      await rm(templatesDir, { recursive: true, force: true })
+    }
+  }, 60_000)
+
+  test('`assets` resolves a non-component entry\'s manifest-hashed URL into a generated `Assets` TS map', async () => {
+    const outDir = await mkdtemp(join(tmpdir(), 'barefoot-hono-vite-dist-assets-'))
+    const templatesDir = await mkdtemp(join(tmpdir(), 'barefoot-hono-vite-views-assets-'))
+    const assetsPath = join(FIXTURE_ROOT, 'dist/bf-assets.ts')
+
+    try {
+      await build({
+        configFile: false,
+        root: FIXTURE_ROOT,
+        base: '/static/build/',
+        logLevel: 'warn',
+        build: {
+          outDir,
+          emptyOutDir: true,
+          // Registering the non-component entry is the CALLER's job (stock
+          // Vite config) — `assets` below only resolves the URL Vite
+          // already bundled it to, it doesn't request the bundling.
+          rollupOptions: { input: { bootstrap: resolve(FIXTURE_ROOT, 'client/bootstrap.ts') } },
+        },
+        plugins: barefoot({
+          components: ['src/components'],
+          templates: templatesDir,
+          assets: { Bootstrap: 'client/bootstrap.ts' },
+        }),
+      })
+
+      const manifest = JSON.parse(await readFile(join(outDir, '.vite/manifest.json'), 'utf8'))
+      const expectedUrl = `/static/build/${manifest['client/bootstrap.ts'].file}`
+
+      const content = await readFile(assetsPath, 'utf8')
+      expect(content).toContain('export const Assets: Record<string, string>')
+      expect(content).toContain(`"Bootstrap": ${JSON.stringify(expectedUrl)}`)
+    } finally {
+      await rm(outDir, { recursive: true, force: true })
+      await rm(templatesDir, { recursive: true, force: true })
+      await rm(join(FIXTURE_ROOT, 'dist'), { recursive: true, force: true })
+    }
+  }, 60_000)
+
+  test('`assets` throws an actionable error when the entry was never registered as a Rollup input', async () => {
+    const outDir = await mkdtemp(join(tmpdir(), 'barefoot-hono-vite-dist-assets-missing-'))
+    const templatesDir = await mkdtemp(join(tmpdir(), 'barefoot-hono-vite-views-assets-missing-'))
+
+    try {
+      await expect(
+        build({
+          configFile: false,
+          root: FIXTURE_ROOT,
+          base: '/static/build/',
+          logLevel: 'silent',
+          build: { outDir, emptyOutDir: true },
+          plugins: barefoot({
+            components: ['src/components'],
+            templates: templatesDir,
+            assets: { Bootstrap: 'client/bootstrap.ts' },
+          }),
+        }),
+      ).rejects.toThrow(/was not found in the build manifest/)
+    } finally {
+      await rm(outDir, { recursive: true, force: true })
+      await rm(templatesDir, { recursive: true, force: true })
+      await rm(join(FIXTURE_ROOT, 'dist'), { recursive: true, force: true })
+    }
+  }, 60_000)
+})