@barefootjs/jsx 0.34.0 → 0.35.1

package/src/__tests__/nested-loop-non-outer-reactivity.test.ts

@@ -0,0 +1,177 @@
+/**
+ * BarefootJS Compiler — nested `.map()` reactivity when the inner array
+ * (or the row's own bindings) does NOT derive from the outer loop's item.
+ *
+ * #2865: before this fix, `build-inner-loop.ts` decided "reactive vs
+ * static" for a nested loop by checking only whether `inner.array`
+ * textually referenced the OUTER loop's item — `refsParent`. Anything
+ * else the inner loop depended on fell through to a hydration-only
+ * `forEach` (`emitStatic` in `stringify/inner-loop.ts`) that never wired
+ * a single `createEffect`, regardless of whether the array itself, or a
+ * text/attr/conditional inside the row, was genuinely reactive. That
+ * fork has been removed — every nested loop now gets the full reactive
+ * `mapArray` emission unconditionally.
+ *
+ * This file pins the previously-frozen shapes directly (as opposed to
+ * `nested-loop-plain.test.ts` / `nested-loop-index-param.test.ts`, whose
+ * relevant cases were originally written to pin the OLD static shape and
+ * have been flipped in place).
+ */
+
+import { describe, test, expect } from 'bun:test'
+import { compileJSX } from '../compiler'
+import { TestAdapter } from '../adapters/test-adapter'
+
+const adapter = new TestAdapter()
+
+function clientJsFor(source: string): string {
+  const result = compileJSX(source, 'Repro.tsx', { adapter })
+  expect(result.errors.filter(e => e.severity === 'error')).toHaveLength(0)
+  const clientJs = result.files.find(f => f.type === 'clientJs')
+  expect(clientJs).toBeDefined()
+  return clientJs!.content
+}
+
+describe('nested .map() reactivity independent of the outer item (#2865)', () => {
+  test('inner array read from a component signal (not the outer item) wires a nested mapArray', () => {
+    const content = clientJsFor(`
+      'use client'
+      import { createSignal } from '@barefootjs/client'
+      export function Repro() {
+        const [rows] = createSignal([{ id: 1 }])
+        const [tags] = createSignal(['x', 'y'])
+        return (
+          <div>
+            {rows().map(row => (
+              <div key={row.id}>
+                <ul>
+                  {tags().map(t => <li key={t}>{t}</li>)}
+                </ul>
+              </div>
+            ))}
+          </div>
+        )
+      }
+    `)
+
+    // The old bug emitted `tags().forEach(...)` with no mapArray/createEffect
+    // at all — appending a tag never reached the DOM.
+    expect(content).toMatch(/mapArray\(\(\) => tags\(\) \|\| \[\], /)
+    expect(content).not.toMatch(/tags\(\)\.forEach\(/)
+  })
+
+  test('inner array read from a memo (not the outer item) wires a nested mapArray', () => {
+    const content = clientJsFor(`
+      'use client'
+      import { createSignal, createMemo } from '@barefootjs/client'
+      export function Repro() {
+        const [rows] = createSignal([{ id: 1 }])
+        const [count] = createSignal(2)
+        const tags = createMemo(() => Array.from({ length: count() }, (_, i) => \`t\${i}\`))
+        return (
+          <div>
+            {rows().map(row => (
+              <div key={row.id}>
+                <ul>
+                  {tags().map(t => <li key={t}>{t}</li>)}
+                </ul>
+              </div>
+            ))}
+          </div>
+        )
+      }
+    `)
+
+    expect(content).toMatch(/mapArray\(\(\) => tags\(\) \|\| \[\], /)
+    expect(content).not.toMatch(/tags\(\)\.forEach\(/)
+  })
+
+  test('a row-content signal read (text) inside a LITERAL inner array still wires createEffect', () => {
+    // Even when the ARRAY itself is a plain constant (never needs to
+    // reconcile), a text/attr/conditional inside the row that reads a
+    // component signal must still update. The old static emitter never
+    // read `reactiveTexts`/`reactiveAttrs`/`conditionals` at all, so this
+    // froze independent of whether the array was reactive.
+    const content = clientJsFor(`
+      'use client'
+      import { createSignal } from '@barefootjs/client'
+      const TAGS = ['x', 'y']
+      export function Repro() {
+        const [rows] = createSignal([{ id: 1 }])
+        const [count, setCount] = createSignal(0)
+        return (
+          <div onClick={() => setCount(c => c + 1)}>
+            {rows().map(row => (
+              <div key={row.id}>
+                <ul>
+                  {TAGS.map(t => <li key={t}>{t}: {count()}</li>)}
+                </ul>
+              </div>
+            ))}
+          </div>
+        )
+      }
+    `)
+
+    expect(content).toMatch(/mapArray\(\(\) => TAGS \|\| \[\], /)
+    expect(content).toContain('createEffect(')
+    expect(content).not.toMatch(/TAGS\.forEach\(/)
+  })
+
+  test('destructured outer param used by the inner array no longer throws ReferenceError at row construction', () => {
+    // Before #2865: static mode skipped the destructure-unwrap statement,
+    // so the emitted `forEach` referenced a bare `tags` identifier that
+    // was never declared in scope.
+    const content = clientJsFor(`
+      'use client'
+      import { createSignal } from '@barefootjs/client'
+      interface Row { id: number; tags: string[] }
+      export function Repro() {
+        const [rows] = createSignal<Row[]>([{ id: 1, tags: ['a', 'b'] }])
+        return (
+          <div>
+            {rows().map(({ id, tags }) => (
+              <div key={id}>
+                <ul>
+                  {tags.map(t => <li key={t}>{t}</li>)}
+                </ul>
+              </div>
+            ))}
+          </div>
+        )
+      }
+    `)
+
+    // `tags` must resolve through the outer row accessor
+    // (`__bfItem().tags`) — not a bare free identifier that was never
+    // declared in scope (the old static-mode bug: the destructured
+    // pattern names `tags` for the SSR template, but the reactive
+    // renderItem's own param is the whole-item accessor, and every
+    // reference to a destructured name is rewritten to go through it).
+    expect(content).toMatch(/mapArray\(\(\) => __bfItem\(\)\.tags \|\| \[\], /)
+  })
+
+  test('outer-index-derived inner array wires a nested mapArray', () => {
+    const content = clientJsFor(`
+      'use client'
+      import { createSignal } from '@barefootjs/client'
+      export function Repro() {
+        const [matrix] = createSignal([['a', 'b'], ['c']])
+        return (
+          <div>
+            {matrix().map((row, i) => (
+              <div key={i}>
+                <ul>
+                  {matrix()[i].map(cell => <li key={cell}>{cell}</li>)}
+                </ul>
+              </div>
+            ))}
+          </div>
+        )
+      }
+    `)
+
+    expect(content).toContain('mapArray(')
+    expect(content).not.toMatch(/\.forEach\(\(cell,/)
+  })
+})

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

@@ -138,18 +138,21 @@ describe('plain nested loops without conditional wrapper', () => {
   })
 
   test('regression: 3-level nested loop wires mapArray at the deepest level (not forEach)', () => {
-    // Before the fix, `emitInnerLoopSetup` decided "is this loop reactive?"
-    // by checking the IR's `inner.refsOuterParam` — a flag set at collect
-    // time against the *outermost* loop's param only. At depth 2+, the array
-    // expression typically references the *immediate* parent (e.g.
-    // `g.items` inside `t.groups.map(g => ...)` body), so the check failed
-    // and the loop fell through to the static `forEach` branch. Result:
-    // additions / removals at the deepest level silently never reached
-    // the DOM.
+    // Originally (the O-8 narrowing fix), `emitInnerLoopSetup` decided "is
+    // this loop reactive?" by checking the IR's `inner.refsOuterParam` — a
+    // flag set at collect time against the *outermost* loop's param only.
+    // At depth 2+, the array expression typically references the
+    // *immediate* parent (e.g. `g.items` inside `t.groups.map(g => ...)`
+    // body), so the check failed and the loop fell through to the static
+    // `forEach` branch. Result: additions / removals at the deepest level
+    // silently never reached the DOM.
     //
-    // Fix: re-check dynamically at each level against the parent param
-    // passed in, and narrow the parent param when recursing into child
-    // levels.
+    // O-8's own fix: re-check dynamically at each level against the parent
+    // param passed in, and narrow the parent param when recursing into
+    // child levels. #2865 later removed the reactive/static fork (and
+    // `refsOuterParam` with it) entirely — every level is unconditionally
+    // reactive now — so this assertion holds trivially, but the test stays
+    // as a regression pin on "every depth gets its own `mapArray`."
     const source = `
       'use client'
       import { createSignal } from '@barefootjs/client'
@@ -293,10 +296,13 @@ describe('plain nested loops without conditional wrapper', () => {
     // locals — `initChild`'s prop getter would throw `ReferenceError` when
     // the child component first mounted.
     //
-    // Fix: thread `inner.mapPreamble` through `InnerLoopStaticEmit` and emit
-    // it (raw — `forEach`'s param is the literal item, not a signal accessor)
-    // at the top of the forEach body so the component setup can resolve the
-    // locals.
+    // Fix: thread `inner.mapPreamble` through the static-array-child-init
+    // emission (`build-static-array-child-init.ts` — the OUTER array here
+    // is a literal, so this is unrelated to #2865's nested-loop reactive/
+    // static fork, which only ever applied under a REACTIVE outer loop)
+    // and emit it (raw — `forEach`'s param is the literal item, not a
+    // signal accessor) at the top of the forEach body so the component
+    // setup can resolve the locals.
     const source = `
       'use client'
       import { createSignal } from '@barefootjs/client'
@@ -442,13 +448,17 @@ describe('plain nested loops without conditional wrapper', () => {
     expect(section.indexOf('const rowTag')).toBeLessThan(section.indexOf('initChild'))
   })
 
-  test('regression #1064: control-flow static inner forEach (signal outer + literal-array inner) emits inner preamble', () => {
-    // The `control-flow/inner-loop.ts::emitStatic` path fires when a
-    // reactive composite renderItem hosts a static inner loop — the
-    // outer array is a signal, but the inner array is referenced via
-    // a non-reactive lookup so its rendering stays setup-only.
-    // Use a `__innerIdx<uid>` suffix in the regex to specifically
-    // target this path (vs. the unsuffixed `static-array-child-init`).
+  test('regression #1064: reactive inner mapArray (signal outer + non-outer-derived inner array) emits inner preamble', () => {
+    // The reactive composite renderItem hosts an inner loop whose array is
+    // a non-outer-derived lookup (a module-level constant here — could just
+    // as easily be a signal, a memo, or a prop). Before #2865, an inner
+    // array not referencing the outer loop param routed to
+    // `control-flow/inner-loop.ts::emitStatic` — a hydration-only `forEach`
+    // that silently never re-ran the row's own preamble/reactivity on a
+    // later update. That fork is gone: every inner loop now gets the full
+    // `mapArray` emission. Use a `__innerIdx<uid>` suffix in the regex to
+    // specifically target the nested `mapArray` (vs. the unsuffixed
+    // `static-array-child-init` for a fully-static OUTER array).
     const source = `
       'use client'
       import { createSignal } from '@barefootjs/client'
@@ -480,8 +490,12 @@ describe('plain nested loops without conditional wrapper', () => {
     expect(result.errors.filter(e => e.severity === 'error')).toHaveLength(0)
     const js = result.files.find(f => f.type === 'clientJs')!.content
 
-    // The static forEach uses a `__innerIdx<uid>` suffix in this path —
-    // assert preamble appears in that body and precedes any prop read.
-    expect(js).toMatch(/SHARED\.forEach\(\(cell, __innerIdx\d+_\d+\) => \{[\s\S]*?const\s+tag\s*=/)
+    // The inner mapArray's renderItem uses a `__innerIdx<uid>` suffix —
+    // assert the preamble appears in that body, re-derived from the
+    // ACCESSOR form of both the outer and inner loop params (`row()`,
+    // `cell()`), and precedes the child-component prop read.
+    expect(js).toMatch(
+      /mapArray\(\(\) => SHARED \|\| \[\], .*?, \(cell, __innerIdx\d+_\d+, __existing\) => \{[\s\S]*?const\s+tag\s*=\s*`\$\{row\(\)\.key\}-\$\{cell\(\)\.n\}`[\s\S]*?upsertChild/
+    )
   })
 })

package/src/__tests__/nested-loop-reactive-attrs.test.ts

@@ -140,8 +140,10 @@ describe('reactive attributes inside a nested .map() body (#135)', () => {
     const content = result.files.find((f) => f.type === 'clientJs')!.content
 
     // `data-off` uses the truthy-check shape (no `__v != null` for this
-    // attribute) so a concrete `false` removes the attribute.
-    expect(content).toMatch(/createEffect\(\(\) => \{[\s\S]*?if \(c\(\)\.isOff\)\s*\S+\.setAttribute\('data-off',\s*''\)/)
+    // attribute) so a concrete `false` removes the attribute. The dedup
+    // guard (#2869) computes into `__x` first, so the truthy check reads
+    // `__x`, not `c().isOff` inline.
+    expect(content).toMatch(/createEffect\(\(\) => \{[\s\S]*?const __x = c\(\)\.isOff[\s\S]*?if \(__x\)\s*\S+\.setAttribute\('data-off',\s*''\)/)
     // aria-* keeps the explicit "true" value per WAI-ARIA.
     expect(content).toContain("setAttribute('aria-pressed', 'true')")
   })
@@ -233,8 +235,11 @@ describe('reactive attributes inside a nested .map() body (#135)', () => {
     // and the inner-loop reactive `createEffect` (must be `task().id`
     // to subscribe to the per-item accessor). The bug we're locking
     // down is purely in the createEffect emission, so scope to that.
+    // The object literal now sits in the dedup guard's `const __x = {...}`
+    // temp (#2869) — `styleToCss` reads it back as `styleToCss(__x)`, not
+    // the object literal inline.
     const effectMatch = content.match(
-      /createEffect\(\(\) => \{[\s\S]*?styleToCss\(\{[\s\S]*?\}\)[\s\S]*?__ta_s\d+\.setAttribute\('style'/,
+      /createEffect\(\(\) => \{[\s\S]*?const __x = \{[\s\S]*?\}[\s\S]*?styleToCss\(__x\)[\s\S]*?__ta_s\d+\.setAttribute\('style'/,
     )
     expect(effectMatch).not.toBeNull()
     const effectBody = effectMatch![0]
@@ -282,8 +287,11 @@ describe('reactive attributes inside a nested .map() body (#135)', () => {
     const result = compileJSX(source, 'G.tsx', { adapter })
     expect(result.errors).toHaveLength(0)
     const content = result.files.find((f) => f.type === 'clientJs')!.content
+    // The object literal now sits in the dedup guard's `const __x = {...}`
+    // temp (#2869) — `styleToCss` reads it back as `styleToCss(__x)`, not
+    // the object literal inline.
     const effectMatch = content.match(
-      /createEffect\(\(\) => \{[\s\S]*?styleToCss\(\{[\s\S]*?\}\)[\s\S]*?__ta_s\d+\.setAttribute\('style'/,
+      /createEffect\(\(\) => \{[\s\S]*?const __x = \{[\s\S]*?\}[\s\S]*?styleToCss\(__x\)[\s\S]*?__ta_s\d+\.setAttribute\('style'/,
     )
     expect(effectMatch).not.toBeNull()
     const effectBody = effectMatch![0]
@@ -394,8 +402,10 @@ describe('reactive attributes inside a nested .map() body (#135)', () => {
     // The helper call must appear inside a createEffect alongside the
     // textContent write — `labelAt(` also appears in the static template
     // clone, so asserting it independently would pass even with the
-    // effect missing (the exact regression here).
-    expect(content).toMatch(/createEffect\(\(\) => \{[\s\S]*?__bfw_\w+\('s\d+', String\(labelAt\(pi\)\)\)/)
+    // effect missing (the exact regression here). `pi` reads the row's
+    // live index accessor (#2859), so `labelAt(pi())` also stays correct
+    // if this innermost loop's rows ever survive a same-key reorder.
+    expect(content).toMatch(/createEffect\(\(\) => \{[\s\S]*?__bfw_\w+\('s\d+', String\(labelAt\(pi\(\)\)\)\)/)
     expect(content).toContain("setAttribute('class'")
   })
 })

package/src/__tests__/preamble-branch-arm-rerun.test.ts

@@ -0,0 +1,135 @@
+/**
+ * Codegen-shape pins for the loop-row branch-arm preamble gap (#2596/#2447
+ * follow-up, found while discussing #2869's aftermath). Companion to the
+ * behavioral test in
+ * `packages/client/__tests__/runtime/preamble-branch-attr-staleness.test.ts`,
+ * which is the one that actually proves the fix works end to end — this
+ * file pins the exact emitted shape so a future refactor of
+ * `stringifyLoopChildArm`/`stringifyBranchReactiveAttrs`/
+ * `stringifyLoopChildConditional` can't silently drop the preamble re-run
+ * again.
+ *
+ * Two sites were fixed together: a reactive ATTRIBUTE inside a loop row's
+ * branch conditional that reads a `.map()` preamble local (case a), and a
+ * NESTED conditional's own CONDITION expression doing the same (case b,
+ * #2596 one nesting level deeper than the already-fixed outer-conditional
+ * case pinned by `preamble-conditional-reactivity.test.ts`). Case c is the
+ * negative control: no preamble local in play, so nothing should be
+ * injected.
+ */
+
+import { describe, test, expect } from 'bun:test'
+import { compileJSX } from '../compiler'
+import { TestAdapter } from '../adapters/test-adapter'
+
+const adapter = new TestAdapter()
+
+function clientJsFor(source: string, filename: string): string {
+  const result = compileJSX(source, filename, { adapter })
+  expect(result.errors).toHaveLength(0)
+  const clientJs = result.files.find(f => f.type === 'clientJs')?.content
+  if (!clientJs) throw new Error('No client JS emitted')
+  return clientJs
+}
+
+describe('#2596/#2447 follow-up — preamble re-run inside a loop-row branch arm', () => {
+  test('(a) an attribute inside a branch arm re-runs the preamble before reading it', () => {
+    const source = `'use client'
+import { createSignal } from '@barefootjs/client'
+type Row = { id: number; tier: string }
+export function List() {
+  const [visible] = createSignal(true)
+  const [rows] = createSignal<Row[]>([{ id: 1, tier: 'gold' }])
+  return (
+    <ul>
+      {rows().map(row => {
+        const cls = 'tier-' + row.tier
+        return (
+          <li key={row.id}>
+            {visible() ? <span class={cls} id="target">{row.tier}</span> : <span>x</span>}
+          </li>
+        )
+      })}
+    </ul>
+  )
+}
+`
+    const js = clientJsFor(source, 'List.tsx')
+
+    // Pin the eager per-row mapArray path (not lazy-row, not relevant here
+    // but keeps this fixture stable if eligibility ever widens).
+    expect(js).toContain('mapArray(')
+
+    // The outer conditional's own getter is NOT preamble-guarded (`visible`
+    // is a plain signal, no preamble read) — stays bare.
+    expect(js).toContain("insert(__el, 's0', () => visible(), {")
+
+    // The arm's attr effect re-runs the preamble before reading `cls`.
+    const disposerStart = js.indexOf('const __disposers = []')
+    const disposerEnd = js.indexOf('return () => __disposers.forEach')
+    const arm = js.slice(disposerStart, disposerEnd)
+    const preambleAt = arm.indexOf("const cls = 'tier-' + row().tier;")
+    const readAt = arm.indexOf('const __x = cls')
+    expect(preambleAt).toBeGreaterThanOrEqual(0)
+    expect(readAt).toBeGreaterThan(preambleAt)
+  })
+
+  test('(b) a nested conditional inside a branch arm re-runs the preamble in its own condition getter', () => {
+    const source = `'use client'
+import { createSignal } from '@barefootjs/client'
+type Row = { id: number; tier: string }
+export function List() {
+  const [visible] = createSignal(true)
+  const [selected] = createSignal(1)
+  const [rows] = createSignal<Row[]>([{ id: 1, tier: 'gold' }])
+  return (
+    <ul>
+      {rows().map(row => {
+        const cls = 'tier-' + row.tier
+        const on = selected() === row.id
+        return (
+          <li key={row.id}>
+            {visible() ? <div><span>{cls}</span>{on ? <em id="yes">yes</em> : <em id="no">no</em>}</div> : <span>x</span>}
+          </li>
+        )
+      })}
+    </ul>
+  )
+}
+`
+    const js = clientJsFor(source, 'List2.tsx')
+
+    expect(js).toMatch(
+      /insert\(__branchScope, 's\d+', \(\) => \{ const cls = 'tier-' \+ row\(\)\.tier; const on = selected\(\) === row\(\)\.id;; return \(on\) \}, \{/,
+    )
+  })
+
+  test('(c) negative control — no preamble local in play, nothing injected', () => {
+    const source = `'use client'
+import { createSignal } from '@barefootjs/client'
+type Row = { id: number; tier: string }
+export function List() {
+  const [visible] = createSignal(true)
+  const [rows] = createSignal<Row[]>([{ id: 1, tier: 'gold' }])
+  return (
+    <ul>
+      {rows().map(row => (
+        <li key={row.id}>
+          {visible() ? <span class={row.tier} id="target">{row.tier}</span> : <span>x</span>}
+        </li>
+      ))}
+    </ul>
+  )
+}
+`
+    const js = clientJsFor(source, 'List3.tsx')
+
+    expect(js).not.toContain('const cls =')
+    // The attr effect still exists and still writes — just with no
+    // preamble re-run ahead of it, since there is nothing to re-run.
+    const disposerStart = js.indexOf('const __disposers = []')
+    const disposerEnd = js.indexOf('return () => __disposers.forEach')
+    const arm = js.slice(disposerStart, disposerEnd)
+    expect(arm).toContain("setAttribute('class'")
+  })
+})

package/src/__tests__/reactive-attrs-in-map.test.ts

@@ -266,17 +266,20 @@ describe('reactive attributes inside .map() callbacks', () => {
     expect(result.errors.filter(e => e.severity === 'error')).toHaveLength(0)
 
     const clientJs = result.files.find(f => f.type === 'clientJs')!.content
-    // The per-item style binding must be wired through a createEffect that
-    // re-reads the helper and writes the style attribute, so it tracks the
-    // `items()` signal and updates after hydration. Pin the helper call
-    // *inside* the createEffect alongside the style write — `widthAt(` also
+    // The per-item style binding must be wired reactively — re-reading the
+    // helper and writing the style attribute, so it tracks the `items()`
+    // signal and updates after hydration, rather than being baked into the
+    // item template once. This row has no ref/child component/inner loop,
+    // so it is lazy-eligible (#2859 follow-on): `widthAt(i)` reads the
+    // index (forcing `applyItem`) and closes over `items()` opaquely
+    // (forcing `applyOuter` too, via the re-subscribe seam), so BOTH apply
+    // bodies re-evaluate it, not a `createEffect`. Pin the helper call
+    // *inside* `applyItem` alongside the style write — `widthAt(` also
     // appears in the static template clone, so asserting it independently
-    // could pass even if the effect was missing (the exact regression here).
-    // The index resolves to the loop's renderItem index param, in scope
-    // inside the factory.
-    expect(clientJs).toMatch(
-      /createEffect\(\(\)\s*=>\s*\{[\s\S]*?widthAt\([\s\S]*?setAttribute\('style'/,
-    )
+    // could pass even if the reactive wiring were missing (the exact
+    // regression here).
+    const applyItem = clientJs.slice(clientJs.indexOf('applyItem:'), clientJs.indexOf('applyOuter:'))
+    expect(applyItem).toMatch(/widthAt\([\s\S]*?setAttribute\('style'/)
   })
 
   test('keyed loop: `key` prop is not emitted as a reactive DOM attribute', () => {

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

@@ -124,3 +124,40 @@ export { Comp }
     expect(js).toContain("items.map((tag) => tag.a).join(',') + _p.tag")
   })
 })
+
+// #2828 follow-up (pullfrog review on #2853): `collectBranchLocalPropRefsViaSubstitution`
+// (jsx-to-ir.ts) is a second, independent AST walk that decides whether a
+// branch-local variable's TRANSITIVE prop dependency gets unioned into a
+// reactive expression's rewrite — same "is this a value reference" question
+// #2828 fixed in `collectAstPropRefs`, but this walk had its own,
+// un-fixed `isShorthand` exclusion. A branch-local whose own initializer
+// reads a prop, referenced via object-literal shorthand inside a REACTIVE
+// expression, had its prop dependency silently dropped: the emitted
+// module-scope hydrate template lambda kept a bare, unprefixed reference
+// to the prop name instead of `_p.<prop>`.
+describe('branch-local transitive prop-dep via shorthand reference (#2828 follow-up)', () => {
+  test('a branch-local read from a prop, referenced via shorthand, still resolves to _p.<prop> in the hydrate template', () => {
+    const source = `
+"use client"
+import { createSignal } from '@barefootjs/client'
+export function Comp({ tag }: { tag: string }) {
+  const [n] = createSignal(0)
+  if (n() > 0) {
+    const local = tag
+    return <div data-x={JSON.stringify({ local }) + n()}>{n()}</div>
+  }
+  return <div>none</div>
+}
+`
+    const js = compileClientJs(source)
+    // Pre-fix: the hydrate template's module-scope lambda kept a bare
+    // `tag` reference (no binding at that scope -- ReferenceError at pure
+    // CSR mount). Post-fix: it resolves through `_p.tag` like every other
+    // prop reference. (The surrounding `{ (_p.tag) }` shape -- the branch-
+    // local substitution dropping the shorthand's own key -- is a
+    // separate, pre-existing defect tracked independently; this test pins
+    // only the prop-dependency question #2828's follow-up fixed.)
+    expect(js).not.toContain('{ (tag) }')
+    expect(js).toContain('{ (_p.tag) }')
+  })
+})

package/src/__tests__/safe-html-splice-door.test.ts

@@ -0,0 +1,61 @@
+/**
+ * Direct unit tests for `spliceChildValue`'s arm order (#2795 follow-up).
+ *
+ * The door's arm order changed during the #2795 migration:
+ * `node.joinArrayChild` is now checked BEFORE `cx.branchSlotsVar`. Before,
+ * `irToHtmlTemplate` wrapped an array in `__bfSlot` first and joined after —
+ * for an element-array child (`{out}`, built by an arbitrary `.map()`
+ * preamble) rendered INSIDE a conditional branch, that would have handed
+ * `__bfSlot` the whole array-join expression, which stringifies an array
+ * argument via `String(...)`-style coercion internally rather than joining
+ * compiled-leaf HTML — corrupting already-escaped leaf markup. Joining first
+ * (the current order) hands `__bfSlot` a single already-assembled HTML
+ * string instead.
+ *
+ * PR #2858 shipped this reorder without a test exercising the co-occurrence
+ * (join-array-child AND branch-slot at once) — this file is that test,
+ * added directly against the door function rather than a full JSX compile,
+ * since the arm order is entirely `spliceChildValue`'s own concern.
+ */
+
+import { describe, test, expect } from 'bun:test'
+import { spliceChildValue } from '../ir-to-client-js/safe-html'
+
+describe('spliceChildValue arm order', () => {
+  test('joinArrayChild wins over branchSlotsVar — the array is joined, not handed to __bfSlot', () => {
+    const result = spliceChildValue(
+      { expr: 'out', slotId: null, joinArrayChild: true },
+      'out',
+      { branchSlotsVar: 'slots' },
+    )
+    expect(result).toBe(`Array.isArray(out) ? out.join('') : (out ?? '')`)
+    expect(result).not.toContain('__bfSlot')
+  })
+
+  test('branchSlotsVar alone (no joinArrayChild) still routes through __bfSlot', () => {
+    const result = spliceChildValue(
+      { expr: 'value', slotId: null, joinArrayChild: false },
+      'value',
+      { branchSlotsVar: 'slots' },
+    )
+    expect(result).toBe('__bfSlot(value, slots)')
+  })
+
+  test('neither joinArrayChild nor branchSlotsVar nor slotId nor children — plain escapeText default', () => {
+    const result = spliceChildValue(
+      { expr: 'label', slotId: null, joinArrayChild: false },
+      'label',
+      {},
+    )
+    expect(result).toBe('escapeText(label)')
+  })
+
+  test('a markup-claimed slotId still escapes-or-unwraps even with joinArrayChild absent', () => {
+    const result = spliceChildValue(
+      { expr: 'title', slotId: 's0', joinArrayChild: false },
+      '(title)',
+      { markupSlotIds: new Set(['s0']) },
+    )
+    expect(result).toBe('escapeTextOrMarkup((title))')
+  })
+})

package/src/__tests__/ssr-defaults.test.ts

@@ -499,6 +499,65 @@ describe('extractSsrDefaults', () => {
     // it does not abort the whole computation.
     expect(defaults?.x).toEqual({ value: [1, null] })
   })
+
+  // #2813 (pullfrog nitpick on the PR fixing it): a bare local-const alias
+  // of a signal getter must be seeded under its OWN name too, alongside
+  // the getter's — a template-stash adapter's `.map()` loop over
+  // `items__alias()` looks up the stash entry by that name, which the
+  // getter-name-only seeding above never creates.
+  test('a bare local-const alias of a signal getter is seeded under the alias name too', () => {
+    const metadata = metadataFor(`
+      'use client'
+      import { createSignal } from '@barefootjs/client'
+      function C() {
+        const [items] = createSignal([1, 2, 3])
+        const items__alias = items
+        return <ul>{items__alias().map(n => <li key={n}>{n}</li>)}</ul>
+      }
+    `)
+
+    const defaults = extractSsrDefaults(metadata)
+    expect(defaults?.items).toEqual({ value: [1, 2, 3] })
+    expect(defaults?.items__alias).toEqual({ value: [1, 2, 3] })
+  })
+
+  test('a multi-hop local-const alias chain resolves through every link', () => {
+    const metadata = metadataFor(`
+      'use client'
+      import { createSignal } from '@barefootjs/client'
+      function C() {
+        const [items] = createSignal([1, 2, 3])
+        const hop1 = items
+        const hop2 = hop1
+        return <ul>{hop2().map(n => <li key={n}>{n}</li>)}</ul>
+      }
+    `)
+
+    const defaults = extractSsrDefaults(metadata)
+    expect(defaults?.items).toEqual({ value: [1, 2, 3] })
+    expect(defaults?.hop1).toEqual({ value: [1, 2, 3] })
+    expect(defaults?.hop2).toEqual({ value: [1, 2, 3] })
+  })
+
+  test('a getter alias shares the ORIGIN entry object, including a self-derivation-collision propName shape', () => {
+    // The origin signal's OWN name collides with the prop its initializer
+    // derives from (#2669), so its entry is a propName-carrying prop
+    // entry, not a plain `{ value }` — the alias must share that exact
+    // shape (same object reference), not re-derive a plain value entry.
+    const metadata = metadataFor(`
+      'use client'
+      import { createSignal } from '@barefootjs/client'
+      function C(props: { label?: string }) {
+        const [label] = createSignal(props.label ?? 'Default')
+        const labelAlias = label
+        return <p>{labelAlias()}</p>
+      }
+    `)
+
+    const defaults = extractSsrDefaults(metadata)
+    expect(defaults?.label).toEqual({ propName: 'label', value: null })
+    expect(defaults?.labelAlias).toBe(defaults?.label)
+  })
 })
 
 // TS twin of the Ruby/Python/PHP/Perl/Rust `derive*FromDefaults` runtime