@pyreon/compiler 0.18.0 → 0.20.0

package/src/tests/native-equivalence.test.ts

@@ -5,11 +5,23 @@
  * between the two backends.
  */
 import { transformJSX_JS } from '../jsx'
+import type { ReactivitySpan } from '../jsx'
 
 // Load native if available
-let nativeTransform: ((code: string, filename: string, ssr: boolean, knownSignals: string[] | null) => {
-  code: string; usesTemplates?: boolean | null; warnings: Array<{ message: string; line: number; column: number; code: string }>
-}) | null = null
+let nativeTransform:
+  | ((
+      code: string,
+      filename: string,
+      ssr: boolean,
+      knownSignals: string[] | null,
+      reactivityLens?: boolean,
+    ) => {
+      code: string
+      usesTemplates?: boolean | null
+      warnings: Array<{ message: string; line: number; column: number; code: string }>
+      reactivityLens?: ReactivitySpan[] | null
+    })
+  | null = null
 
 try {
   const path = require('node:path')
@@ -39,6 +51,50 @@ function compareSsr(input: string) {
   expect(rs.code).toBe(js.code)
 }
 
+// Reactivity-lens cross-backend gate (Phase 3). Asserts the Rust binary
+// emits the SAME sidecar the JS oracle does. Two contracts:
+//   1. ADDITIVE — `code` is byte-identical with the lens collected vs
+//      not, on BOTH backends (the option never affects codegen).
+//   2. PARITY — the SET of recorded spans is identical JS↔Rust.
+// Spans are compared order-independently: the LSP consumer sorts before
+// rendering, so traversal order is NOT part of the contract — the SET of
+// codegen decisions is. Sorting by (start,end,kind,detail) makes a
+// missing/extra/wrong span fail loudly while ignoring walk order.
+function canon(spans: ReactivitySpan[] | null | undefined): string[] {
+  return (spans ?? [])
+    .map(
+      (s) =>
+        `${s.start}|${s.end}|${s.line}|${s.column}|${s.endLine}|${s.endColumn}|${s.kind}|${s.detail}`,
+    )
+    .sort()
+}
+
+function compareLens(input: string, filename = 'test.tsx') {
+  const jsOff = transformJSX_JS(input, filename)
+  const jsOn = transformJSX_JS(input, filename, { reactivityLens: true })
+  const rsOff = nativeTransform!(input, filename, false, null, false)
+  const rsOn = nativeTransform!(input, filename, false, null, true)
+
+  // (1) additive — collecting the lens never changes emitted code, on
+  // either backend, and both backends still agree on that code.
+  expect(jsOn.code).toBe(jsOff.code)
+  expect(rsOn.code).toBe(rsOff.code)
+  expect(rsOn.code).toBe(jsOn.code)
+
+  // The opt-out path must NOT carry the sidecar (parity with JS, which
+  // omits the field entirely when not collecting).
+  expect(rsOff.reactivityLens == null).toBe(true)
+  expect(jsOff.reactivityLens == null).toBe(true)
+
+  // (2) parity — identical SET of spans.
+  const j = canon(jsOn.reactivityLens)
+  const r = canon(rsOn.reactivityLens)
+  expect(r).toEqual(j)
+  // Guard against the degenerate "both empty → trivially equal" pass:
+  // every fixture below is chosen to produce ≥1 span.
+  expect(j.length).toBeGreaterThan(0)
+}
+
 // ─── Cross-backend equivalence ──────────────────────────────────────────────
 
 describeNative('Native vs JS equivalence — basic', () => {
@@ -729,3 +785,48 @@ describeNative('Native vs JS equivalence — DOM properties', () => {
     compare('<div><input title={x()} /></div>')
   })
 })
+
+// ─── Reactivity-lens parity (Phase 3) ───────────────────────────────────────
+// The Rust binary must emit the SAME sidecar as the JS oracle so the
+// ~80% of users on the native path get the Lens too. Each fixture is
+// chosen to exercise one of the five structural kinds; `compareLens`
+// also asserts the additive guarantee (codegen byte-identical with the
+// option on vs off, both backends) so this block doubles as the native
+// regression guard for "the lens option must never affect output".
+//
+// Bisect-verified: removing ANY of the 6 `ctx.lens(...)` calls in
+// native/src/lib.rs fails the matching fixture below with an
+// array-length / element mismatch in `compareLens`'s parity assertion
+// (e.g. dropping the `reactive-prop` call → `<Comp value={x()} />` fails
+// `expect(r).toEqual(j)` because the Rust set is missing that span);
+// restored → 9/9 pass.
+describeNative('Reactivity-lens — JS↔Rust span parity', () => {
+  test('reactive text child (_bindText)', () =>
+    compareLens('<div>{count()}</div>'))
+
+  test('reactive accessor text child (() => …)', () =>
+    compareLens('<div>{() => count()}</div>'))
+
+  test('static-text child (baked once — the high-precision negative)', () =>
+    compareLens('<div>{someConst}</div>'))
+
+  test('reactive-prop on a component (_rp(() => …))', () =>
+    compareLens('<Comp value={count()} />'))
+
+  test('reactive-attr on a DOM element (live binding)', () =>
+    compareLens('<div><span title={count()}>hi</span></div>'))
+
+  test('hoisted-static (module-scope hoist)', () =>
+    compareLens('<Comp>{<b class="x">hi</b>}</Comp>'))
+
+  test('mixed: reactive + static + prop in one tree', () =>
+    compareLens(
+      '<section><Comp value={count()} /><p>{count()}</p><p>{label}</p></section>',
+    ))
+
+  test('multi-line source — line/column parity across newlines', () =>
+    compareLens('<div>\n  {count()}\n  <span title={other()}>\n  z</span>\n</div>'))
+
+  test('signal auto-call shape — declared signal, bare {count} → reactive', () =>
+    compareLens('const count = signal(0); const App = () => <div>{count}</div>', 'auto.tsx'))
+})

package/src/tests/partial-collapse-detector.test.ts

@@ -0,0 +1,121 @@
+/**
+ * PR 1 of the partial-collapse spec (`.claude/plans/open-work-2026-q3.md`
+ * → #1). The shared `on*`-handler-only detector — the build STARTED, not
+ * just measured. The bail-reason census (`collapse-bail-census.test.ts`)
+ * proved 7.8% of all `@pyreon/ui-components` call sites bail SOLELY on
+ * `on*` handlers while every dimension/style prop is a string literal and
+ * children are static text; `detectPartialCollapsibleShape` is the exact
+ * detector that claims that subset.
+ *
+ * Contract under test (mirrors the conservative discipline of the full
+ * `detectCollapsibleShape` — every uncertain signal bails):
+ *
+ *   - literal-prop + ≥1 `on[A-Z]…` handler + static-text children
+ *     → { props (literals only), childrenText, handlers[] }
+ *   - ZERO handlers → null  (that IS the full-collapse shape; the partial
+ *     detector defers so the existing path stays byte-unchanged and the
+ *     two detectors NEVER both claim a site — the load-bearing separation)
+ *   - spread / non-handler `{expr}` prop / boolean attr / element child /
+ *     expression child → null  (hard bail, same catalogue as full)
+ *   - handler expr span (`exprStart`/`exprEnd`) slices the EXACT source
+ *     of the `{...}` contents (load-bearing for PR 3's emit, which
+ *     re-emits `code.slice(exprStart, exprEnd)` into `_rsCollapseH`)
+ *
+ * Bisect-verify (documented in the PR body): replace the body of
+ * `detectPartialCollapsibleShape` with `return null` → the 4 POSITIVE
+ * specs fail with `expected null to be …`; the 6 NEGATIVE specs still
+ * pass (they assert null). Restore → 10/10. That asymmetry proves the
+ * positive assertions are load-bearing on the handler-relaxation logic,
+ * not passing for the wrong reason.
+ */
+import { describe, expect, it } from 'vitest'
+import { parseSync } from 'oxc-parser'
+import { detectPartialCollapsibleShape } from '../jsx'
+
+/** Parse a JSX snippet and return its first JSXElement node (the shape
+ * `tryRocketstyleCollapse` receives in production). */
+function firstJsxElement(code: string): any {
+  const { program } = parseSync('input.tsx', code, { sourceType: 'module', lang: 'tsx' })
+  let found: any = null
+  const visit = (node: any): void => {
+    if (found || !node || typeof node !== 'object') return
+    if (node.type === 'JSXElement') {
+      found = node
+      return
+    }
+    for (const k in node) {
+      const v = node[k]
+      if (Array.isArray(v)) for (const c of v) visit(c)
+      else if (v && typeof v === 'object' && typeof v.type === 'string') visit(v)
+    }
+  }
+  visit(program)
+  return found
+}
+
+const detect = (code: string) => detectPartialCollapsibleShape(firstJsxElement(code), 'Button')
+
+describe('detectPartialCollapsibleShape — PR 1 (on*-handler-only subset)', () => {
+  // ── POSITIVE: the partial-collapsible subset ────────────────────────────
+  it('claims a literal-prop site with one handler', () => {
+    const code =
+      'const x = <Button state="primary" size="medium" onClick={handleClick}>Save</Button>'
+    const r = detect(code)
+    expect(r).not.toBeNull()
+    expect(r!.props).toEqual({ state: 'primary', size: 'medium' })
+    expect(r!.childrenText).toBe('Save')
+    expect(r!.handlers).toHaveLength(1)
+    expect(r!.handlers[0]!.name).toBe('onClick')
+    expect(code.slice(r!.handlers[0]!.exprStart, r!.handlers[0]!.exprEnd)).toBe('handleClick')
+  })
+
+  it('peels multiple handlers, keeps literal props out of handlers[]', () => {
+    const code = 'const x = <Button state="primary" onClick={a} onPointerEnter={b}>Go</Button>'
+    const r = detect(code)
+    expect(r).not.toBeNull()
+    expect(r!.props).toEqual({ state: 'primary' })
+    expect(r!.handlers.map((h) => h.name)).toEqual(['onClick', 'onPointerEnter'])
+  })
+
+  it('captures the EXACT expression span for an inline arrow handler', () => {
+    const code = 'const x = <Button state="primary" onClick={() => doThing(1)}>Y</Button>'
+    const r = detect(code)
+    expect(r).not.toBeNull()
+    expect(code.slice(r!.handlers[0]!.exprStart, r!.handlers[0]!.exprEnd)).toBe('() => doThing(1)')
+  })
+
+  it('trims static-text children (parity with the full detector)', () => {
+    const code = 'const x = <Button state="primary" onClick={h}>\n  Save\n</Button>'
+    const r = detect(code)
+    expect(r).not.toBeNull()
+    expect(r!.childrenText).toBe('Save')
+  })
+
+  // ── NEGATIVE: every uncertain shape bails (null) ────────────────────────
+  it('returns null for ZERO handlers (defers to the full-collapse path)', () => {
+    // The load-bearing separation: a fully-literal site with no handler is
+    // the EXISTING full-collapse shape — the partial detector must NOT
+    // claim it, so the two never both fire on one site.
+    expect(detect('const x = <Button state="primary">Save</Button>')).toBeNull()
+  })
+
+  it('returns null for a spread attribute', () => {
+    expect(detect('const x = <Button {...rest} onClick={h}>X</Button>')).toBeNull()
+  })
+
+  it('returns null for a non-handler dynamic prop alongside a handler', () => {
+    expect(detect('const x = <Button state={dyn} onClick={h}>X</Button>')).toBeNull()
+  })
+
+  it('returns null for a boolean attribute', () => {
+    expect(detect('const x = <Button disabled onClick={h}>X</Button>')).toBeNull()
+  })
+
+  it('returns null for an element child', () => {
+    expect(detect('const x = <Button onClick={h}><span /></Button>')).toBeNull()
+  })
+
+  it('returns null for an expression child', () => {
+    expect(detect('const x = <Button onClick={h}>{label}</Button>')).toBeNull()
+  })
+})

package/src/tests/partial-collapse-emit.test.ts

@@ -0,0 +1,104 @@
+/**
+ * PR 3/4 of the partial-collapse build (open-work #1) — the compiler
+ * EMIT half: `tryRocketstyleCollapse` falls back to
+ * `tryPartialCollapse` (PR 1's `detectPartialCollapsibleShape`) when the
+ * FULL `detectCollapsibleShape` bails, emitting `__rsCollapseH(...)` +
+ * the residual handlers object (consumed by PR 2's `_rsCollapseH`,
+ * #681) instead of bailing to the 5-layer mount.
+ *
+ * Mirrors the existing `rocketstyle-collapse.test.ts` harness exactly
+ * (stubbed resolved-`sites` map — the resolver/plugin scan is the
+ * CI-exercised half; this proves the emit contract in isolation, same
+ * as the shipped full-collapse emission specs do).
+ *
+ * Bisect-verify (PR body): revert the one fallback line in
+ * `tryRocketstyleCollapse` (`if (!shape) return tryPartialCollapse(...)`
+ * → `if (!shape) return false`) → the partial-emit specs fail
+ * (`__rsCollapseH(` absent) while the FULL-collapse regression spec
+ * still passes (proving the full path is byte-unchanged — the fallback
+ * is the only delta). Restore → all pass. Locally bisect-verifiable
+ * (minimal `../jsx` graph, like PR 1 #679 — no resolver, no built lib).
+ */
+import { describe, expect, it } from 'vitest'
+import { rocketstyleCollapseKey, transformJSX } from '../jsx'
+
+const SITE = {
+  templateHtml: '<button data-x="1"><span class="inner">Save</span></button>',
+  lightClass: 'pyr-L1 pyr-L2',
+  darkClass: 'pyr-D1 pyr-D2',
+  rules: ['.pyr-L1{color:red}', '.pyr-D1{color:blue}'],
+  ruleKey: 'bundleA',
+}
+
+function collapseOpt(candidates: string[], sites: Record<string, typeof SITE>) {
+  return {
+    collapseRocketstyle: {
+      candidates: new Set(candidates),
+      sites: new Map(Object.entries(sites)),
+      mode: { name: 'useMode', source: '@pyreon/ui-core' },
+    },
+  }
+}
+
+describe('compiler — partial-collapse emission (on*-handler-only)', () => {
+  it('emits __rsCollapseH + handlers object + the _rsCollapseH import', () => {
+    const key = rocketstyleCollapseKey('Button', { state: 'primary', size: 'medium' }, 'Save')
+    const src =
+      'const x = <Button state="primary" size="medium" onClick={handleClick}>Save</Button>'
+    const { code } = transformJSX(src, 'App.tsx', collapseOpt(['Button'], { [key]: SITE }))
+
+    expect(code).toContain(
+      '__rsCollapseH("<button data-x=\\"1\\"><span class=\\"inner\\">Save</span></button>", ' +
+        '"pyr-L1 pyr-L2", "pyr-D1 pyr-D2", () => __pyrMode() === "dark", ' +
+        '{ "onClick": (handleClick) })',
+    )
+    // The runtime helper is imported alongside `_rsCollapse`.
+    expect(code).toContain(
+      'import { _rsCollapse as __rsCollapse, _rsCollapseH as __rsCollapseH } from "@pyreon/runtime-dom";',
+    )
+    // Idempotent rule injection still emitted (same as the full path).
+    expect(code).toContain('__rsSheet.injectRules(')
+    expect(code).toContain('"bundleA"')
+  })
+
+  it('peels multiple handlers verbatim (arrow stays one arg via parens)', () => {
+    const key = rocketstyleCollapseKey('Button', { state: 'primary' }, 'Go')
+    const src = 'const x = <Button state="primary" onClick={a} onPointerEnter={() => b(1)}>Go</Button>'
+    const { code } = transformJSX(src, 'M.tsx', collapseOpt(['Button'], { [key]: SITE }))
+    expect(code).toContain('{ "onClick": (a), "onPointerEnter": (() => b(1)) }')
+    expect(code).toContain('__rsCollapseH(')
+  })
+
+  it('FULL-collapse path is byte-unchanged (regression): no-handler site still emits plain __rsCollapse', () => {
+    const key = rocketstyleCollapseKey('Button', { state: 'primary' }, 'Save')
+    const src = 'const x = <Button state="primary">Save</Button>'
+    const { code } = transformJSX(src, 'F.tsx', collapseOpt(['Button'], { [key]: SITE }))
+    // Plain `__rsCollapse(` call — NOT the H variant — and the import
+    // must NOT pull `_rsCollapseH` (the conditional stays off).
+    expect(code).toContain('__rsCollapse("<button data-x=\\"1\\"')
+    expect(code).not.toContain('__rsCollapseH(')
+    expect(code).toContain('import { _rsCollapse as __rsCollapse } from "@pyreon/runtime-dom";')
+    expect(code).not.toContain('_rsCollapseH as __rsCollapseH')
+  })
+
+  it('bails (no collapse) on a non-handler dynamic prop alongside a handler', () => {
+    const key = rocketstyleCollapseKey('Button', { state: 'primary' }, 'X')
+    const src = 'const x = <Button state="primary" foo={dyn} onClick={h}>X</Button>'
+    const { code } = transformJSX(src, 'B1.tsx', collapseOpt(['Button'], { [key]: SITE }))
+    expect(code).not.toContain('__rsCollapseH')
+  })
+
+  it('bails when the handler-site key has no resolved entry (resolver bailed)', () => {
+    const otherKey = rocketstyleCollapseKey('Button', { state: 'secondary' }, 'X')
+    const src = 'const x = <Button state="primary" onClick={h}>X</Button>'
+    // Only `secondary` is resolved; the `primary` partial site is not.
+    const { code } = transformJSX(src, 'B2.tsx', collapseOpt(['Button'], { [otherKey]: SITE }))
+    expect(code).not.toContain('__rsCollapseH')
+  })
+
+  it('does nothing when collapseRocketstyle is absent (default OFF)', () => {
+    const src = 'const x = <Button state="primary" onClick={h}>X</Button>'
+    const { code } = transformJSX(src, 'Off.tsx', {})
+    expect(code).not.toContain('__rsCollapseH')
+  })
+})

package/src/tests/partial-collapse-robustness.test.ts

@@ -0,0 +1,53 @@
+/**
+ * Compiler hardening — Round 8 (robustness gate; no bug found).
+ *
+ * The partial-collapse emit path (#683 `tryPartialCollapse` →
+ * `__rsCollapseH(...)`, runtime #681, e2e #684) shipped with a happy-path
+ * emission test only. This adversarial gate locks its SAFETY contract under
+ * inputs that must BAIL or emit cleanly — never throw, never emit
+ * un-parseable JS: handlers with commas/ternaries/nested-braces/JSX-in-body/
+ * template-literals/signal-closures, multi-handler, dynamic non-handler prop,
+ * spread, `onClick={undefined}`, and key-miss. All currently pass (the path
+ * is robust); this prevents a future regression in the new code from silently
+ * shipping broken collapsed output.
+ */
+import { parseSync } from 'oxc-parser'
+import { describe, expect, it } from 'vitest'
+import { rocketstyleCollapseKey, transformJSX } from '../jsx'
+
+const SITE = { templateHtml: '<button><span>Save</span></button>', lightClass: 'L', darkClass: 'D', rules: ['.L{}'], ruleKey: 'b' }
+const opt = (sites: Record<string, typeof SITE>) => ({
+  collapseRocketstyle: { candidates: new Set(['Button']), sites: new Map(Object.entries(sites)), mode: { name: 'useMode', source: '@pyreon/ui-core' } },
+})
+const reparses = (c: string): boolean => { try { return !(parseSync('o.tsx', c).errors?.length) } catch { return false } }
+
+const CASES: Array<[string, string, Record<string, string>]> = [
+  ['multi-handler', `const x = <Button state="primary" onClick={a} onPointerEnter={b}>Save</Button>`, { state: 'primary' }],
+  ['arrow-with-commas', `const x = <Button state="primary" onClick={() => f(a, b, c)}>Save</Button>`, { state: 'primary' }],
+  ['ternary-handler', `const x = <Button state="primary" onClick={cond ? h1 : h2}>Save</Button>`, { state: 'primary' }],
+  ['nested-braces-handler', `const x = <Button state="primary" onClick={() => { const o = {a:1}; g(o) }}>Save</Button>`, { state: 'primary' }],
+  ['signal-closure-handler', `const x = <Button state="primary" onClick={() => s.set(s() + 1)}>Save</Button>`, { state: 'primary' }],
+  ['jsx-in-handler-body', `const x = <Button state="primary" onClick={() => render(<i/>)}>Save</Button>`, { state: 'primary' }],
+  ['template-literal-in-handler', `const x = <Button state="primary" onClick={() => log(\`v=\${y}\`)}>Save</Button>`, { state: 'primary' }],
+  ['dynamic-non-handler-prop-bails', `const x = <Button state={dyn} onClick={h}>Save</Button>`, { state: 'primary' }],
+  ['spread-bails', `const x = <Button state="primary" {...rest} onClick={h}>Save</Button>`, { state: 'primary' }],
+  ['onClick-undefined', `const x = <Button state="primary" onClick={undefined}>Save</Button>`, { state: 'primary' }],
+  ['key-miss-no-collapse', `const x = <Button state="primary" onClick={h}>Save</Button>`, { size: 'x' }],
+]
+
+describe('Round 8 — partial-collapse emit is robust (never throws / never emits broken JS)', () => {
+  for (const [name, src, props] of CASES) {
+    it(name, () => {
+      const key = rocketstyleCollapseKey('Button', props, 'Save')
+      let code = ''
+      let threw: unknown = null
+      try {
+        code = transformJSX(src, 'App.tsx', opt({ [key]: SITE })).code ?? ''
+      } catch (e) {
+        threw = e
+      }
+      expect(threw, `partial-collapse must not throw on: ${src}`).toBeNull()
+      expect(reparses(code), `partial-collapse must emit parseable JS for: ${src}`).toBe(true)
+    })
+  }
+})

package/src/tests/prop-derived-shadow.test.ts

@@ -0,0 +1,96 @@
+/**
+ * Compiler hardening — Round 2.
+ *
+ * The prop-derived reactive-props inlining pass (`resolveIdentifiersInText`
+ * in jsx.ts) used to substitute every identifier matching a prop-derived
+ * const NAME, with zero lexical-scope analysis. Idiomatic code that reuses a
+ * short name (`a` / `x` / `i` / `item`) as a callback param or nested local
+ * while a prop-derived const of the same name exists was MISCOMPILED:
+ *
+ *   const a = props.x
+ *   items.map(a => <li>{a}</li>)
+ *     →  items.map((props.x) => <li>{(props.x)}</li>)   // un-parseable JS
+ *
+ * Two cases emitted literally un-parseable JavaScript (arrow-param,
+ * catch-param); the rest silently rebound the wrong identifier. The
+ * signal-auto-call pass was already scope-aware (`shadowedSignals`); the fix
+ * gives the prop-derived pass the same block-accurate shadow discipline.
+ *
+ * Bisect: revert `scopeBoundPropDerived` / the `!shadowed.has(...)` guard in
+ * jsx.ts → the SHADOW specs fail (un-parseable emit / wrong substitution);
+ * the no-shadow + transitive specs keep passing (they are the over-suppression
+ * guard — the fix must NOT stop inlining where there is no shadow). Restore →
+ * all pass.
+ */
+import { parseSync } from 'oxc-parser'
+import { describe, expect, it } from 'vitest'
+import { transformJSX_JS } from '../jsx'
+
+const emit = (code: string): string => transformJSX_JS(code, 'c.tsx').code ?? ''
+const parses = (out: string): boolean => {
+  try {
+    return (parseSync('o.tsx', out).errors?.length ?? 0) === 0
+  } catch {
+    return false
+  }
+}
+
+describe('prop-derived inlining — lexical shadowing is respected', () => {
+  it('arrow-function parameter shadowing a prop-derived const is NOT rewritten (was un-parseable)', () => {
+    const out = emit(`function C(props){ const a = props.x; return <ul>{props.items.map(a => <li>{a}</li>)}</ul> }`)
+    expect(parses(out)).toBe(true)
+    expect(out).not.toContain('(props.x) =>')
+    expect(out).toContain('.map(a => <li>{a}</li>)')
+  })
+
+  it('catch-clause parameter shadowing a prop-derived const is NOT rewritten (was un-parseable)', () => {
+    const out = emit(`function C(props){ const e = props.err; const h = () => { try {} catch (e) { return e } }; return <i>{h()}</i> }`)
+    expect(parses(out)).toBe(true)
+    expect(out).toContain('catch (e)')
+    expect(out).toContain('return e')
+  })
+
+  it('named-function parameter shadowing a prop-derived const keeps the parameter binding', () => {
+    const out = emit(`function C(props){ const x = props.x; function row(x){ return <td>{x}</td> } return <table>{props.rows.map(row)}</table> }`)
+    expect(parses(out)).toBe(true)
+    expect(out).toContain('function row(x)')
+    expect(out).toMatch(/__t0\.data = x\b/) // the row PARAM, not (props.x)
+  })
+
+  it('nested const shadowing a prop-derived const is not clobbered', () => {
+    const out = emit(`function C(props){ const a = props.x; const g = () => { const a = 7; return a }; return <b>{g()}</b> }`)
+    expect(parses(out)).toBe(true)
+    expect(out).toContain('const a = 7; return a')
+    expect(out).not.toContain('const a = 7; return (props.x)')
+  })
+
+  it('block-scoped shadow does NOT over-suppress an outer-scope reference (block accuracy)', () => {
+    const out = emit(`function C(props){ const a = props.x; { const a = 'inner'; } return <div>{a}</div> }`)
+    expect(out).toContain('(props.x)') // {a} is OUTSIDE the shadowing block → still inlined
+  })
+})
+
+describe('prop-derived inlining — no-shadow paths still inline (over-suppression guard)', () => {
+  it('non-shadowing callback still inlines the prop-derived const', () => {
+    const out = emit(`function C(props){ const a = props.x; return <ul>{props.items.map(it => <li>{a}{it}</li>)}</ul> }`)
+    expect(out).toContain('(props.x)')
+    expect(out).toContain('it') // the genuine callback param is untouched
+  })
+
+  it('transitive chain still resolves through to props', () => {
+    const out = emit(`function C(props){ const a = props.x; const b = a + 1; const c = b * 2; return <div>{c}</div> }`)
+    expect(out).toContain('(((props.x) + 1) * 2)')
+  })
+
+  // Scope PRECISION: a `for (let i=…)` head block-scopes `i` to the loop. A
+  // `return i` AFTER the loop is out of the loop's scope and resolves to the
+  // OUTER prop-derived `const i` — so it MUST still inline. (Proven: in plain
+  // JS, `const i='OUTER'; (() => { for(let i=0;i<3;i++){} return i })()` ===
+  // 'OUTER'.) This guards against an over-broad shadow heuristic that would
+  // wrongly treat the non-escaping loop var as a shadow at the post-loop use.
+  it('does NOT over-suppress: post-loop reference is the outer prop-derived const', () => {
+    const out = emit(`function C(props){ const i = props.start; const f = () => { for (let i=0;i<3;i++){} return i }; return <s>{f()}</s> }`)
+    expect(parses(out)).toBe(true)
+    expect(out).toContain('return (props.start)')
+  })
+})

package/src/tests/pure-call-reactive-args.test.ts

@@ -0,0 +1,50 @@
+/**
+ * Compiler hardening — Round 4 (contract lock; hypothesis disproven = no bug).
+ *
+ * Hypothesis probed: does a "pure" call (Math.* / JSON.* / Object.* / String /
+ * Number — the ~40 fns `isPureStaticCall` treats as side-effect-free) get
+ * mis-classified as STATIC when its ARGUMENTS are reactive (signal / prop)?
+ * That would silently drop reactivity (the value renders once, never updates).
+ *
+ * Result: NOT a bug — `shouldWrap`/`isDynamic` correctly inspect arguments, so
+ * a pure callee with a dynamic arg is still reactively wrapped. This file is
+ * the self-discriminating regression gate for that contract: if someone later
+ * "optimizes" pure-call detection to skip wrapping by callee name alone, these
+ * specs fail (the exact stale-render bug that optimization would introduce).
+ *
+ * Bisect: make `isPureStaticCall` short-circuit `shouldWrap` regardless of
+ * args → every spec here fails (emit becomes `textContent = Math.max(n(),0)`,
+ * no `_bind`). Restore → all pass. The fully-static control proves the gate
+ * does not just assert "always reactive".
+ */
+import { describe, expect, it } from 'vitest'
+import { transformJSX_JS } from '../jsx'
+
+const emit = (c: string): string => transformJSX_JS(c, 'c.tsx').code ?? ''
+const isReactive = (o: string): boolean => /_bind\(|_bindText\(/.test(o)
+
+describe('Round 4 — pure call with a DYNAMIC argument must stay reactive', () => {
+  it('Math.max(signal(), 0) is reactively wrapped', () => {
+    expect(isReactive(emit(`function C(){ const n=signal(0); return <div>{Math.max(n(),0)}</div> }`))).toBe(true)
+  })
+  it('Math.round(props.x) is reactively wrapped', () => {
+    expect(isReactive(emit(`function C(p){ return <div>{Math.round(p.x)}</div> }`))).toBe(true)
+  })
+  it('JSON.stringify(props.o) is reactively wrapped', () => {
+    expect(isReactive(emit(`function C(p){ return <div>{JSON.stringify(p.o)}</div> }`))).toBe(true)
+  })
+  it('Object.keys(props.o).length is reactively wrapped', () => {
+    expect(isReactive(emit(`function C(p){ return <div>{Object.keys(p.o).length}</div> }`))).toBe(true)
+  })
+  it('String(props.x) is reactively wrapped', () => {
+    expect(isReactive(emit(`function C(p){ return <div>{String(p.x)}</div> }`))).toBe(true)
+  })
+
+  // Control: a pure call with ONLY static args is correctly STATIC (proves
+  // the gate is not vacuously "everything is reactive").
+  it('Math.max(1,2,3) with only static args is NOT wrapped', () => {
+    const o = emit(`function C(){ return <div>{Math.max(1,2,3)}</div> }`)
+    expect(isReactive(o)).toBe(false)
+    expect(o).toContain('textContent = Math.max(1,2,3)')
+  })
+})