@barefootjs/go-template 0.18.5 → 0.18.7

package/src/__tests__/go-template-adapter.test.ts

@@ -3239,9 +3239,10 @@ export { C }
     expect(t).toContain('bf_map_eval .Users')
   })
 
-  // The function-reference `.map(format)` BF101 refusal is now covered
-  // cross-adapter by the `array-map-function-reference` shared fixture's
-  // `expectedDiagnostics` entry above.
+  // The function-reference `.map(format)` case is now covered cross-adapter
+  // by the `array-map-function-reference` shared fixture — `format` resolves
+  // to its declaration (#2206) and the fixture compiles clean rather than
+  // refusing with BF101.
 })
 
 describe('GoTemplateAdapter - #1448 Tier C .flatMap(field projection)', () => {
@@ -3865,3 +3866,706 @@ export function TodoList(props: { todos?: Todo[] }) {
     expect(types).toContain('TodoItems []')
   })
 })
+
+// #2228: a `.filter(t => …).map(todo => <Child todo={todo} .../>)` loop whose
+// body is a single child component ranges the WRAPPER slice (`.TodoItems`,
+// `.{ChildName}s` — see #2130 above), so `{{if}}`'s dot context for the
+// filter predicate is the wrapper `TodoItemProps` struct, not the raw datum.
+// `t.done` used to lower straight to `.Done` regardless — a field that only
+// exists on the raw `Todo`, nested under whichever prop forwards the loop
+// param verbatim (`todo={todo}` → `.Todo`). `html/template` resolves struct
+// fields at EXECUTE time, not Go-compile time, so this shipped silently
+// until a predicate branch that isn't short-circuited away actually ran
+// (discovered via #2209's `buildDynamicChildLoopSeeding`, which populates
+// `.TodoItems` in the test harness — previously always empty).
+describe('GoTemplateAdapter - filter predicate qualifies through wrapper-slice datum field (#2228)', () => {
+  // Same block-body filter shape as TodoAppSSR.tsx (`filter(t => { const f =
+  // filter(); if (f === 'active') return !t.done; if (f === 'completed')
+  // return t.done; return true })`), folded to one expression by #2040's
+  // `predicateTernaryToLogical`. `filter`'s SSR default is `'active'` (not
+  // `'all'`) specifically so `!t.done` is REACHABLE — `'all'`'s short-circuit
+  // is exactly what hid this bug in the shipped todo-app-ssr fixture.
+  const TODO_FILTER_PROBE_SOURCE = `
+'use client'
+import { createSignal } from '@barefootjs/client'
+import { TodoItem } from './todo-item'
+
+type Todo = { id: number; text: string; done: boolean }
+type Filter = 'all' | 'active' | 'completed'
+
+export function TodoFilterProbe(props: { initialTodos?: Todo[] }) {
+  const [todos] = createSignal<Todo[]>(props.initialTodos ?? [])
+  const [filter] = createSignal<Filter>('active')
+
+  return (
+    <ul>
+      {todos().filter(t => {
+        const f = filter()
+        if (f === 'active') return !t.done
+        if (f === 'completed') return t.done
+        return true
+      }).map(todo => (
+        <TodoItem key={todo.id} todo={todo} />
+      ))}
+    </ul>
+  )
+}
+`
+
+  const TODO_ITEM_SOURCE = `
+type Todo = { id: number; text: string; done: boolean }
+type Props = { todo: Todo }
+export function TodoItem(props: Props) {
+  return <li>{props.todo.text}</li>
+}
+`
+
+  test('emits .Todo.Done, not bare .Done, in the loop-gating {{if}}', () => {
+    const adapter = new GoTemplateAdapter()
+    const ir = compileToIR(TODO_FILTER_PROBE_SOURCE, adapter)
+    const { template } = adapter.generate(ir)
+
+    // The datum-carrying field is derived from the prop that receives the
+    // loop param verbatim (`todo={todo}` → `Todo`, `capitalizeFieldName('todo')`
+    // — the SAME derivation `generatePropsStruct` uses for every other
+    // prop-to-field mapping), not hardcoded.
+    expect(template).toContain('not .Todo.Done')
+    expect(template).toContain('(.Todo.Done)')
+    // The bare (unqualified) form must not survive the fix — this is the
+    // literal string `html/template` failed to resolve pre-fix
+    // (`can't evaluate field Done in type TodoItemProps`).
+    expect(template).not.toContain('not .Done')
+    expect(template).not.toContain('(.Done)')
+    // Still ranges the wrapper slice (#2130's retarget is untouched).
+    expect(template).toContain(':= .TodoItems}}')
+  })
+
+  test('real `go run`: default filter "active" renders only the not-done item', async () => {
+    let html: string
+    try {
+      html = await renderGoTemplateComponent({
+        source: TODO_FILTER_PROBE_SOURCE.trimStart(),
+        adapter: new GoTemplateAdapter(),
+        components: { './todo-item': TODO_ITEM_SOURCE.trimStart() },
+        props: {
+          initialTodos: [
+            { id: 1, text: 'Eat breakfast', done: true },
+            { id: 2, text: 'Write tests', done: false },
+          ],
+        },
+      })
+    } catch (err) {
+      if (err instanceof GoNotAvailableError) {
+        console.log('Skipping #2228 filter-predicate e2e: go command not found')
+        return
+      }
+      throw err
+    }
+    // Pre-fix this either 500s at `tmpl.ExecuteTemplate` (`can't evaluate
+    // field Done in type TodoItemProps`) or — since `bf_sort_eval`-style
+    // evaluators are untouched by this fix, only the html/template dot-path
+    // is — renders wrong. Post-fix: only the not-done todo (id 2) survives
+    // the 'active' filter.
+    expect(html).not.toContain('Eat breakfast')
+    expect(html).toContain('Write tests')
+    expect(html).toContain('data-key="2"')
+    expect(html).not.toContain('data-key="1"')
+  })
+})
+
+// #2208: a static-array loop whose body is a single child component with a
+// plain-value prop set bakes the per-item props/data-key directly into the
+// generated constructor — see `analyzeBakeableStaticChildLoop`
+// (`analysis/static-child-loop-bake.ts`). Two-file fixture shape (sibling
+// `list-item.tsx`, `siblingTemplatesRegistered: true`) since Go's own BF103
+// cross-template-registration check (independent of #2208) would otherwise
+// fire first — mirrors `jsx-runner.ts`'s `compileWithDiagnostics`.
+describe('GoTemplateAdapter - static array-of-objects loop source baking (#2208)', () => {
+  const STATIC_LIST_SOURCE = `
+import { ListItem } from './list-item'
+export function StaticList() {
+  const items = [{ label: 'Alpha' }, { label: 'Beta' }]
+  return (
+    <ul>
+      {items.map(item => (
+        <ListItem key={item.label} label={item.label} className="text-sm" />
+      ))}
+    </ul>
+  )
+}
+`
+
+  function compileStaticList(adapter?: GoTemplateAdapter) {
+    return compileJSX(STATIC_LIST_SOURCE, 'test.tsx', {
+      adapter: adapter ?? new GoTemplateAdapter(),
+      siblingTemplatesRegistered: true,
+      outputIR: false,
+    })
+  }
+
+  test('compiles with no BF101 (no longer refused)', () => {
+    const result = compileStaticList()
+    expect(result.errors ?? []).toEqual([])
+  })
+
+  test('constructor bakes each item\'s props and data-key directly', () => {
+    const result = compileStaticList()
+    const types = result.files.find(f => f.type === 'types')!.content
+    expect(types).toContain('NewListItemProps(ListItemInput{Label: "Alpha", ClassName: "text-sm"})')
+    expect(types).toContain('NewListItemProps(ListItemInput{Label: "Beta", ClassName: "text-sm"})')
+    expect(types).toContain('BfDataKey = "Alpha"')
+    expect(types).toContain('BfDataKey = "Beta"')
+  })
+
+  test('the Input struct carries no ListItems field (nothing for a caller to supply)', () => {
+    const result = compileStaticList()
+    const types = result.files.find(f => f.type === 'types')!.content
+    const inputStruct = types.slice(types.indexOf('StaticListInput struct'), types.indexOf('StaticListProps struct'))
+    expect(inputStruct).not.toContain('ListItems')
+  })
+
+  test('the template still ranges over .ListItems (unchanged)', () => {
+    const result = compileStaticList()
+    const template = result.files.find(f => f.type === 'markedTemplate')!.content
+    expect(template).toContain(':= .ListItems}}')
+  })
+
+  test('a runtime-computed const (#2069) still refuses with BF101', () => {
+    const result = compileJSX(
+      `
+import { ListItem } from './list-item'
+export function TagList(props: { tags: string[] }) {
+  const entries = props.tags.filter(t => t !== '')
+  return (
+    <ul>
+      {entries.map(label => (
+        <ListItem key={label} label={label} />
+      ))}
+    </ul>
+  )
+}
+`,
+      'test.tsx',
+      { adapter: new GoTemplateAdapter(), siblingTemplatesRegistered: true },
+    )
+    expect(result.errors?.some(e => e.code === 'BF101')).toBe(true)
+  })
+
+  // Fable review: `bf build` compiles a whole source dir through ONE reused
+  // adapter instance (loop marker ids restart at `l0` per component) — the
+  // bakeability cache must reset every `generate()` or a stale entry from a
+  // PREVIOUS component either silently suppresses this fix, or (worse)
+  // leaks that other component's baked literal values into this one.
+  const TAG_LIST_SOURCE = `
+import { ListItem } from './list-item'
+export function TagList(props: { tags: string[] }) {
+  const entries = props.tags.filter(t => t !== '')
+  return (
+    <ul>
+      {entries.map(label => (
+        <ListItem key={label} label={label} />
+      ))}
+    </ul>
+  )
+}
+`
+
+  test('a reused adapter does not suppress baking for a later component sharing a marker id', () => {
+    const adapter = new GoTemplateAdapter()
+    compileJSX(TAG_LIST_SOURCE, 'test.tsx', { adapter, siblingTemplatesRegistered: true })
+    const second = compileJSX(STATIC_LIST_SOURCE, 'test.tsx', { adapter, siblingTemplatesRegistered: true })
+    expect(second.errors ?? []).toEqual([])
+    const types = second.files.find(f => f.type === 'types')!.content
+    expect(types).toContain('NewListItemProps(ListItemInput{Label: "Alpha"')
+  })
+
+  test('a reused adapter does not leak a prior component\'s baked data into a later runtime-computed one', () => {
+    const adapter = new GoTemplateAdapter()
+    compileJSX(STATIC_LIST_SOURCE, 'test.tsx', { adapter, siblingTemplatesRegistered: true })
+    const second = compileJSX(TAG_LIST_SOURCE, 'test.tsx', { adapter, siblingTemplatesRegistered: true })
+    expect(second.errors?.some(e => e.code === 'BF101')).toBe(true)
+    const types = second.files.find(f => f.type === 'types')!.content
+    expect(types).not.toContain('"Alpha"')
+  })
+
+  // Fable re-review: `generateTypes()` is ALSO a standalone public entry
+  // point (the Go conformance harness in `test-render.ts` calls it
+  // directly on an already-`generate()`d adapter for a sibling/child IR),
+  // not just an internal step of `generate()` — the bake cache must reset
+  // there too, or a marker id collision with a PREVIOUS `generate()` call
+  // leaks that other component's baked data through this door instead.
+  test('a standalone generateTypes() call does not leak a prior generate() pass\'s baked data', () => {
+    const adapter = new GoTemplateAdapter()
+    const tagListIR = compileToIR(TAG_LIST_SOURCE, adapter)
+    adapter.generate(tagListIR, { siblingTemplatesRegistered: true })
+    const staticListIR = compileToIR(STATIC_LIST_SOURCE, adapter)
+    adapter.generate(staticListIR, { siblingTemplatesRegistered: true })
+
+    const types = adapter.generateTypes(tagListIR)
+    expect(types).not.toContain('"Alpha"')
+    expect(types).toContain('ListItems []ListItemInput')
+  })
+
+  // Fable review: a static loop-SOURCE identifier must not resolve through
+  // an outer const when a DIFFERENT, enclosing loop's own callback param
+  // shadows that same name.
+  test('a static const shadowed by an enclosing loop param does not get baked', () => {
+    const result = compileJSX(
+      `
+import { ListItem } from './list-item'
+export function Nested({ groups }: { groups: { label: string }[][] }) {
+  const items = [{ label: 'Alpha' }, { label: 'Beta' }]
+  return (
+    <div>
+      {groups.map((items, i) => (
+        <ul key={i}>
+          {items.map(item => (
+            <ListItem key={item.label} label={item.label} />
+          ))}
+        </ul>
+      ))}
+    </div>
+  )
+}
+`,
+      'test.tsx',
+      { adapter: new GoTemplateAdapter(), siblingTemplatesRegistered: true },
+    )
+    const types = result.files.find(f => f.type === 'types')?.content ?? ''
+    expect(types).not.toContain('"Alpha"')
+  })
+})
+
+// #2224: the two shapes #2208 deliberately left refused.
+//   Shape 1 — a static-array loop whose body is a PLAIN ELEMENT (no child
+//   component): unrolled once per item at template-generation time (no Go
+//   struct synthesis, no `{{range}}`) — see
+//   `analysis/static-element-loop-bake.ts`'s docstring for the exact gate.
+//   Shape 2 — an INLINE, unnamed array literal directly in `.map()`, with
+//   either body kind — routed into shape 1's unroll (element body) or
+//   #2208's existing bake (component body) the same way a named const is.
+describe('GoTemplateAdapter - static array-of-objects loop, plain-element body + inline literal (#2224)', () => {
+  test('shape 1: named const + plain-element body compiles with no BF101', () => {
+    const result = compileJSX(
+      `
+export function List() {
+  const items = [{ label: 'Alpha' }, { label: 'Beta' }]
+  return <ul>{items.map(item => <li key={item.label}>{item.label}</li>)}</ul>
+}
+`,
+      'test.tsx',
+      { adapter: new GoTemplateAdapter() },
+    )
+    expect(result.errors ?? []).toEqual([])
+  })
+
+  test('shape 1: the template is unrolled once per item, no {{range}}', () => {
+    const result = compileJSX(
+      `
+export function List() {
+  const items = [{ label: 'Alpha' }, { label: 'Beta' }]
+  return <ul>{items.map(item => <li key={item.label}>{item.label}</li>)}</ul>
+}
+`,
+      'test.tsx',
+      { adapter: new GoTemplateAdapter() },
+    )
+    const template = result.files.find(f => f.type === 'markedTemplate')!.content
+    expect(template).not.toContain('{{range')
+    // The `<!--bf-loop:id--> ... <!--/bf-loop:id-->` marker pair a dynamic
+    // loop emits still wraps the unrolled body, so the CSR-side static
+    // `forEach` wiring (a separate, unaffected compiler pass) finds the
+    // same DOM range.
+    expect(template).toContain('{{bfComment "loop:l0"}}')
+    expect(template).toContain('{{bfComment "/loop:l0"}}')
+    // Per item: the SAME `data-key` / `bfTextStart`/`bfTextEnd` markers a
+    // dynamic `{{range}}` over `.Field` would emit, with the item's value
+    // substituted as a literal Go string instead of a `.Field` reference.
+    expect(template).toContain('<li data-key="{{"Alpha"}}">{{bfTextStart "s0"}}{{"Alpha"}}{{bfTextEnd}}</li>')
+    expect(template).toContain('<li data-key="{{"Beta"}}">{{bfTextStart "s0"}}{{"Beta"}}{{bfTextEnd}}</li>')
+  })
+
+  test('shape 1 rendered through real `go run` produces the expected HTML', async () => {
+    try {
+      const html = await renderGoTemplateComponent({
+        source: `
+export function List() {
+  const items = [{ label: 'Alpha' }, { label: 'Beta' }]
+  return <ul>{items.map(item => <li key={item.label}>{item.label}</li>)}</ul>
+}
+`,
+        adapter: new GoTemplateAdapter(),
+        props: {},
+      })
+      expect(html).toContain('<li data-key="Alpha"><!--bf:s0-->Alpha<!--/--></li>')
+      expect(html).toContain('<li data-key="Beta"><!--bf:s0-->Beta<!--/--></li>')
+    } catch (err) {
+      if (err instanceof GoNotAvailableError) {
+        console.log('Skipping #2224 shape-1 e2e: go command not found')
+        return
+      }
+      throw err
+    }
+  })
+
+  test('shape 2, element body: inline unnamed array literal compiles and unrolls the same as a named const', () => {
+    const result = compileJSX(
+      `
+export function List() {
+  return <ul>{[{ label: 'Alpha' }, { label: 'Beta' }].map(item => <li key={item.label}>{item.label}</li>)}</ul>
+}
+`,
+      'test.tsx',
+      { adapter: new GoTemplateAdapter() },
+    )
+    expect(result.errors ?? []).toEqual([])
+    const template = result.files.find(f => f.type === 'markedTemplate')!.content
+    expect(template).not.toContain('{{range')
+    expect(template).toContain('{{"Alpha"}}')
+    expect(template).toContain('{{"Beta"}}')
+  })
+
+  test('shape 2, component body: inline unnamed array literal reaches the #2208 constructor bake (previously BF101 "Expression not supported")', () => {
+    const result = compileJSX(
+      `
+import { ListItem } from './list-item'
+export function List() {
+  return (
+    <ul>
+      {[{ label: 'Alpha' }, { label: 'Beta' }].map(item => (
+        <ListItem key={item.label} label={item.label} />
+      ))}
+    </ul>
+  )
+}
+`,
+      'test.tsx',
+      { adapter: new GoTemplateAdapter(), siblingTemplatesRegistered: true },
+    )
+    expect(result.errors ?? []).toEqual([])
+    const types = result.files.find(f => f.type === 'types')!.content
+    expect(types).toContain('NewListItemProps(ListItemInput{Label: "Alpha"})')
+    expect(types).toContain('NewListItemProps(ListItemInput{Label: "Beta"})')
+    // The template still ranges over `.ListItems` (#2208's shape — only the
+    // constructor's data is baked, not the range itself).
+    const template = result.files.find(f => f.type === 'markedTemplate')!.content
+    expect(template).toContain(':= .ListItems}}')
+  })
+
+  test('gate: a body expression that cannot fold against the item (a signal-shaped call) keeps the BF101 refusal', () => {
+    const result = compileJSX(
+      `
+export function List() {
+  const items = [{ label: 'Alpha' }, { label: 'Beta' }]
+  return <ul>{items.map(item => <li key={item.label}>{item.label} - {Date.now()}</li>)}</ul>
+}
+`,
+      'test.tsx',
+      { adapter: new GoTemplateAdapter() },
+    )
+    expect(result.errors?.some(e => e.code === 'BF101')).toBe(true)
+    const template = result.files.find(f => f.type === 'markedTemplate')?.content ?? ''
+    expect(template).not.toContain('{{"Alpha"}}')
+  })
+
+  test('gate: an index-param reference keeps the BF101 refusal (index is deliberately not folded)', () => {
+    const result = compileJSX(
+      `
+export function List() {
+  const items = [{ label: 'Alpha' }, { label: 'Beta' }]
+  return <ul>{items.map((item, i) => <li key={item.label}>{i}: {item.label}</li>)}</ul>
+}
+`,
+      'test.tsx',
+      { adapter: new GoTemplateAdapter() },
+    )
+    expect(result.errors?.some(e => e.code === 'BF101')).toBe(true)
+  })
+
+  test('gate: a nested loop inside the body keeps the BF101 refusal', () => {
+    const result = compileJSX(
+      `
+export function List() {
+  const items = [{ label: 'Alpha', tags: ['x', 'y'] }]
+  return <ul>{items.map(item => <li key={item.label}>{item.tags.map(t => <span>{t}</span>)}</li>)}</ul>
+}
+`,
+      'test.tsx',
+      { adapter: new GoTemplateAdapter() },
+    )
+    expect(result.errors?.some(e => e.code === 'BF101')).toBe(true)
+  })
+
+  test('gate: a non-scalar item field (array/object) keeps the BF101 refusal', () => {
+    const result = compileJSX(
+      `
+export function List() {
+  const items = [{ label: 'Alpha', tags: ['x'] }]
+  return <ul>{items.map(item => <li key={item.label}>{item.tags}</li>)}</ul>
+}
+`,
+      'test.tsx',
+      { adapter: new GoTemplateAdapter() },
+    )
+    expect(result.errors?.some(e => e.code === 'BF101')).toBe(true)
+  })
+
+  test('gate: .flatMap() keeps the BF101 refusal (out of scope)', () => {
+    const result = compileJSX(
+      `
+export function List() {
+  const items = [{ label: 'Alpha' }, { label: 'Beta' }]
+  return <ul>{items.flatMap(item => [<li key={item.label}>{item.label}</li>])}</ul>
+}
+`,
+      'test.tsx',
+      { adapter: new GoTemplateAdapter() },
+    )
+    expect(result.errors?.some(e => e.code === 'BF101')).toBe(true)
+  })
+
+  test('a static const shadowed by an enclosing loop param does not get unrolled (element body)', () => {
+    const result = compileJSX(
+      `
+export function Nested({ groups }: { groups: { label: string }[][] }) {
+  const items = [{ label: 'Alpha' }, { label: 'Beta' }]
+  return (
+    <div>
+      {groups.map((items, i) => (
+        <ul key={i}>
+          {items.map(item => (
+            <li key={item.label}>{item.label}</li>
+          ))}
+        </ul>
+      ))}
+    </div>
+  )
+}
+`,
+      'test.tsx',
+      { adapter: new GoTemplateAdapter() },
+    )
+    const template = result.files.find(f => f.type === 'markedTemplate')?.content ?? ''
+    expect(template).not.toContain('{{"Alpha"}}')
+  })
+})
+
+// #2236: two independent loop-param-shadowing gaps, both distinct from the
+// #2224 static-array unroll above (this describe exercises the DYNAMIC
+// (signal-driven) `{{range}}` path, where a real per-iteration `.` context
+// exists — #2224's baked/unrolled loops are a different code path entirely).
+//
+// Slice A: `convertExpressionToGo`'s bare-identifier fast path (the
+// "inline a function-scope literal const" shortcut, e.g. `totalPages`) is a
+// STRING-KEYED check over the raw JS source text reached directly by call
+// sites like attribute emission (`key={count}` → `data-key`) — it never
+// goes through `identifier()` (the `ParsedExprEmitter` method), which
+// already carries the loop-shadow guards (`loopParamStack` /
+// `isOuterLoopParam`, mirrored from `resolveModuleStringConst` /
+// `resolveModuleNumericConst`). So a `.map((count) => ...)` callback param
+// that shadows an outer `const count = 7` got the OUTER literal inlined at
+// the `data-key` position even though the text position (which DOES go
+// through `identifier()`) correctly resolved to the per-item value.
+//
+// Slice B: Go's `collectStringValueNames` (prop-classes.ts) was ported from
+// Blade BEFORE #2212 added the local-const inclusion + `collectLoopBoundNames`
+// exclusion, so an outer string-typed prop/signal whose name is shadowed by a
+// `.map()` callback param still poisoned the shadowed occurrence's type
+// resolution — `1 + label` inside `values.map((label) => ...)` (with an outer
+// `label: string` prop) emitted `bf_concat_str` (string concat) instead of
+// `bf_add` (numeric addition). The full #2212 shape is ported: same-file
+// local consts join the set (so an outer `{label + suffix}` with
+// `suffix = '!'` still classifies as concat via its OTHER operand once
+// `label` is subtracted — the exact `loop-param-shadows-outer-name` fixture
+// shape) and loop-bound names are excluded.
+describe('GoTemplateAdapter - const/type resolution vs loop-param shadowing (#2236)', () => {
+  test('slice A: data-key inside a dynamic (signal-driven) loop uses the loop value, not the outer const', () => {
+    const { template } = compileAndGenerate(`
+'use client'
+import { createSignal } from '@barefootjs/client'
+export function List() {
+  const count = 7
+  const [nums] = createSignal<number[]>([2, 5])
+  return <ul>{nums().map((count) => <li key={count}>{count * 3}</li>)}</ul>
+}
+`)
+    // The range establishes a real per-iteration dot context — both the
+    // `data-key` attribute and the text position must resolve the shadowed
+    // `count` through it.
+    expect(template).toContain('{{range $_, $count := .Nums}}<li data-key="{{.}}">')
+    expect(template).toContain('{{bf_mul . 3}}')
+    // Never the outer `const count = 7` literal.
+    expect(template).not.toContain('{{7}}')
+  })
+
+  test('slice A: a DESTRUCTURED callback binding shadowing an outer const resolves to the binding accessor (#2242 Copilot review)', () => {
+    // Destructured callbacks push '' onto loopParamStack and track their
+    // binding names only in loopBindingStack — the fast-path guard must
+    // scan that stack too, or the outer `const id = 7` inlines at both
+    // the key and text positions.
+    const { template } = compileAndGenerate(`
+'use client'
+import { createSignal } from '@barefootjs/client'
+export function List() {
+  const id = 7
+  const [items] = createSignal<{ id: number }[]>([{ id: 2 }, { id: 5 }])
+  return <ul>{items().map(({ id }) => <li key={id}>{id}</li>)}</ul>
+}
+`)
+    expect(template).toContain('data-key="{{$__bf_item0.ID}}"')
+    expect(template).toContain('{{$__bf_item0.ID}}{{bfTextEnd}}')
+    expect(template).not.toContain('{{7}}')
+  })
+
+  test('record-member fast path: a module object const shadowed by the callback param resolves per-item (loop-param-shadows-record-const fixture)', () => {
+    // resolveStaticRecordLiteralIndex covers IDENT['key'] AND IDENT.key —
+    // the record-member sibling of the bare-identifier gap above. Without
+    // the isLoopShadowedName guard it baked {{"outer-lit"}} into every
+    // iteration.
+    const { template } = compileAndGenerate(`
+const cfg = { x: 'outer-lit' }
+export function List({ rows }: { rows: { id: number; x: string }[] }) {
+  return <ul>{rows.map((cfg) => <li key={cfg.id}>{cfg.x}</li>)}</ul>
+}
+`)
+    expect(template).toContain('{{range $_, $cfg := .Rows}}')
+    expect(template).toContain('{{.X}}')
+    expect(template).not.toContain('outer-lit')
+  })
+
+  test('slice B: `1 + label` inside the loop that shadows an outer string prop lowers to bf_add, not bf_concat_str', () => {
+    const { template } = compileAndGenerate(`
+'use client'
+export function Labels({ label, values }: { label: string; values: number[] }) {
+  return <ul>{values.map((label) => <li key={label}>{1 + label}</li>)}</ul>
+}
+`)
+    expect(template).toContain('{{bf_add 1 .}}')
+    expect(template).not.toContain('bf_concat_str')
+  })
+
+  test('regression pin: a const inlined OUTSIDE any loop still inlines (slice A must not over-guard)', () => {
+    const { template } = compileAndGenerate(`
+export function Foo() {
+  const total = 5
+  return <div data-key={total}>{total}</div>
+}
+`)
+    expect(template).toContain('data-key="{{5}}"')
+    expect(template).toContain('{{5}}</div>')
+  })
+
+  test('regression pin: a genuinely string-typed `+` OUTSIDE the loop still lowers to bf_concat_str (slice B must not over-guard)', () => {
+    const { template } = compileAndGenerate(`
+export function Foo({ label }: { label: string }) {
+  const suffix = '!'
+  return <p>{label + suffix}</p>
+}
+`)
+    expect(template).toContain('bf_concat_str .Label .Suffix')
+  })
+
+  test('local-const operand carries the concat classification when the prop operand is coarsely excluded (fixture shape)', () => {
+    // The `loop-param-shadows-outer-name` fixture's combined shape: `label`
+    // is loop-bound below, so the coarse exclusion strips it from the string
+    // set — the OUTER `{label + suffix}` must then classify as concat via
+    // its `suffix = '!'` local-const operand (the #2212 local-const
+    // inclusion), or it would fall back to `bf_add` and render `0`.
+    const { template } = compileAndGenerate(`
+'use client'
+import { createSignal } from '@barefootjs/client'
+export function Both({ label, values }: { label: string; values: number[] }) {
+  const suffix = '!'
+  const [n, setN] = createSignal(0)
+  return (
+    <div data-n={n()} onClick={() => setN(n() + 1)}>
+      <p>{label + suffix}</p>
+      <ul>{values.map((label) => <li key={label}>{1 + label}</li>)}</ul>
+    </div>
+  )
+}
+`)
+    // Outside the loop: still string concat, carried by the const operand.
+    expect(template).toContain('bf_concat_str .Label .Suffix')
+    // Inside the loop: the shadowed occurrence stays numeric.
+    expect(template).toContain('{{bf_add 1 .}}')
+  })
+
+  // Go's slice-A guard is scope-PRECISE: it consults the live
+  // `loopParamStack`, not a flat component-wide name set, so a const whose
+  // name is loop-bound ELSEWHERE in the component still inlines at an
+  // occurrence that is genuinely outside any loop. This is a real point of
+  // divergence from the Twig-family adapters' coarse `collectLoopBoundNames`
+  // trade-off — pinned here so a future "fix" doesn't accidentally coarsen
+  // Go's precise guard to match them.
+  test('slice A guard is scope-precise: a name that is loop-bound elsewhere still inlines outside the loop', () => {
+    const { template } = compileAndGenerate(`
+export function Foo({ items }: { items: number[] }) {
+  const count = 9
+  return <div>
+    <p data-key={count}>{count}</p>
+    <ul>{items.map(count => <li key={count}>{count}</li>)}</ul>
+  </div>
+}
+`)
+    // Outside the loop, `count` still resolves to the outer literal `9`.
+    expect(template).toContain('data-key="{{9}}"')
+    // Inside the loop, the shadowed occurrence still resolves to the loop
+    // value, not the outer literal.
+    expect(template).toContain('{{range $_, $count := .Items}}<li data-key="{{.}}">')
+  })
+
+  // Slice B's guard, by contrast, is the coarse #2212 trade-off (a flat,
+  // scope-blind `Set<string>` with the loop-bound name subtracted
+  // component-wide): a genuinely non-shadowed occurrence OUTSIDE the loop,
+  // whose name happens to be loop-bound elsewhere, also loses its
+  // string-typed classification and falls back to numeric `bf_add`. This is
+  // the accepted, already-documented residual (same as Blade's #2212
+  // comment) — the suppressed case is safe (numeric fallback, never
+  // silently-wrong string output), just imprecise.
+  test('slice B guard is coarse (accepted #2212 trade-off): a string prop shadowed elsewhere loses bf_concat_str even outside the loop', () => {
+    const { template } = compileAndGenerate(`
+export function Foo({ count, arr }: { count: string; arr: number[] }) {
+  return <div>
+    <p>{1 + count}</p>
+    <ul>{arr.map((count) => <li key={count}>{count}</li>)}</ul>
+  </div>
+}
+`)
+    // Coarse trade-off: falls back to numeric bf_add outside the loop too,
+    // even though this occurrence of `count` is the genuinely string-typed
+    // outer prop, not shadowed.
+    expect(template).toContain('bf_add 1 .Count')
+    expect(template).not.toContain('bf_concat_str')
+  })
+
+  test('end-to-end via real `go run`: shadowed const/type resolution renders correct HTML', async () => {
+    try {
+      const html = await renderGoTemplateComponent({
+        source: `
+'use client'
+import { createSignal } from '@barefootjs/client'
+export function List() {
+  const count = 7
+  const [nums] = createSignal<number[]>([2, 5])
+  return <ul>{nums().map((count) => <li key={count}>{count * 3}</li>)}</ul>
+}
+`,
+        adapter: new GoTemplateAdapter(),
+        props: {},
+      })
+      // The outer `const count = 7` must never leak into the rendered
+      // per-item output — each `<li>` carries its OWN loop value (2, 5),
+      // not the constant 7.
+      expect(html).toContain('<li data-key="2"><!--bf:s0-->6<!--/--></li>')
+      expect(html).toContain('<li data-key="5"><!--bf:s0-->15<!--/--></li>')
+      expect(html).not.toContain('data-key="7"')
+    } catch (err) {
+      if (err instanceof GoNotAvailableError) {
+        console.log('Skipping #2236 e2e: go command not found')
+        return
+      }
+      throw err
+    }
+  })
+})