Auto-bind prototype methods resolved via template path reads

When a template path like `this.foo` resolves to a prototype method on the
parent (a class method), return a callable Proxy that binds `this` to the
parent on invocation. Previously the raw unbound function was handed to
consumers like `{{on "click" this.foo}}`, so the class method would fire
with the wrong `this` (or trip the `on` modifier's DEBUG guardrail).

The Proxy approach is used instead of `Function.prototype.bind` because
`bind()` creates a new function object that loses the original's own
properties, which would break subsequent traversals such as
`this.func.aProp` where `func` happens to be a function carrying its own
properties.

The bound Proxy is cached per (parent, path) in a WeakMap so callback
identity stays stable across revalidations — required by `{{on}}`, which
only re-installs the DOM listener when the callback reference changes.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: NullVoxPopuli

packages/@ember/-internals/glimmer/tests/integration/modifiers/on-this-binding-test.js

@@ -0,0 +1,48 @@
+import { moduleFor, RenderingTestCase, runTask } from 'internal-test-helpers';
+import { precompileTemplate } from '@ember/template-compilation';
+import { setComponentTemplate } from '@glimmer/manager';
+
+import { Component } from '../../utils/helpers';
+
+moduleFor(
+  '{{on}} Modifier | this-binding for class methods',
+  class extends RenderingTestCase {
+    ['@test a class method passed to {{on}} keeps its `this` context'](assert) {
+      let instance;
+      let seenThis = null;
+
+      let DemoComponent = class extends Component {
+        init() {
+          super.init(...arguments);
+          instance = this;
+        }
+
+        foo() {
+          seenThis = this;
+        }
+      };
+
+      this.owner.register(
+        'component:demo-el',
+        setComponentTemplate(
+          precompileTemplate('<button type="button" {{on "click" this.foo}}>click me</button>', {
+            strictMode: false,
+          }),
+          DemoComponent
+        )
+      );
+
+      this.render('{{demo-el}}');
+
+      assert.ok(instance, 'component instance was captured');
+
+      runTask(() => this.$('button').click());
+
+      assert.strictEqual(
+        seenThis,
+        instance,
+        '`this` inside the class method should be the component instance'
+      );
+    }
+  }
+);

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

@@ -193,6 +193,72 @@ export function updateRef(_ref: Reference, value: unknown) {
   update(value);
 }
 
+// When a path read like `this.foo` resolves to a prototype method on the
+// parent, we want the consumer (e.g. `{{on "click" this.foo}}`) to see a
+// `this`-bound version, but we must NOT break subsequent property reads
+// (`this.func.aProp` where `func` is a function carrying its own properties).
+//
+// A `Function.prototype.bind` call creates a brand new function object that
+// loses the original's own properties, which breaks the latter case. So
+// instead we return a callable Proxy: invoking it binds `this` to the parent,
+// while property access is forwarded transparently to the original function.
+//
+// The result is cached on the parent (weakly) so that identity is stable
+// across revalidations — required by modifiers that diff callback identity
+// (e.g. `{{on}}` only re-installs the DOM listener when the callback ref
+// changes).
+type AnyFn = (...args: unknown[]) => unknown;
+
+const BOUND_METHODS: WeakMap<object, Map<string, AnyFn>> = new WeakMap();
+
+// True when `path` resolves on the parent's prototype chain to a function
+// declared as a class method. Class-body method shorthand (`foo() {}`) is
+// non-enumerable on the prototype, while functions assigned via object
+// literals (e.g. `Component.extend({ foo() {} })` or a plain context like
+// `{ foo() {} }`) end up enumerable. We only auto-bind the former so that
+// existing object-literal contracts (no implicit `this`) are preserved.
+function isClassMethod(parent: object, path: string): boolean {
+  let proto: object | null = Object.getPrototypeOf(parent);
+  while (proto !== null && proto !== Object.prototype && proto !== Function.prototype) {
+    const desc = Object.getOwnPropertyDescriptor(proto, path);
+    if (desc !== undefined) {
+      return desc.enumerable === false && typeof desc.value === 'function';
+    }
+    proto = Object.getPrototypeOf(proto);
+  }
+  return false;
+}
+
+function maybeBindPrototypeMethod(parent: object, path: string, value: unknown): unknown {
+  if (
+    typeof value !== 'function' ||
+    parent === null ||
+    (typeof parent !== 'object' && typeof parent !== 'function') ||
+    Object.prototype.hasOwnProperty.call(parent, path) ||
+    !isClassMethod(parent, path)
+  ) {
+    return value;
+  }
+
+  let cache = BOUND_METHODS.get(parent);
+  if (cache === undefined) {
+    cache = new Map();
+    BOUND_METHODS.set(parent, cache);
+  }
+
+  let bound = cache.get(path);
+  if (bound === undefined) {
+    const target = value as AnyFn;
+    bound = new Proxy(target, {
+      apply(fn, _thisArg, args) {
+        return Reflect.apply(fn, parent, args);
+      },
+    });
+    cache.set(path, bound);
+  }
+  return bound;
+}
+
 export function childRefFor(_parentRef: Reference, path: string): Reference {
   const parentRef = _parentRef as ReferenceImpl;
 
@@ -213,8 +279,9 @@ export function childRefFor(_parentRef: Reference, path: string): Reference {
     const parent = valueForRef(parentRef);
 
     if (isDict(parent)) {
+      const raw = (parent as Record<string, unknown>)[path];
       child = createUnboundRef(
-        (parent as Record<string, unknown>)[path],
+        maybeBindPrototypeMethod(parent, path, raw),
         DEBUG && `${parentRef.debugLabel}.${path}`
       );
     } else {
@@ -226,7 +293,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 maybeBindPrototypeMethod(parent, path, value);
         }
       },
       (val) => {