Use childRefFor transform instead of wrapper ComputeRef

Pass a bindTransform callback to childRefFor so that binding happens
inside the same ref — same tracking, same caching, same debug labels.
Eliminates the wrapper ComputeRef that was causing autotracking
divergence and identity issues.

The transform wraps function values in a stable callable that defers
property lookup to invocation time. Non-function values (strings,
objects, components, modifiers) pass through unchanged.

Co-Authored-By: Claude Opus 4.6 (1M context) <[email protected]>

Author: NullVoxPopuli

packages/@glimmer/reference/index.ts

@@ -9,6 +9,7 @@ export {
 } from './lib/iterable';
 export {
   childRefFor,
+  type ChildRefTransform,
   childRefFromParts,
   createComputeRef,
   createConstRef,

packages/@glimmer/reference/lib/reference.ts

@@ -193,18 +193,28 @@ export function updateRef(_ref: Reference, value: unknown) {
   update(value);
 }
 
-export function childRefFor(_parentRef: Reference, path: string): Reference {
+export type ChildRefTransform = (parent: object, path: string, value: unknown) => unknown;
+
+export function childRefFor(
+  _parentRef: Reference,
+  path: string,
+  transform?: ChildRefTransform
+): Reference {
   const parentRef = _parentRef as ReferenceImpl;
 
   const type = parentRef[REFERENCE];
 
   let children = parentRef.children;
   let child: Reference;
 
+  // Use a distinct cache key when a transform is provided so that the same
+  // (parent, path) pair can have both a plain and a transformed child ref.
+  const cacheKey = transform ? '\0bound:' + path : path;
+
   if (children === null) {
     children = parentRef.children = new Map();
   } else {
-    const next = children.get(path);
+    const next = children.get(cacheKey);
 
     if (next) return next;
   }
@@ -213,10 +223,9 @@ export function childRefFor(_parentRef: Reference, path: string): Reference {
     const parent = valueForRef(parentRef);
 
     if (isDict(parent)) {
-      child = createUnboundRef(
-        (parent as Record<string, unknown>)[path],
-        DEBUG && `${parentRef.debugLabel}.${path}`
-      );
+      let value: unknown = (parent as Record<string, unknown>)[path];
+      if (transform) value = transform(parent, path, value);
+      child = createUnboundRef(value, DEBUG && `${parentRef.debugLabel}.${path}`);
     } else {
       child = UNDEFINED_REFERENCE;
     }
@@ -226,7 +235,8 @@ export function childRefFor(_parentRef: Reference, path: string): Reference {
         const parent = valueForRef(parentRef);
 
         if (isDict(parent)) {
-          return getProp(parent, path);
+          const value = getProp(parent, path);
+          return transform ? transform(parent, path, value) : value;
         }
       },
       (val) => {
@@ -243,7 +253,7 @@ export function childRefFor(_parentRef: Reference, path: string): Reference {
     }
   }
 
-  children.set(path, child);
+  children.set(cacheKey, child);
 
   return child;
 }

packages/@glimmer/runtime/lib/compiled/opcodes/expressions.ts

@@ -39,13 +39,14 @@ import {
 } from '@glimmer/debug';
 import { debugToString, localAssert } from '@glimmer/debug-util';
 import { _hasDestroyableChildren, associateDestroyableChild, destroy } from '@glimmer/destroyable';
-import { debugAssert, setProp, toBool } from '@glimmer/global-context';
+import { debugAssert, toBool } from '@glimmer/global-context';
 import {
   getInternalComponentManager,
   getInternalHelperManager,
   getInternalModifierManager,
 } from '@glimmer/manager';
 import type { Reference } from '@glimmer/reference';
+import type { ChildRefTransform } from '@glimmer/reference';
 import {
   childRefFor,
   createComputeRef,
@@ -54,7 +55,7 @@ import {
   UNDEFINED_REFERENCE,
   valueForRef,
 } from '@glimmer/reference';
-import { assign, isDict, isIndexable } from '@glimmer/util';
+import { assign, isIndexable } from '@glimmer/util';
 import { $v0 } from '@glimmer/vm';
 
 import { isCurriedType, resolveCurriedValue } from '../../curried-value';
@@ -75,58 +76,43 @@ import {
 
 // Returns true if the value has an associated component or modifier manager —
 // meaning it is a definition object that must not be bound. Helper managers are
-// excluded because ALL functions have a default helper manager (RFC #756), and
-// binding a helper function is harmless.
+// excluded because ALL functions have a default helper manager (RFC #756).
 function hasDefinitionManager(value: object): boolean {
   return (
     getInternalModifierManager(value, true) !== null ||
     getInternalComponentManager(value, true) !== null
   );
 }
 
-// Like childRefFor, but for function values returns a stable wrapper that
-// defers the property read to invocation time, calling it with the parent
-// as `this`. Non-function values pass through unchanged.
-//
-// Uses childRefFor internally for tracking — the property is only tracked
-// the same way it would be without binding.
-function boundChildRefFor(parentRef: Reference, path: string): Reference {
-  const innerRef = childRefFor(parentRef, path);
-
-  let cachedParent: object | null = null;
-  let wrapper: CallableFunction | null = null;
-
-  return createComputeRef(
-    () => {
-      const value = valueForRef(innerRef);
-
-      if (typeof value !== 'function' || hasDefinitionManager(value as object)) {
-        return value;
-      }
+// Per-parent cache of wrapper functions so that the same (parent, path) pair
+// returns a stable callable identity across revalidations.
+const BOUND_FN_CACHE: WeakMap<object, Map<string, CallableFunction>> = new WeakMap();
+
+// Transform for childRefFor that wraps function values in a stable callable
+// preserving `this`. The wrapper defers the actual property lookup to
+// invocation time — `parent[path]` is evaluated when the function is called,
+// not during render.
+const bindTransform: ChildRefTransform = (parent, path, value) => {
+  if (typeof value !== 'function' || hasDefinitionManager(value as object)) {
+    return value;
+  }
 
-      const parent = valueForRef(parentRef);
-
-      // Return a stable wrapper per parent identity. The wrapper defers
-      // the property read to call time — `parent[path]` is evaluated
-      // only when the function is actually invoked, not during render.
-      if (parent !== cachedParent) {
-        cachedParent = parent;
-        wrapper = function (this: unknown, ...args: unknown[]) {
-          const fn = (parent as Record<string, CallableFunction>)[path];
-          return fn?.call(parent, ...args);
-        };
-      }
-      return wrapper;
-    },
-    (val) => {
-      const parent = valueForRef(parentRef);
+  let cache = BOUND_FN_CACHE.get(parent);
+  if (cache === undefined) {
+    cache = new Map();
+    BOUND_FN_CACHE.set(parent, cache);
+  }
 
-      if (isDict(parent)) {
-        return setProp(parent, path, val);
-      }
-    }
-  );
-}
+  let wrapper = cache.get(path);
+  if (wrapper === undefined) {
+    wrapper = function (this: unknown, ...args: unknown[]) {
+      const fn = (parent as Record<string, CallableFunction>)[path];
+      return fn?.call(parent, ...args);
+    };
+    cache.set(path, wrapper);
+  }
+  return wrapper;
+};
 
 APPEND_OPCODES.add(VM_CURRY_OP, (vm, { op1: type, op2: _isStrict }) => {
   let stack = vm.stack;
@@ -275,7 +261,7 @@ APPEND_OPCODES.add(VM_GET_PROPERTY_OP, (vm, { op1: _key }) => {
 APPEND_OPCODES.add(VM_GET_PROPERTY_BOUND_OP, (vm, { op1: _key }) => {
   let key = vm.constants.getValue<string>(_key);
   let expr = check(vm.stack.pop(), CheckReference);
-  vm.stack.push(boundChildRefFor(expr, key));
+  vm.stack.push(childRefFor(expr, key, bindTransform));
 });
 
 APPEND_OPCODES.add(VM_GET_BLOCK_OP, (vm, { op1: _block }) => {