@barefootjs/hono 0.30.6 → 0.31.1

package/src/__tests__/build.test.ts

@@ -1,299 +0,0 @@
-import { describe, test, expect } from 'bun:test'
-import { addScriptCollection, createConfig, maskComments } from '../build'
-
-// ── addScriptCollection ──────────────────────────────────────────────
-
-describe('addScriptCollection', () => {
-  test('injects imports and script collector into exported function', () => {
-    const input = `import { jsx } from 'hono/jsx'
-
-export function Counter(props: CounterProps) {
-  return (<div>hello</div>)
-}`
-
-    const result = addScriptCollection(input, 'Counter', 'Counter.client.js')
-
-    expect(result).toContain("import { useRequestContext } from 'hono/jsx-renderer'")
-    expect(result).toContain("import { Fragment } from 'hono/jsx'")
-    expect(result).toContain('__bfWrap')
-    expect(result).toContain('bfCollectedScripts')
-    expect(result).toContain("'Counter'")
-    expect(result).toContain('Counter.client.js')
-  })
-
-  test('preserves content when no import match', () => {
-    const input = 'const x = 1'
-    // Should not throw, returns unchanged or minimally modified
-    const result = addScriptCollection(input, 'Test', 'Test.client.js')
-    expect(result).toBeDefined()
-  })
-
-  test('uses custom scriptBasePath', () => {
-    const input = `import { jsx } from 'hono/jsx'
-
-export function Counter() {
-  return (<div>hello</div>)
-}`
-
-    const result = addScriptCollection(input, 'Counter', 'Counter.client.js', '/assets/js/')
-    expect(result).toContain('/assets/js/barefoot.js')
-    expect(result).toContain('/assets/js/Counter.client.js')
-    expect(result).not.toContain('/static/components/')
-  })
-
-  test('normalizes scriptBasePath without trailing slash', () => {
-    const input = `import { jsx } from 'hono/jsx'
-
-export function Counter() {
-  return (<div>hello</div>)
-}`
-
-    const result = addScriptCollection(input, 'Counter', 'Counter.client.js', '/assets/js')
-    expect(result).toContain('/assets/js/barefoot.js')
-    expect(result).toContain('/assets/js/Counter.client.js')
-  })
-
-  test('ignores `function PascalCase(` text inside JSDoc / inline comments (#1236)', () => {
-    // A docstring example previously triggered a bogus insertion when
-    // the function-pattern regex matched inside the comment, after
-    // which the paren counter walked into the wrong `{` and corrupted
-    // a real function further down.
-    const input = `import { jsx } from 'hono/jsx'
-
-export interface MyProps {
-  /**
-   * Example imperative signature for the docs:
-   *   function MyNode(this: HTMLElement, props): void
-   */
-  nodeTypes?: Record<string, unknown>
-}
-
-// also: function FakeFromLineComment(this: any) {} should not match
-
-export function Counter(props: MyProps) {
-  return (<div>hello</div>)
-}`
-
-    const result = addScriptCollection(input, 'Counter', 'Counter.client.js')
-
-    // The real Counter must be wrapped exactly once.
-    const collectorCount = (result.match(/let __bfInlineScripts/g) || []).length
-    expect(collectorCount).toBe(1)
-
-    // And the collector must land inside Counter's body, immediately after
-    // its opening brace — the same shape the destructured-params test
-    // above verifies. If the comment matches had fired, the collector
-    // would be misplaced inside the interface or the JSDoc.
-    const counterBodyMatch = result.match(/function Counter\(props: MyProps\)\s*\{/)
-    expect(counterBodyMatch).not.toBeNull()
-    if (counterBodyMatch) {
-      const after = result.slice(result.indexOf(counterBodyMatch[0]) + counterBodyMatch[0].length)
-      expect(after.trimStart().startsWith('let __bfInlineScripts')).toBe(true)
-    }
-  })
-
-  test('still finds function declarations after JSX text with apostrophes (#1236)', () => {
-    // Defensive: an unbalanced `'` inside JSX text content (e.g.
-    // `How's it going`) used to cause an over-aggressive string-mask
-    // to blank everything until the next stray `'`, hiding later
-    // function declarations from the regex. Keep apostrophe-containing
-    // JSX text unmasked so subsequent functions still get instrumented.
-    const input = `import { jsx } from 'hono/jsx'
-
-export function Greeting() {
-  return (<div>Hey! How's it going?</div>)
-}
-
-export function Footer() {
-  return (<div>Bye</div>)
-}`
-
-    const result = addScriptCollection(input, 'page', 'page-abc.js')
-
-    // BOTH functions must be wrapped.
-    const collectorCount = (result.match(/let __bfInlineScripts/g) || []).length
-    expect(collectorCount).toBe(2)
-    expect(result).toMatch(/function Greeting\(\)\s*\{\s*\n?\s*let __bfInlineScripts/)
-    expect(result).toMatch(/function Footer\(\)\s*\{\s*\n?\s*let __bfInlineScripts/)
-  })
-
-  test('handles destructured params with arrow function defaults', () => {
-    const input = `import { jsx } from 'hono/jsx'
-
-export function Textarea({ className = '', onInput = () => {}, onChange = () => {}, ...props }: TextareaProps) {
-  return (<textarea class={className} {...props} />)
-}`
-
-    const result = addScriptCollection(input, 'textarea', 'textarea-abc123.js')
-
-    // Script collector must be inside the Textarea function body, NOT inside a default param
-    expect(result).toContain('__bfInlineScripts')
-    expect(result).toContain('__bfWrap')
-
-    // Verify __bfInlineScripts is declared AFTER the function opening brace,
-    // not inside an arrow function default value
-    const funcBodyMatch = result.match(/\.\.\.props\s*\}\s*:\s*TextareaProps\)\s*\{/)
-    expect(funcBodyMatch).not.toBeNull()
-    // After the function body opening, the next thing should be the script collector
-    if (funcBodyMatch) {
-      const afterFuncBody = result.slice(result.indexOf(funcBodyMatch[0]) + funcBodyMatch[0].length)
-      expect(afterFuncBody.trimStart().startsWith('let __bfInlineScripts')).toBe(true)
-    }
-  })
-})
-
-// ── createConfig() factory ──────────────────────────────────────────
-
-describe('createConfig()', () => {
-  test('creates config with HonoAdapter', () => {
-    const config = createConfig()
-    expect(config.adapter.name).toBe('hono')
-  })
-
-  test('sets transformMarkedTemplate by default', () => {
-    const config = createConfig()
-    expect(typeof config.transformMarkedTemplate).toBe('function')
-  })
-
-  test('disables transformMarkedTemplate when scriptCollection is false', () => {
-    const config = createConfig({ scriptCollection: false })
-    expect(config.transformMarkedTemplate).toBeUndefined()
-  })
-
-  test('uses custom scriptBasePath in transformMarkedTemplate', () => {
-    const config = createConfig({ scriptBasePath: '/assets/js/' })
-    const input = `import { jsx } from 'hono/jsx'
-
-export function Counter() {
-  return (<div>hello</div>)
-}`
-    const result = config.transformMarkedTemplate!(input, 'Counter', 'Counter.client.js')
-    expect(result).toContain('/assets/js/barefoot.js')
-    expect(result).toContain('/assets/js/Counter.client.js')
-    expect(result).not.toContain('/static/components/')
-  })
-
-  test('uses default scriptBasePath in transformMarkedTemplate', () => {
-    const config = createConfig()
-    const input = `import { jsx } from 'hono/jsx'
-
-export function Counter() {
-  return (<div>hello</div>)
-}`
-    const result = config.transformMarkedTemplate!(input, 'Counter', 'Counter.client.js')
-    expect(result).toContain('/static/components/barefoot.js')
-    expect(result).toContain('/static/components/Counter.client.js')
-  })
-
-  test('passes through build options', () => {
-    const config = createConfig({
-      components: ['src'],
-      outDir: 'build',
-      minify: true,
-      contentHash: true,
-    })
-    expect(config.components).toEqual(['src'])
-    expect(config.outDir).toBe('build')
-    expect(config.minify).toBe(true)
-    expect(config.contentHash).toBe(true)
-  })
-
-  test('passes through externals and externalsBasePath', () => {
-    const externals = { react: { url: 'https://cdn.example.com/react.js' } }
-    const config = createConfig({
-      externals,
-      externalsBasePath: '/cdn/',
-    })
-    expect(config.externals).toBe(externals)
-    expect(config.externalsBasePath).toBe('/cdn/')
-  })
-
-  test('externals and externalsBasePath default to undefined', () => {
-    const config = createConfig()
-    expect(config.externals).toBeUndefined()
-    expect(config.externalsBasePath).toBeUndefined()
-  })
-
-  test('passes through localImportPrefixes', () => {
-    const config = createConfig({ localImportPrefixes: ['@/', '@ui/'] })
-    expect(config.localImportPrefixes).toEqual(['@/', '@ui/'])
-  })
-
-  test('localImportPrefixes defaults to undefined', () => {
-    const config = createConfig()
-    expect(config.localImportPrefixes).toBeUndefined()
-  })
-})
-
-// ── maskComments ────────────────────────────────────────────────────
-
-describe('maskComments', () => {
-  test('preserves length and newlines so indices stay valid in the original', () => {
-    const src = '/* foo */ x // bar\ny\n/* multi\nline */ z'
-    const masked = maskComments(src)
-    expect(masked).toHaveLength(src.length)
-    // Every newline position in the original is preserved in the masked
-    // copy, so line counts (and therefore line:column error reporting
-    // from downstream tools) line up.
-    const newlinePositions = (s: string) => [...s].flatMap((c, i) => c === '\n' ? [i] : [])
-    expect(newlinePositions(masked)).toEqual(newlinePositions(src))
-  })
-
-  test('blanks JSDoc / block comments including any quotes inside', () => {
-    const comment = "/** has 'apostrophe' inside */"
-    const tail = ' const x = 1'
-    const src = comment + tail
-    const masked = maskComments(src)
-    // The whole `/** ... */` is replaced with spaces; the apostrophes
-    // inside cannot re-open as strings later.
-    expect(masked).toBe(' '.repeat(comment.length) + tail)
-  })
-
-  test('blanks `//` line comments up to (but not including) the newline', () => {
-    const comment = '// ignored'
-    const tail = '\nconst x = 1'
-    const src = comment + tail
-    const masked = maskComments(src)
-    expect(masked).toBe(' '.repeat(comment.length) + tail)
-  })
-
-  test('handles unclosed block comment by masking through end of input', () => {
-    const src = 'a /* never closed\nfunction Real() {}'
-    const masked = maskComments(src)
-    // Without `*/`, the masker blanks to EOF. `function Real()` is
-    // hidden — this matches the JS lexer's behaviour for unterminated
-    // comments and is the conservative thing to do for the
-    // function-pattern regex.
-    expect(masked.startsWith('a ')).toBe(true)
-    expect(masked).not.toContain('function Real')
-    expect(masked).toHaveLength(src.length)
-  })
-
-  test('leaves comment-free code untouched (no false positives on JSX text)', () => {
-    // Plain code with no comment delimiters round-trips identically.
-    // JSX text with apostrophes (`How's`) is the hot path: a
-    // string-aware masker would treat the `'` as an open quote and
-    // blank the rest of the file, hiding later function declarations
-    // (#1236 follow-up).
-    const src = `export function Greeting() {\n  return (<div>Hey! How's it going?</div>)\n}\nexport function Footer() {}`
-    expect(maskComments(src)).toBe(src)
-  })
-
-  test('KNOWN LIMITATION: `//` inside a string is still treated as a line comment', () => {
-    // Documented in `maskComments` jsdoc: this helper does not track
-    // string boundaries, so a `//` appearing inside a string literal
-    // is still treated as a comment delimiter. SSR template output
-    // (the only current caller) does not produce such cases, so the
-    // simpler implementation is acceptable. If a future caller can
-    // produce them, swap in a real lexer — this test will start to
-    // fail and force the conversation.
-    const prefix = `const u = "https:`
-    const blanked = `//example.com" ; const x = 1`
-    const src = prefix + blanked
-    const masked = maskComments(src)
-    // The `//` in `https://` is treated as a line-comment delimiter
-    // and the rest of the line gets blanked.
-    expect(masked).toBe(prefix + ' '.repeat(blanked.length))
-    expect(masked).toHaveLength(src.length)
-  })
-})

package/src/__tests__/dev.test.tsx

@@ -1,123 +0,0 @@
-/** @jsxImportSource hono/jsx */
-/**
- * BfDevReload / createDevReloader tests
- *
- * Verifies the dev-gate (no leak into production) and the basic SSE wire
- * format so a regression in the build-id watcher is caught before E2E.
- */
-import { afterEach, beforeEach, describe, expect, it } from 'bun:test'
-import { Hono } from 'hono'
-import { mkdtempSync, rmSync, mkdirSync, writeFileSync } from 'node:fs'
-import { tmpdir } from 'node:os'
-import { join } from 'node:path'
-import { renderToString } from 'hono/jsx/dom/server'
-// `BfDevReload` lives in `app.ts` (runtime-agnostic, html-tagged-template
-// based); `createDevReloader` lives in `dev.tsx` (Node fs-watch based).
-import { BfDevReload } from '../app'
-import { createDevReloader } from '../dev'
-
-describe('BfDevReload', () => {
-  // The runtime gate lives in `barefootDevReload` (middleware). When
-  // it's mounted with `enabled: false` it never publishes the endpoint
-  // to the request context, so <BfDevReload /> falls back to `null`.
-  // Tests below exercise the component directly, which means the
-  // "endpoint provided" branch is the snippet branch and the
-  // "no endpoint, no context" branch is the null branch.
-
-  it('renders the EventSource snippet when an endpoint is provided', () => {
-    const html = renderToString(<BfDevReload endpoint="/_bf/reload" />)
-    expect(html).toContain('<script>')
-    expect(html).toContain('new EventSource(\"/_bf/reload\")')
-    expect(html).toContain("addEventListener('reload'")
-  })
-
-  it('renders nothing when no endpoint is available (no context, no prop)', () => {
-    const html = renderToString(<BfDevReload />)
-    expect(html).toBe('')
-  })
-
-  it('respects a custom endpoint passed as a prop', () => {
-    const html = renderToString(<BfDevReload endpoint="/__reload" />)
-    expect(html).toContain('new EventSource(\"/__reload\")')
-  })
-})
-
-describe('createDevReloader', () => {
-  let dir: string
-
-  beforeEach(() => {
-    dir = mkdtempSync(join(tmpdir(), 'bf-dev-reloader-'))
-    mkdirSync(join(dir, '.dev'), { recursive: true })
-    writeFileSync(join(dir, '.dev', 'build-id'), '1000')
-  })
-
-  afterEach(() => {
-    rmSync(dir, { recursive: true, force: true })
-  })
-
-  it('returns 404 when disabled', async () => {
-    const app = new Hono()
-    app.get('/_bf/reload', createDevReloader({ distDir: dir, enabled: false }))
-
-    const res = await app.request('/_bf/reload')
-    expect(res.status).toBe(404)
-  })
-
-  it('streams initial hello with current build-id', async () => {
-    const app = new Hono()
-    app.get('/_bf/reload', createDevReloader({ distDir: dir, enabled: true }))
-
-    const ctrl = new AbortController()
-    const res = await app.request(new Request('http://localhost/_bf/reload', { signal: ctrl.signal }))
-    expect(res.status).toBe(200)
-    expect(res.headers.get('Content-Type')).toBe('text/event-stream')
-
-    const reader = res.body!.getReader()
-    const decoder = new TextDecoder()
-    let received = ''
-    // Accumulate until the hello event lands (first two chunks should suffice).
-    for (let i = 0; i < 4 && !received.includes('event: hello'); i++) {
-      const { value, done } = await reader.read()
-      if (done) break
-      received += decoder.decode(value)
-    }
-
-    expect(received).toContain('retry: 1000')
-    expect(received).toContain('event: hello')
-    expect(received).toContain('data: 1000')
-
-    ctrl.abort()
-    try { await reader.cancel() } catch { /* already closed */ }
-  })
-
-  // Regression: when a client reconnects after a build happened during its
-  // disconnected window, it must see `reload` (not `hello`), otherwise the
-  // missed rebuild silently stays unpainted until the next change.
-  it('emits reload on reconnect when Last-Event-ID is stale', async () => {
-    const app = new Hono()
-    app.get('/_bf/reload', createDevReloader({ distDir: dir, enabled: true }))
-
-    const ctrl = new AbortController()
-    const req = new Request('http://localhost/_bf/reload', {
-      headers: { 'Last-Event-ID': '999' },
-      signal: ctrl.signal,
-    })
-    const res = await app.request(req)
-
-    const reader = res.body!.getReader()
-    const decoder = new TextDecoder()
-    let received = ''
-    for (let i = 0; i < 4 && !received.includes('event: '); i++) {
-      const { value, done } = await reader.read()
-      if (done) break
-      received += decoder.decode(value)
-    }
-
-    expect(received).toContain('event: reload')
-    expect(received).not.toContain('event: hello')
-    expect(received).toContain('data: 1000')
-
-    ctrl.abort()
-    try { await reader.cancel() } catch { /* already closed */ }
-  })
-})

package/src/__tests__/import-map.test.ts

@@ -1,98 +0,0 @@
-/**
- * BfImportMap tests
- *
- * Verifies the importmap merges configured externals from
- * `barefoot-externals.json` (issue #1639) and emits modulepreload
- * links, while preserving the pre-#1639 `@barefootjs/client*` defaults
- * when no externals are passed.
- */
-import { describe, test, expect } from 'bun:test'
-import { BfImportMap } from '../app'
-import type { ImportMapManifest } from '@barefootjs/jsx'
-
-function parseImportMap(html: string): Record<string, string> {
-  const match = html.match(/<script type="importmap">(.*?)<\/script>/s)
-  if (!match) throw new Error(`no importmap in: ${html}`)
-  return JSON.parse(match[1]).imports
-}
-
-describe('BfImportMap', () => {
-  test('emits @barefootjs/client defaults when no externals passed', () => {
-    const html = String(BfImportMap({ base: '/components' }))
-    expect(parseImportMap(html)).toEqual({
-      '@barefootjs/client': '/components/barefoot.js',
-      '@barefootjs/client/runtime': '/components/barefoot.js',
-    })
-    expect(html).not.toContain('modulepreload')
-  })
-
-  test('strips trailing slash from base', () => {
-    const html = String(BfImportMap({ base: '/components/' }))
-    expect(parseImportMap(html)['@barefootjs/client']).toBe('/components/barefoot.js')
-  })
-
-  test('merges externals importmap on top of the client defaults', () => {
-    const externals: ImportMapManifest = {
-      importmap: {
-        imports: {
-          zod: 'https://esm.sh/zod@4.4.3',
-          '@barefootjs/form': '/components/form.js',
-        },
-      },
-      preloads: [],
-    }
-    const imports = parseImportMap(String(BfImportMap({ base: '/components', externals })))
-    expect(imports).toEqual({
-      '@barefootjs/client': '/components/barefoot.js',
-      '@barefootjs/client/runtime': '/components/barefoot.js',
-      zod: 'https://esm.sh/zod@4.4.3',
-      '@barefootjs/form': '/components/form.js',
-    })
-  })
-
-  test('manifest @barefootjs/client mapping wins over the prop-derived one', () => {
-    const externals: ImportMapManifest = {
-      importmap: { imports: { '@barefootjs/client': '/vendor/barefoot.js' } },
-    }
-    const imports = parseImportMap(String(BfImportMap({ base: '/components', externals })))
-    expect(imports['@barefootjs/client']).toBe('/vendor/barefoot.js')
-  })
-
-  test('emits modulepreload links for manifest preloads', () => {
-    const externals: ImportMapManifest = {
-      importmap: { imports: {} },
-      preloads: ['/components/form.js', 'https://esm.sh/zod@4.4.3'],
-    }
-    const html = String(BfImportMap({ base: '/components', externals }))
-    expect(html).toContain('<link rel="modulepreload" href="/components/form.js" crossorigin>')
-    expect(html).toContain('<link rel="modulepreload" href="https://esm.sh/zod@4.4.3" crossorigin>')
-  })
-
-  test('emits crossorigin on modulepreload so cross-origin CDN preloads are reused', () => {
-    const externals: ImportMapManifest = {
-      preloads: ['https://esm.sh/zod@4.4.3'],
-    }
-    const html = String(BfImportMap({ base: '/components', externals }))
-    const match = html.match(/<link rel="modulepreload"[^>]*>/)
-    expect(match?.[0]).toContain('crossorigin')
-  })
-
-  test('preload=false suppresses modulepreload links', () => {
-    const externals: ImportMapManifest = {
-      preloads: ['/components/form.js'],
-    }
-    const html = String(BfImportMap({ base: '/components', externals, preload: false }))
-    expect(html).not.toContain('modulepreload')
-    // importmap still emitted
-    expect(parseImportMap(html)['@barefootjs/client']).toBe('/components/barefoot.js')
-  })
-
-  test('escapes double quotes in preload hrefs', () => {
-    const externals: ImportMapManifest = {
-      preloads: ['/components/"onerror=alert(1).js'],
-    }
-    const html = String(BfImportMap({ base: '/components', externals }))
-    expect(html).not.toContain('"onerror=alert(1)')
-    expect(html).toContain('&quot;onerror=alert(1)')
-  })
-})