@barefootjs/jsx 0.33.0 → 0.33.2

package/src/__tests__/issue-2723-prop-alias-reactivity.test.ts

@@ -0,0 +1,124 @@
+/**
+ * Regression pin for #2723.
+ *
+ * A semantically-inert `const x__alias = x` hop between a destructured
+ * prop and its use site (exactly what the `alias-props` mutation sweep
+ * inserts, #2481) silently dropped the attribute's `createEffect` and, in
+ * the rest-spread case, its `applyRestAttrs` call too — collapsing `init`
+ * to `function initL() {}` whenever the effect was its only content.
+ *
+ * Five variants isolate the two independent defects the fix addresses:
+ *   - A: no alias at all (control — everything present).
+ *   - B: every destructured binding aliased, INCLUDING the rest
+ *     parameter (`const rest__alias = rest`) — the shape the real
+ *     `alias-props` mutation produces.
+ *   - C: only the prop feeding the reactive attribute is aliased; the
+ *     rest parameter is spread un-aliased.
+ *   - D: aliased, but with NO rest spread at all — proves the defect is
+ *     not spread-handling-specific.
+ *   - E: aliased (rest included) AND an event handler is present, so
+ *     `init` is non-empty regardless of the effect. This is the case a
+ *     fix aimed only at "don't emit an empty init" would still leave
+ *     broken: the `createEffect` silently disappears WITHOUT collapsing
+ *     the function, so an empty-init check alone can't catch it.
+ */
+import { describe, test, expect } from 'bun:test'
+import { compileJSX } from '../compiler'
+import { TestAdapter } from '../adapters/test-adapter'
+
+const adapter = new TestAdapter()
+
+function compileInit(source: string): string {
+  const result = compileJSX(source, 'L.tsx', { adapter })
+  expect(result.errors.filter(e => e.severity === 'error')).toHaveLength(0)
+  const clientJs = result.files.find(f => f.type === 'clientJs')!.content
+  return clientJs
+}
+
+describe('#2723 — prop alias hop must not drop attribute reactivity', () => {
+  test('A: no alias — createEffect and applyRestAttrs both present (control)', () => {
+    const clientJs = compileInit(`
+      "use client";
+      const BASE = 'flex'
+      type LProps = { className?: string; children?: any }
+      export function L({ className = '', children, ...rest }: LProps) {
+        return <label className={\`\${BASE} \${className}\`} {...rest}>{children}</label>
+      }
+    `)
+    expect(clientJs).toContain('createEffect(')
+    expect(clientJs).toContain('applyRestAttrs(')
+    expect(clientJs).not.toContain('function initL() {}')
+  })
+
+  test('B: every binding aliased, rest included — createEffect and applyRestAttrs survive', () => {
+    const clientJs = compileInit(`
+      "use client";
+      const BASE = 'flex'
+      type LProps = { className?: string; children?: any }
+      export function L({ className = '', children, ...rest }: LProps) {
+        const className__alias = className
+        const children__alias = children
+        const rest__alias = rest
+        return <label className={\`\${BASE} \${className__alias}\`} {...rest__alias}>{children__alias}</label>
+      }
+    `)
+    expect(clientJs).toContain('createEffect(')
+    expect(clientJs).toContain('applyRestAttrs(')
+    expect(clientJs).not.toContain('function initL() {}')
+    // The rest-parameter alias must resolve to the runtime props object,
+    // not to the never-declared source-level rest binding.
+    expect(clientJs).toContain('const rest__alias = _p')
+    expect(clientJs).not.toMatch(/const rest__alias = rest\b/)
+  })
+
+  test('C: only the reactive prop is aliased, rest is spread un-aliased', () => {
+    const clientJs = compileInit(`
+      "use client";
+      const BASE = 'flex'
+      type LProps = { className?: string; children?: any }
+      export function L({ className = '', children, ...rest }: LProps) {
+        const className__alias = className
+        return <label className={\`\${BASE} \${className__alias}\`} {...rest}>{children}</label>
+      }
+    `)
+    expect(clientJs).toContain('createEffect(')
+    expect(clientJs).toContain('applyRestAttrs(')
+    expect(clientJs).not.toContain('function initL() {}')
+  })
+
+  test('D: aliased with NO rest spread — not a spread-handling bug', () => {
+    const clientJs = compileInit(`
+      "use client";
+      const BASE = 'flex'
+      type LProps = { className?: string; children?: any }
+      export function L({ className = '', children }: LProps) {
+        const className__alias = className
+        return <label className={\`\${BASE} \${className__alias}\`}>{children}</label>
+      }
+    `)
+    expect(clientJs).toContain('createEffect(')
+    expect(clientJs).not.toContain('applyRestAttrs(')
+    expect(clientJs).not.toContain('function initL() {}')
+  })
+
+  test('E: aliased + event handler — createEffect must survive even though init is already non-empty', () => {
+    const clientJs = compileInit(`
+      "use client";
+      const BASE = 'flex'
+      type LProps = { className?: string; children?: any; onClick?: () => void }
+      export function L({ className = '', children, onClick, ...rest }: LProps) {
+        const className__alias = className
+        const rest__alias = rest
+        return <label className={\`\${BASE} \${className__alias}\`} onClick={onClick} {...rest__alias}>{children}</label>
+      }
+    `)
+    // A fix aimed only at "init must not be empty" would pass this
+    // assertion for free (the handler alone keeps init non-empty) while
+    // leaving the class binding frozen at its initial value — the
+    // `createEffect` assertion is the one that actually pins the fix.
+    expect(clientJs).not.toContain('function initL() {}')
+    expect(clientJs).toContain('createEffect(')
+    expect(clientJs).toContain('applyRestAttrs(')
+    expect(clientJs).toContain("addEventListener('click'")
+  })
+})

package/src/__tests__/markup-prop-brand.test.ts

@@ -158,4 +158,53 @@ describe('markup-prop brand (#2651)', () => {
     // `__slot(...)` live-node wrapping — not itself re-wrapped in bfMarkup.
     expect(clientJs).toMatch(/get header\(\)\s*\{\s*return __slot\(/)
   })
+
+  // KNOWN BUG (#2702) — pins the CURRENT (broken) emission, not the
+  // correct one. `isSingleElementJsxChildren` (`ir-to-client-js/collect-
+  // elements.ts`) only brands the single-element jsx-children shape;
+  // #2651's PR body enumerated "conditional-in-fragment" as deliberately
+  // out of that PR's scope, and #2702 confirms it is actually broken, not
+  // merely unbranded-but-harmless: the child's own `escapeTextOrNode`
+  // reactive effect re-escapes the chosen branch's HTML as literal text
+  // the moment it first runs (real DOM corruption, verified directly —
+  // see `jsx-element-prop-fragment-conditional`'s fixture docstring,
+  // `packages/adapter-tests/fixtures/`, for the full mechanism and why no
+  // other shared conformance suite observes it: SSR is genuinely correct,
+  // and CSR conformance's `createEffect` mock never runs the effect).
+  //
+  // Graduation: once `bfMarkup()` branding is extended to this multi-part
+  // shape, this assertion starts failing — replace it with a positive
+  // `bfMarkup(...)`-wrapped assertion (mirroring test (b) above) and
+  // delete this comment block; that is the fixture's own graduation
+  // trigger too (its `expectedHtml` is already the correct SSR output, so
+  // no fixture change is needed, only this pin's removal and #2667's
+  // BF021 suggestion regaining the fragment-wrap escape).
+  test('(h) KNOWN BUG (#2702): a conditional-in-fragment jsx-children prop reaches initChild UNbranded', () => {
+    const source = `
+      'use client'
+      import { createSignal } from '@barefootjs/client'
+      export function Card(props: { header?: any; children?: any }) {
+        return (
+          <section>
+            <header>{props.header}</header>
+            <div>{props.children}</div>
+          </section>
+        )
+      }
+      export function JsxElementPropFragmentConditional() {
+        const [cond, setCond] = createSignal(true)
+        return (
+          <Card header={<>{cond() ? <a>x</a> : <b>y</b>}</>}>
+            <p>body text</p>
+          </Card>
+        )
+      }
+    `
+    const clientJs = clientJsFor(source)
+    // Bug: the getter returns a bare template-literal ternary — NOT
+    // wrapped in bfMarkup(...). If this ever starts matching bfMarkup(...)
+    // the bug is fixed; see the graduation note above.
+    expect(clientJs).toMatch(/get header\(\)\s*\{\s*return cond\(\)\s*\?\s*`<a>x<\/a>`\s*:\s*`<b>y<\/b>`\s*\}/)
+    expect(clientJs).not.toMatch(/get header\(\)\s*\{\s*return bfMarkup\(/)
+  })
 })

package/src/__tests__/nested-loop-conditional.test.ts

@@ -134,14 +134,15 @@ describe('nested loops/conditionals inside mapArray (#830, #839)', () => {
     expect(mapArrayCount).toBeGreaterThanOrEqual(3)
   })
 
-  test('reactive text inside conditional inside inner loop uses re-claim pattern (#840)', () => {
-    // When a reactive text is inside a conditional branch inside a nested (inner) loop,
-    // insert() may replace the SSR element after the text node is captured.
-    // Slot unification A3: the generated code must re-claim on EVERY run via
-    // a fresh `claimSlots(...).write(...)` call inside the effect body — not
-    // a `lazySlots` writer built once outside it, which would go stale once
-    // insert() swaps the branch's DOM (see `stringifyInnerLoops`' docstring
-    // in `ir-to-client-js/control-flow/stringify/inner-loop.ts`).
+  test('reactive text inside conditional inside inner loop gets a real insert() (#840, fixed by #2706)', () => {
+    // A per-item conditional living inside a NESTED (inner) loop's row now
+    // gets full insert() parity with a top-level loop's row conditional
+    // (#2706) — the condition is a real reactive `createEffect` dependency,
+    // not baked once at row creation, and the branch's reactive text binds
+    // through the arm's own `lazySlots(__branchScope, ...)` +
+    // `createDisposableEffect` (same shape `stringifyLoopChildArm` emits for
+    // any other insert() arm), never a bare-claimSlots reclaim racing
+    // against a marker the active branch may not have rendered.
     const source = `
       'use client'
       import { createSignal } from '@barefootjs/client'
@@ -176,9 +177,17 @@ describe('nested loops/conditionals inside mapArray (#830, #839)', () => {
     expect(clientJs).toBeDefined()
     const content = clientJs!.content
 
-    // Re-claim pattern: a fresh `claimSlots(...)` call inside createEffect so
-    // it always resolves against the live node, never a cached stale ref.
-    expect(content).toMatch(/createEffect\(\(\) => \{ claimSlots\(__innerEl\w*, \[\{ id: 's\d+', kind: 'text', path: \[\] \}\]\)\.write\('s\d+', String\(/)
+    // A real insert() over the row's own element, keyed to the conditional's
+    // slot id and condition — not a static bake.
+    expect(content).toMatch(/insert\(__innerEl\w*, 's\d+', \(\) => child\(\)\.type === 'text', \{/)
+
+    // The branch's reactive text binds inside `bindEvents` via the standard
+    // arm-text shape (`lazySlots` + `createDisposableEffect`), scoped to
+    // `__branchScope` — the node insert() actually mounts for this branch —
+    // never a bare `claimSlots` reclaim against `__innerEl<uid>` racing the
+    // branch's own mount/unmount.
+    expect(content).toMatch(/const __bfw_s\d+ = lazySlots\(__branchScope, \[\{ id: 's\d+', kind: 'markup', path: \[\] \}\]\)/)
+    expect(content).toMatch(/createDisposableEffect\(\(\) => \{ __bfw_s\d+\('s\d+', escapeTextOrNode\(child\(\)\.label\)\) \}\)/)
   })
 
   test('event handler inside conditional branch of loop item appears in bindEvents (#839)', () => {

package/src/__tests__/return-through-local-var.test.ts

@@ -0,0 +1,269 @@
+/**
+ * Regression tests for #2720: a component whose render is bound to a local
+ * const and returned by name —
+ *
+ *   export function Button() {
+ *     const __root = (<button>Go</button>)
+ *     return __root
+ *   }
+ *
+ * — previously produced `{files: [], errors: []}`: neither sound (nothing
+ * emitted) nor loud (nothing reported). Two structural variants of this
+ * shape need two separate detectors, both landing here:
+ *
+ * 1. **Flat** (statements are direct children of the component body, as
+ *    written above): `ctx.jsxReturn` DOES get set (to the `__root`
+ *    Identifier — `visitComponentBody`'s return handler captures any
+ *    return expression, not just syntactic JSX), but return position never
+ *    resolves an identifier through its initializer the way JSX-child
+ *    position does via `jsxConstants` / `inlineableJsxConsts` (#547 /
+ *    #1409) — so `transformJsxExpression`'s scalar-leaf case returns `null`
+ *    and `buildIRRoot` (`jsx-to-ir.ts`) drops the component silently. Fixed
+ *    there: recognize a bare Identifier at return position that names a
+ *    local already proven to hold JSX by those two maps, and report BF027
+ *    instead of dropping it.
+ *
+ * 2. **Nested-block** (`{ const __root = <jsx/>; return __root }` as a
+ *    single block statement — the exact shape the #2481 mutation sweep's
+ *    `block-body` mutation produces by wrapping the ORIGINAL return
+ *    statement): the block is a direct child of the component body, so
+ *    `visitComponentBody`'s opaque-block preservation (#930 — "a bare
+ *    block at the top of a component body is inert side-effect scoping,
+ *    preserve it verbatim, don't recurse") swallows it whole. Neither
+ *    `jsxConstants` nor `jsxReturn` are EVER set, so the flat-case fix
+ *    above never runs. Fixed in `analyzer.ts`'s `visitComponentBody`:
+ *    before preserving such a block, `findBlockBodyReturnedJsxLocalName`
+ *    checks whether it is exactly this "name the JSX, then return the
+ *    name" shape and reports BF027 directly.
+ *
+ * The "faithful" fix (resolving the identifier through its initializer so
+ * the component actually compiles, for either variant) is tracked
+ * separately by #2720 and not implemented here — this PR is the loud
+ * stopgap only.
+ *
+ * Found by the #2481 mutation sweep's `block-body` mutation
+ * (`packages/adapter-tests/mutation/mutations.ts`, the nested-block shape
+ * above): 41/41 corpus fixtures reproduced this identically before this
+ * fix, classified `broken` with `refused` at 0. This fix flips them to
+ * `refused` (a pass under the sound-or-loud trichotomy).
+ */
+
+import { describe, test, expect } from 'bun:test'
+import { compileJSX } from '../compiler'
+import { TestAdapter } from '../adapters/test-adapter'
+
+const adapter = new TestAdapter()
+
+describe('BF027: return-through-local-variable is not recognized as JSX (#2720)', () => {
+  test('function component: `const __root = (<jsx/>); return __root` reports BF027 instead of silently emitting nothing', () => {
+    const source = `
+      export function Button() {
+        const __root = (<button>Go</button>)
+        return __root
+      }
+    `
+    const result = compileJSX(source, 'Button.tsx', { adapter })
+
+    // Neither silent-drop nor silent-emit: no files, but a loud diagnostic.
+    expect(result.files).toHaveLength(0)
+    const bf027 = result.errors.find(e => e.code === 'BF027')
+    expect(bf027).toBeDefined()
+    expect(bf027!.severity).toBe('error')
+    expect(bf027!.message).toContain('Button')
+    expect(bf027!.message).toMatch(/not recognized as JSX/)
+  })
+
+  test('arrow component: same shape via `export const Button = () => {...}`', () => {
+    const source = `
+      export const Button = () => {
+        const __root = <button>Go</button>
+        return __root
+      }
+    `
+    const result = compileJSX(source, 'Button.tsx', { adapter })
+    expect(result.files).toHaveLength(0)
+    expect(result.errors.find(e => e.code === 'BF027')).toBeDefined()
+  })
+
+  test('non-root JSX initializer (ternary) through a local also reports BF027', () => {
+    const source = `
+      export function Button({ ok }: { ok: boolean }) {
+        const __root = ok ? <button>Go</button> : <span>No</span>
+        return __root
+      }
+    `
+    const result = compileJSX(source, 'Button.tsx', { adapter })
+    expect(result.files).toHaveLength(0)
+    expect(result.errors.find(e => e.code === 'BF027')).toBeDefined()
+  })
+
+  test('nested-block shape (the actual mutation-sweep output): `{ const __root = <jsx/>; return __root }` reports BF027', () => {
+    // This is the shape `packages/adapter-tests/mutation/mutations.ts`'s
+    // `blockBody` mutation actually produces (it wraps the ORIGINAL return
+    // statement in a new block rather than splicing the const/return in as
+    // top-level statements) — structurally distinct from the flat case
+    // above because the block is opaque to `visitComponentBody` (#930).
+    const source = `
+      export function Button() {
+        {
+          const __root = <button>Go</button>
+          return __root
+        }
+      }
+    `
+    const result = compileJSX(source, 'Button.tsx', { adapter })
+    expect(result.files).toHaveLength(0)
+    const bf027 = result.errors.find(e => e.code === 'BF027')
+    expect(bf027).toBeDefined()
+    expect(bf027!.message).toContain('Button')
+  })
+
+  test('nested-block shape with a ternary JSX initializer also reports BF027', () => {
+    const source = `
+      export function Button({ ok }: { ok: boolean }) {
+        {
+          const __root = ok ? <button>Go</button> : <span>No</span>
+          return __root
+        }
+      }
+    `
+    const result = compileJSX(source, 'Button.tsx', { adapter })
+    expect(result.files).toHaveLength(0)
+    expect(result.errors.find(e => e.code === 'BF027')).toBeDefined()
+  })
+
+  test('nested-block shape with a `.map()`-with-JSX-callback initializer also reports BF027', () => {
+    // `initializerShapeContainsJsx` stops at arrow boundaries, so this
+    // variant needs the same `isMapLikeCallWithJsx` check `collectConstant`
+    // uses (#1554) — without it this shape slipped back into the silent
+    // drop even after BF027 landed (Copilot review on #2726).
+    const source = `
+      export function List() {
+        {
+          const __root = ['a', 'b'].map((item) => <div>{item}</div>)
+          return __root
+        }
+      }
+    `
+    const result = compileJSX(source, 'List.tsx', { adapter })
+    expect(result.files).toHaveLength(0)
+    const bf027 = result.errors.find(e => e.code === 'BF027')
+    expect(bf027).toBeDefined()
+    expect(bf027!.message).toContain('List')
+  })
+
+  test('flat shape with a `.map()`-with-JSX-callback initializer reports BF027 (via inlineableJsxConsts)', () => {
+    const source = `
+      export function List() {
+        const __root = ['a', 'b'].map((item) => <div>{item}</div>)
+        return __root
+      }
+    `
+    const result = compileJSX(source, 'List.tsx', { adapter })
+    expect(result.files).toHaveLength(0)
+    expect(result.errors.find(e => e.code === 'BF027')).toBeDefined()
+  })
+
+  test('multi-component file: the broken sibling is flagged but the good sibling still compiles', () => {
+    const source = `
+      export function Good() { return <div>ok</div> }
+      export function Bad() {
+        const __root = <button>Go</button>
+        return __root
+      }
+    `
+    const result = compileJSX(source, 'Multi.tsx', { adapter })
+    const bf027 = result.errors.find(e => e.code === 'BF027')
+    expect(bf027).toBeDefined()
+    expect(bf027!.message).toContain('Bad')
+    // Good still produces output despite Bad's failure.
+    expect(result.files.length).toBeGreaterThan(0)
+  })
+
+  describe('control: direct JSX return keeps compiling clean', () => {
+    test('function component returning JSX directly has no BF027 and produces files', () => {
+      const source = `
+        export function Button() {
+          return (<button>Go</button>)
+        }
+      `
+      const result = compileJSX(source, 'Button.tsx', { adapter })
+      expect(result.errors.find(e => e.code === 'BF027')).toBeUndefined()
+      expect(result.files.length).toBeGreaterThan(0)
+    })
+  })
+
+  describe('no false positive: PascalCase exports that legitimately do not return JSX stay silent', () => {
+    test('a PascalCase function returning a plain object is untouched (not a component at all)', () => {
+      const source = `
+        export function CreateUser() {
+          return { name: 'x' }
+        }
+      `
+      const result = compileJSX(source, 'CreateUser.tsx', { adapter })
+      // Pre-existing behaviour for a non-component PascalCase export:
+      // no files, no errors. BF027 must not fire here — there is no local
+      // proven to hold JSX anywhere in this function.
+      expect(result.files).toHaveLength(0)
+      expect(result.errors.find(e => e.code === 'BF027')).toBeUndefined()
+    })
+
+    test('render-nothing literals (null / <></> / false) returned directly stay clean', () => {
+      const source = `
+        export function ReturnsNull() { return null }
+        export function ReturnsFragment() { return <></> }
+        export function ReturnsFalse(): any { return false }
+      `
+      const result = compileJSX(source, 'ReturnsNull.tsx', { adapter })
+      expect(result.errors.find(e => e.code === 'BF027')).toBeUndefined()
+    })
+
+    test('a local const unrelated to JSX does not spuriously trip BF027', () => {
+      const source = `
+        export function Button() {
+          const count = 1
+          return <button>{count}</button>
+        }
+      `
+      const result = compileJSX(source, 'Button.tsx', { adapter })
+      expect(result.errors.find(e => e.code === 'BF027')).toBeUndefined()
+      expect(result.files.length).toBeGreaterThan(0)
+    })
+
+    test('an ordinary top-level scoping block with no returned local is untouched', () => {
+      // A bare block used for legitimate imperative scoping ahead of the
+      // real render — #930's opaque-block preservation path — must not be
+      // mistaken for the #2720 shape just because SOME block sits at the
+      // top of the component body.
+      const source = `
+        export function Button() {
+          {
+            const x = 1
+            console.log(x)
+          }
+          return <button>Go</button>
+        }
+      `
+      const result = compileJSX(source, 'Button.tsx', { adapter })
+      expect(result.errors.find(e => e.code === 'BF027')).toBeUndefined()
+      expect(result.files.length).toBeGreaterThan(0)
+    })
+
+    test('a nested block whose returned identifier is not locally JSX-initialized stays silent', () => {
+      // The block's last statement returns `result`, but nothing in the
+      // block declares `result` as JSX — e.g. it is a prop or an outer
+      // local. Must not false-positive just because the shape ends in
+      // `return <identifier>`.
+      const source = `
+        export function Widget({ result }: { result: number }) {
+          {
+            const other = 1
+            return result
+          }
+        }
+      `
+      const compileResult = compileJSX(source, 'Widget.tsx', { adapter })
+      expect(compileResult.errors.find(e => e.code === 'BF027')).toBeUndefined()
+    })
+  })
+})

package/src/__tests__/rewrite-props-object.test.ts

@@ -60,13 +60,50 @@ describe('rewritePropsObjectRef', () => {
     expect(out).toBe('const name = _p.name')
   })
 
-  test('no-op when propsObjectName is null (destructured-props mode)', () => {
-    const code = 'const x = props.name'
-    const out = rewritePropsObjectRef(code, null)
-    // null → defaults to 'props'; rewritten.
+  test('still rewrites a literal `props` read when propsObjectName is null', () => {
+    // The `propsObjectName ?? 'props'` fallback survives the #2723 work.
+    // A destructured component can still write `props.itemId` inside a
+    // handler body — `propsObjectName` is null for that shape, so without
+    // the fallback the emitted init keeps a `props` reference that no
+    // binding satisfies (the doc-example `StatementExample` regressed
+    // exactly this way before the fallback was restored).
+    const out = rewritePropsObjectRef('const x = props.name', null)
     expect(out).toBe('const x = _p.name')
   })
 
+  test('rewrites via restPropsName when propsObjectName is null (#2723)', () => {
+    // The destructured-props shape this exists for: `function F({ a,
+    // ...rest })` has no `propsObjectName` at all, but a `const
+    // rest__alias = rest` hop (or any other bare read of the rest
+    // binding) still needs `rest` rewritten to `_p`.
+    const out = rewritePropsObjectRef('const restAlias = rest', null, 'rest')
+    expect(out).toBe('const restAlias = _p')
+  })
+
+  test('restPropsName rewrite is not tied to the literal name "props"', () => {
+    // Regression guard for the bug the widened fallback replaced: a rest
+    // binding named anything OTHER than "props" left the reference
+    // dangling (a runtime ReferenceError) because the old fallback only
+    // ever guessed the literal word "props".
+    const out = rewritePropsObjectRef('const leftoverAlias = leftover', null, 'leftover')
+    expect(out).toBe('const leftoverAlias = _p')
+  })
+
+  test('rewrites BOTH propsObjectName and restPropsName when both are set', () => {
+    // A `(props)`-arg component that ALSO body-destructures a rest
+    // binding out of it (`const { a, ...rest } = props`) has both names
+    // live in the same init body.
+    const out = rewritePropsObjectRef('const x = props.a + rest.b', 'props', 'rest')
+    expect(out).toBe('const x = _p.a + _p.b')
+  })
+
+  test('restPropsName defaulting to null preserves the two-arg call shape', () => {
+    // Existing call sites that only ever passed `propsObjectName` (the
+    // pre-#2723 signature) must keep working unchanged.
+    const out = rewritePropsObjectRef('const name = props.name', 'props')
+    expect(out).toBe('const name = _p.name')
+  })
+
   test('no-op when propsObjectName equals _p', () => {
     const code = 'const x = _p.name'
     const out = rewritePropsObjectRef(code, '_p')

package/src/analyzer.ts

@@ -796,6 +796,29 @@ function visitComponentBody(node: ts.Node, ctx: AnalyzerContext): void {
       (ts.isBlock(node) && node.parent === ctx.componentBodyBlock)
     )
   ) {
+    // #2720: a bare top-level block whose ONLY job is naming the render
+    // value before returning it (`{ const __root = <jsx/>; return __root
+    // }`) would otherwise be swallowed whole by the opaque-block
+    // preservation above — this walk never recurses into it, so neither
+    // `jsxConstants` nor `jsxReturn` ever get set and the component
+    // silently produces zero files, zero diagnostics. Detect the shape
+    // before preserving it and report loudly instead.
+    if (ts.isBlock(node)) {
+      const returnedLocal = findBlockBodyReturnedJsxLocalName(node)
+      if (returnedLocal) {
+        ctx.errors.push(createError(
+          ErrorCodes.RETURN_VALUE_NOT_JSX,
+          getSourceLocation(node, ctx.sourceFile, ctx.filePath),
+          {
+            message:
+              `Component '${ctx.componentName ?? '(unknown)'}' return value is not recognized ` +
+              `as JSX — return the JSX expression directly instead of binding it to a local ` +
+              `variable first (\`return ${returnedLocal}\` after \`const ${returnedLocal} = ` +
+              `<jsx/>\` is not resolved at return position).`,
+          },
+        ))
+      }
+    }
     collectInitStatement(node, ctx)
     return
   }
@@ -886,6 +909,54 @@ export function unwrapJsxTransparent(expr: ts.Expression): ts.Expression {
   return current
 }
 
+/**
+ * BF027 (#2720) shape detector: a block whose last statement returns a
+ * bare identifier, where some earlier statement in the SAME block declares
+ * that identifier as a `const`/`let` initialized to JSX (root JSX, or JSX
+ * nested in a ternary/`&&`/`||`/`??`) — `{ const __root = <jsx/>; return
+ * __root }`. Mirrors the same two "does this initializer hold JSX" checks
+ * `collectConstant` uses to populate `jsxConstants` / `inlineableJsxConsts`
+ * for ordinary top-level locals, applied here to a nested block that would
+ * otherwise never be walked (it is preserved whole as an opaque init
+ * statement, see #930). Returns the identifier's name on a match, else
+ * null — deliberately narrow (exact "name, then return that name" shape)
+ * so an ordinary block scoping unrelated imperative logic is untouched.
+ */
+function findBlockBodyReturnedJsxLocalName(block: ts.Block): string | null {
+  const stmts = block.statements
+  const last = stmts[stmts.length - 1]
+  if (!last || !ts.isReturnStatement(last) || !last.expression) return null
+  const returned = unwrapJsxTransparent(last.expression)
+  if (!ts.isIdentifier(returned)) return null
+  const name = returned.text
+
+  for (const stmt of stmts) {
+    if (!ts.isVariableStatement(stmt)) continue
+    for (const decl of stmt.declarationList.declarations) {
+      if (!ts.isIdentifier(decl.name) || decl.name.text !== name || !decl.initializer) continue
+      let init: ts.Expression = decl.initializer
+      while (ts.isParenthesizedExpression(init)) init = init.expression
+      if (
+        ts.isJsxElement(init) ||
+        ts.isJsxSelfClosingElement(init) ||
+        ts.isJsxFragment(init) ||
+        initializerShapeContainsJsx(init) ||
+        // `initializerShapeContainsJsx` deliberately stops at arrow
+        // boundaries, so a `.map()`/`.flatMap()` whose CALLBACK returns JSX
+        // needs the same dedicated check `collectConstant` uses to admit
+        // that shape into `inlineableJsxConsts` (#1554) — without it,
+        // `{ const __root = items.map(i => <div/>); return __root }` slips
+        // past BF027 back into the silent-drop path (Copilot review on
+        // #2726).
+        isMapLikeCallWithJsx(init)
+      ) {
+        return name
+      }
+    }
+  }
+  return null
+}
+
 /**
  * Extract JSX element from an expression, handling parenthesized
  * expressions and TS type-only wrappers (`as`, `satisfies`, `!`,