Parcourir la source

fix(extraction): classify TS/JS class fields by value — properties, not methods (#808) (#809)

Every TS `public_field_definition` / JS `field_definition` extracted as a
method-kind node, so a plain field (`public fonts: Fonts;`) was reported
as callable: class shape was misrepresented, kind-based filtering was
defeated, and bare-name call resolution landed on data fields — typeorm's
boolean `ColumnMetadata::isArray` field was soaking up Array.isArray(...)
call edges (685 such wrong edges on typeorm alone).

Classification now follows the VALUE (classifyMethodNode hook, mirroring
resolveBody's callable detection): arrow-function / function-expression
fields and HOF-wrapped ones (`onScroll = throttle(() => {…})`) stay
methods with their bodies walked; everything else becomes a property that
keeps its type-annotation references edge, visibility, static-ness, and
decorators. Field initializers are now walked too (`history =
createHistory()` attributes the call to the property — previously
invisible), and JS class fields — whose name lives in the grammar's
`property` field, so they never extracted a symbol at all — now appear in
the graph (resolveName on the JS extractor).

With fields correctly kinded, `this.X` callback registration is re-enabled
for TS/JS (removed in #807 because field pseudo-methods made it mostly
wrong): `this.<member>` candidates resolve CLASS-SCOPED
(resolveThisMemberFnRef) — the target must be a function/method sharing
the from-symbol's qualified-name class prefix, same file, no fallback —
so `addEventListener("online", this.onOfflineStatusToggle)` and API-object
wiring (`{ mutateElement: this.mutateElement }`) produce registration
edges to the enclosing class's own method, while `this.fonts` (a
property) and inherited/unknown members yield no edge.

A/B (baseline = #807 main): excalidraw / typeorm / express — node counts
identical on all three; kinds shift method→property only (typeorm: exactly
7,406 swapped; excalidraw also corrects 5 anonymous-class mock fields that
were function-kind); every one of the 736 dropped call edges targeted a
node that is now a property (calls into data fields — verified 100%);
gains are retargets to real callables, initializer-call attributions, and
+74/+7 class-scoped this.X registration edges (sampled: addEventListener/
removeEventListener wiring, imperative-API method maps). Full suite green
(1386).

EXTRACTION_VERSION 19 → 20 (re-index to benefit).

Closes #808

Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Colby Mchenry il y a 1 semaine
Parent
commit
38eb4e688c

+ 2 - 0
CHANGELOG.md

@@ -16,6 +16,8 @@ and adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
 ### New Features
 
+- TypeScript and JavaScript **class fields are now reported as properties instead of methods**. A plain field like `public fonts: Fonts;` previously extracted as a method, misrepresenting class shape and letting calls to same-named functions resolve to data fields (a boolean field named `isArray` was soaking up `Array.isArray(...)` call edges). Fields holding arrow functions or function expressions (`onClick = () => {…}`, including wrapped ones like `onScroll = throttle(() => {…})`) correctly remain methods and their bodies are still analyzed. Field initializers are analyzed too, so `history = createHistory()` records its call — and JavaScript class fields, which previously produced no symbol at all, now appear in the graph. Re-index a project to benefit. (#808) (TypeScript, JavaScript)
+- Callback registration through `this` now resolves precisely in TypeScript and JavaScript: `window.addEventListener("online", this.onOfflineStatusToggle)` or an API object like `{ mutateElement: this.mutateElement }` produces a reference edge to the **enclosing class's own method** — never a same-named method on an unrelated class, and never a data field. Builds on the callback-registration support below. (#808) (TypeScript, JavaScript)
 - CodeGraph now sees where a function is **registered as a callback**, not just where it's called. A function name passed as an argument (`signal(SIGINT, handler)`, `qsort(…, compare)`, `addEventListener(…, onBlur)`), assigned to a function pointer or field (`ops->recv_cb = my_cb`, `OnClick := Handler`), or placed in a struct initializer or handler table (`{ .recv_cb = my_cb }`, `{ "get", getCommand }`) now produces a reference edge from the registration site to the function — so `codegraph_callers` and `codegraph_impact` surface callback wiring that previously looked like dead code. Works across all supported languages, including the language-specific forms: C/C++ `&fn`, Java `Class::method`, Kotlin `::fn`, Swift `#selector`, Objective-C `@selector`, Ruby `method(:fn)`, Scala eta-expansion, and Delphi/Pascal `@Handler` and `OnClick := Handler` event wiring. Callers output labels these "via callback registration". Resolution is deliberately conservative: an ambiguous name produces no edge rather than a wrong one. Re-index a project to benefit. Thanks @zmcrazy. (#756)
 - The `codegraph_node` MCP tool can now **read a whole source file like the built-in Read tool — only faster, served from the index**. Pass a file path with no symbol and it returns that file's current source with line numbers (the same `<n>⇥<line>` shape Read produces, so an assistant can edit straight from it), narrowable with `offset`/`limit` exactly like Read, plus a one-line note of which files depend on it (the file's blast radius). Use it anywhere you'd reach for Read on an indexed source file. Pass `symbolsOnly: true` for just the file's structure. Configuration/data files (`.yml` / `.properties`) are summarized by key only, never dumped, so secrets in them are never surfaced. The agent-facing guidance was also retuned so assistants reach for codegraph while *implementing* a change (not only when answering questions), since one codegraph call returns the same bytes plus the blast radius, faster than re-reading the file.
 - New `codegraph upgrade` command updates CodeGraph to the latest release in place — it detects how you installed (the standalone `install.sh` / `install.ps1` bundle, npm, or npx) and does the right thing for each, on macOS, Linux, and Windows. Use `codegraph upgrade --check` to see whether an update is available without installing, or `codegraph upgrade <version>` to move to a specific version. After upgrading it reminds you to re-index your projects so they pick up the newer engine's improvements. (#679)

+ 53 - 4
__tests__/function-ref.test.ts

@@ -144,10 +144,9 @@ describe('Function-as-value capture (#756)', () => {
         'objRegistrar',
         'timerRegistrar',
       ]);
-      // `this.handleClick` is deliberately NOT captured in TS/JS: class fields
-      // extract as method-kind nodes, so `this.X` value positions (mostly data
-      // reads in real code) produced wrong edges — see TS_JS_SPEC note.
-      expect(fnRefEdgesInto(cg, 'handleClick')).toHaveLength(0);
+      // `this.handleClick` resolves class-scoped (#808): the target must be a
+      // method of the ENCLOSING class, in the same file.
+      expect(sourceNames(cg, fnRefEdgesInto(cg, 'handleClick'))).toEqual(['wire']);
     } finally {
       cg.destroy();
       tmpDir = undefined;
@@ -408,6 +407,56 @@ describe('Function-as-value capture (#756)', () => {
     }
   });
 
+  it('THIS-MEMBER SCOPING: this.X resolves only to the enclosing class, never elsewhere', async () => {
+    tmpDir = fs.mkdtempSync(path.join(os.tmpdir(), 'cg-fnref-thisx-'));
+    fs.writeFileSync(
+      path.join(tmpDir, 'main.ts'),
+      [
+        'declare const bus: { on(ev: string, cb: () => void): void };',
+        // Decoy: a same-named method on an UNRELATED class.
+        'export class Decoy { refresh(): void {} }',
+        'export class Panel {',
+        '  views: number[] = [];', // property (post-#808), shares no name
+        '  refresh(): void {}',
+        '  wire(): void {',
+        '    bus.on("update", this.refresh);', // → Panel::refresh, not Decoy::refresh
+        '    bus.on("data", this.views as never);', // property → NO edge
+        '    bus.on("gone", this.missing as never);', // unknown member → NO edge
+        '  }',
+        '}',
+      ].join('\n')
+    );
+
+    const cg = CodeGraph.initSync(tmpDir);
+    try {
+      await cg.indexAll();
+
+      const refreshes = cg.getNodesByName('refresh');
+      const panelRefresh = refreshes.find((n) => n.qualifiedName.includes('Panel'))!;
+      const decoyRefresh = refreshes.find((n) => n.qualifiedName.includes('Decoy'))!;
+
+      const intoPanel = cg
+        .getIncomingEdges(panelRefresh.id)
+        .filter((e) => e.metadata?.fnRef === true);
+      expect(intoPanel).toHaveLength(1);
+      expect(cg.getNode(intoPanel[0]!.source)?.name).toBe('wire');
+      expect(
+        cg.getIncomingEdges(decoyRefresh.id).filter((e) => e.metadata?.fnRef === true)
+      ).toHaveLength(0);
+
+      // The property and the unknown member produce nothing.
+      const views = cg.getNodesByName('views').find((n) => n.kind === 'property');
+      if (views) {
+        expect(
+          cg.getIncomingEdges(views.id).filter((e) => e.metadata?.fnRef === true)
+        ).toHaveLength(0);
+      }
+    } finally {
+      cg.destroy();
+      tmpDir = undefined;
+    }
+  });
+
   it('C UNGATED TABLES: a command table names handlers defined in OTHER files (redis pattern)', async () => {
     tmpDir = fs.mkdtempSync(path.join(os.tmpdir(), 'cg-fnref-ctable-'));
     // Handler defined in its own file…

+ 159 - 0
__tests__/ts-field-classification.test.ts

@@ -0,0 +1,159 @@
+/**
+ * TS/JS class-field kind classification (#808).
+ *
+ * `public_field_definition` (TS) / `field_definition` (JS) previously
+ * extracted as method-kind nodes unconditionally, so a plain annotated field
+ * (`public fonts: Fonts;`) was reported as a method — misrepresenting class
+ * shape and defeating kind-based filtering (#756 had to work around it).
+ *
+ * Now classification follows the VALUE: arrow-function / function-expression
+ * fields (and HOF-wrapped ones, mirroring resolveBody) stay methods; every
+ * other field is a property. Parity requirements: the property keeps its
+ * type-annotation `references` edge, visibility, and static-ness; method
+ * fields keep walking their bodies (calls still attributed).
+ */
+
+import { describe, it, expect, beforeAll, afterEach } from 'vitest';
+import * as fs from 'fs';
+import * as path from 'path';
+import * as os from 'os';
+import { CodeGraph } from '../src';
+import { initGrammars, loadAllGrammars } from '../src/extraction/grammars';
+
+beforeAll(async () => {
+  await initGrammars();
+  await loadAllGrammars();
+});
+
+describe('TS/JS class field classification (#808)', () => {
+  let tmpDir: string | undefined;
+  afterEach(() => {
+    if (tmpDir) fs.rmSync(tmpDir, { recursive: true, force: true });
+    tmpDir = undefined;
+  });
+
+  it('TS: plain fields are properties; function-valued fields are methods', async () => {
+    tmpDir = fs.mkdtempSync(path.join(os.tmpdir(), 'cg-808-ts-'));
+    fs.writeFileSync(
+      path.join(tmpDir, 'app.ts'),
+      [
+        'declare function throttle(f: unknown, ms: number): unknown;',
+        'class Fonts {}',
+        'class History {}',
+        'class App {',
+        '  public fonts: Fonts;', // plain annotated → property
+        '  private history: History = new History();', // annotated + initializer → property
+        '  interactiveCanvas: HTMLCanvasElement | null = null;', // union type → property
+        '  count = 0;', // plain value → property
+        '  static defaults = { a: 1 };', // object value → property
+        '  onClick = () => { this.run(); };', // arrow field → method
+        '  onScroll = throttle((e: Event) => { this.run(); }, 100);', // HOF-wrapped → method
+        '  handler = function namedFn() {};', // function expression → method
+        '  handleClick(): void {}', // real method
+        '  get value(): number { return 1; }', // getter stays method
+        '  run(): void {}',
+        '}',
+      ].join('\n')
+    );
+
+    const cg = CodeGraph.initSync(tmpDir);
+    try {
+      await cg.indexAll();
+
+      const kindOf = (name: string) =>
+        cg.getNodesByName(name).map((n) => n.kind).sort().join(',');
+
+      expect(kindOf('fonts')).toBe('property');
+      expect(kindOf('history')).toBe('property');
+      expect(kindOf('interactiveCanvas')).toBe('property');
+      expect(kindOf('count')).toBe('property');
+      expect(kindOf('defaults')).toBe('property');
+      expect(kindOf('onClick')).toBe('method');
+      expect(kindOf('onScroll')).toBe('method');
+      expect(kindOf('handler')).toBe('method');
+      expect(kindOf('handleClick')).toBe('method');
+      expect(kindOf('value')).toBe('method');
+
+      // Parity: the property keeps its type-annotation reference edge.
+      const fontsProp = cg.getNodesByName('fonts').find((n) => n.kind === 'property')!;
+      const fontsRefs = cg
+        .getOutgoingEdges(fontsProp.id)
+        .filter((e) => e.kind === 'references')
+        .map((e) => cg.getNode(e.target)?.name);
+      expect(fontsRefs).toContain('Fonts');
+
+      // Parity: visibility survives the property path.
+      expect(fontsProp.visibility).toBe('public');
+      const historyProp = cg.getNodesByName('history').find((n) => n.kind === 'property')!;
+      expect(historyProp.visibility).toBe('private');
+
+      // Parity: arrow-field bodies still walk — onClick calls run.
+      const onClick = cg.getNodesByName('onClick')[0]!;
+      const calls = cg
+        .getOutgoingEdges(onClick.id)
+        .filter((e) => e.kind === 'calls')
+        .map((e) => cg.getNode(e.target)?.name);
+      expect(calls).toContain('run');
+
+      // Signature carries the declared type, C#-style "Type name".
+      expect(fontsProp.signature).toBe('Fonts fonts');
+    } finally {
+      cg.destroy();
+      tmpDir = undefined;
+    }
+  });
+
+  it('JS: field_definition classifies the same way', async () => {
+    tmpDir = fs.mkdtempSync(path.join(os.tmpdir(), 'cg-808-js-'));
+    fs.writeFileSync(
+      path.join(tmpDir, 'app.js'),
+      [
+        'class App {',
+        '  count = 0;',
+        '  config = { retries: 3 };',
+        '  onClick = () => { this.run(); };',
+        '  run() {}',
+        '}',
+        'module.exports = App;',
+      ].join('\n')
+    );
+
+    const cg = CodeGraph.initSync(tmpDir);
+    try {
+      await cg.indexAll();
+      expect(cg.getNodesByName('count')[0]?.kind).toBe('property');
+      expect(cg.getNodesByName('config')[0]?.kind).toBe('property');
+      expect(cg.getNodesByName('onClick')[0]?.kind).toBe('method');
+    } finally {
+      cg.destroy();
+      tmpDir = undefined;
+    }
+  });
+
+  it('field initializers still register callbacks (fn-ref scan)', async () => {
+    tmpDir = fs.mkdtempSync(path.join(os.tmpdir(), 'cg-808-fnref-'));
+    fs.writeFileSync(
+      path.join(tmpDir, 'main.ts'),
+      [
+        'function onSave(): void {}',
+        'function onLoad(): void {}',
+        'export class Registry {',
+        '  static handlers = { save: onSave, load: onLoad };',
+        '}',
+      ].join('\n')
+    );
+
+    const cg = CodeGraph.initSync(tmpDir);
+    try {
+      await cg.indexAll();
+      const onSave = cg.getNodesByName('onSave')[0]!;
+      const fnRefs = cg
+        .getIncomingEdges(onSave.id)
+        .filter((e) => e.metadata?.fnRef === true);
+      expect(fnRefs.length).toBeGreaterThan(0);
+    } finally {
+      cg.destroy();
+      tmpDir = undefined;
+    }
+  });
+});

+ 20 - 13
docs/design/function-ref-capture.md

@@ -44,7 +44,7 @@ custom `visitNode` hooks like Scala's val/var handler) get a candidates-only
 |---|---|---|---|---|---|
 | C / ObjC | `argument_list` | `assignment_expression.right` | `initializer_pair.value` | `initializer_list`, `init_declarator.value` | `&fn` (`pointer_expression`), `@selector(...)` (ObjC) |
 | C++ | **`&` forms only** in args/rhs/varinit | (same — explicit `&` only) | bare ids at FILE scope only | bare ids at FILE scope only | `&fn`, `&Cls::method` (resolved scoped to the class) |
-| TS / JS (tsx/jsx) | `arguments` | `assignment_expression.right` | `pair.value` | `array`, `variable_declarator.value` | — (see TS notes) |
+| TS / JS (tsx/jsx) | `arguments` | `assignment_expression.right` | `pair.value` | `array`, `variable_declarator.value` | `this.method` (`member_expression`, class-scoped — see rule 3) |
 | Python | `argument_list`, `keyword_argument.value` | `assignment.right` | `pair.value` | `list` | `self.method` (`attribute`) |
 | Go | `argument_list` | `assignment_statement` / `short_var_declaration` (`expression_list`) | `keyed_element` | `literal_value`, `var_spec.value` | — |
 | Rust | `arguments` | `assignment_expression.right` | `field_initializer.value` | `array_expression`, `static_item` / `let_declaration.value` | — |
@@ -77,16 +77,19 @@ custom `visitNode` hooks like Scala's val/var handler) get a candidates-only
    were ungated.
 3. **TS/JS/Python: bare ids resolve to `function` kind only.** A bare
    identifier can never be a method value in these languages (methods need a
-   receiver — `this.m` / `self.m`), and TS class FIELDS are extracted as
-   method-kind nodes (pre-existing extractor quirk), so allowing method
-   targets soaked up locals passed as arguments
-   (`new Set(selectedPointsIndices)` → a same-named "method" field;
-   docopt.py's `name`/`match` params). For the same reason `this.X` capture
-   is disabled for TS/JS — in real code `this.X` value positions are mostly
-   data reads (`setCursor(this.canvas)`). Python's `self.m` form keeps method
-   targets through its own capture shape. C#/Swift/Dart/Java/Kotlin keep
-   method targets (method groups, implicit-self, method references are real
-   method values).
+   receiver — `this.m` / `self.m`), so allowing method targets soaked up
+   locals passed as arguments (`new Set(selectedPointsIndices)`;
+   docopt.py's `name`/`match` params — excalidraw/fmt A/B findings).
+   TS/JS `this.X` values are captured as `this.`-PREFIXED candidates and
+   resolved CLASS-SCOPED (`resolveThisMemberFnRef` in
+   `src/resolution/index.ts`): the target must be a function/method whose
+   qualified name shares the from-symbol's class prefix, same file, no
+   fallback of any kind — `addEventListener(…, this.onResize)` hits the
+   enclosing class's method; `this.fonts` (a property, post-#808 field
+   classification) and inherited/unknown members yield no edge. Python's
+   `self.m` form keeps method targets through its own capture shape.
+   C#/Swift/Dart/Java/Kotlin keep method targets (method groups,
+   implicit-self, method references are real method values).
 4. **C++ is `&`-explicit** (`addressOfOnly`): bare identifiers qualify only in
    FILE-scope initializer tables; everywhere else (args, assignments, local
    braced-init lists `{begin, size}`) only `&fn` / `&Cls::method` count.
@@ -184,5 +187,9 @@ Index cost on redis: +6% time, +5% db size.
   imports, so cross-file bare callbacks only resolve when repo-unique.
 - **PHP string callables**, **Ruby bare symbols** outside `method(:sym)`,
   **`obj.method` member values** where `obj` isn't `this`/`self`: deferred.
-- **TS `this.X`**: disabled until TS class-field kind classification is fixed
-  (fields currently extract as method-kind nodes).
+- **TS/JS `this.X` to inherited members**: the class-scoped resolver matches
+  the enclosing class's OWN members only — `this.handleClick` defined on a
+  superclass yields no edge (would need the supertype walk; deliberate v1).
+  Reading a getter into a local (`const s = this.snapshot`) produces a
+  references edge to the getter — a true dependency with an imperfect
+  "registration" flavor.

+ 1 - 1
src/extraction/extraction-version.ts

@@ -21,4 +21,4 @@
  * turns the re-index hint into noise — keep it honest (see CLAUDE.md, "Honesty
  * in the product is load-bearing").
  */
-export const EXTRACTION_VERSION = 19;
+export const EXTRACTION_VERSION = 20;

+ 20 - 6
src/extraction/function-ref.ts

@@ -158,12 +158,13 @@ function cFamilySpec(extra?: { special?: string[]; addressOfOnly?: boolean }): F
   };
 }
 
-// NOTE: deliberately NO `member_expression` (`this.handleClick`) capture for
-// TS/JS. Class fields with type annotations are extracted as method-kind
-// nodes (pre-existing extractor behavior), so `this.X` value positions —
-// which in real code are mostly DATA reads (`setCursor(this.canvas)`) —
-// resolved to those field nodes and produced wrong "registration" edges
-// (excalidraw A/B finding). Revisit if/when TS field classification is fixed.
+// `this.handleClick` capture (member_expression) emits a `this.`-PREFIXED
+// candidate name: resolution scopes it to the enclosing symbol's class
+// (qualified-name prefix), so `this.fonts` (a property, post-#808) and
+// inherited/unknown members yield no edge, while same-class methods —
+// `btn.on('click', this.handleClick)`, the observer-registration idiom —
+// resolve precisely. Bare identifiers stay function-kind-only (a bare id can
+// never be a method value in JS).
 const TS_JS_SPEC: FnRefSpec = {
   idTypes: new Set(['identifier']),
   dispatch: new Map<string, CaptureRule>([
@@ -173,6 +174,7 @@ const TS_JS_SPEC: FnRefSpec = {
     ['pair', { mode: 'value', field: 'value' }],
     ['array', { mode: 'list' }],
   ]),
+  special: new Set(['member_expression']),
 };
 
 const PYTHON_SPEC: FnRefSpec = {
@@ -613,6 +615,18 @@ function normalizeSpecial(
       return name ? [{ name, node: sym }] : [];
     }
 
+    // `this.handleClick` (TS/JS) — object must be EXACTLY `this`. The name
+    // keeps the `this.` prefix so resolution can scope it to the enclosing
+    // class (see resolveThisMemberFnRef) instead of bare name-matching.
+    case 'member_expression': {
+      const obj = getChildByField(node, 'object');
+      const prop = getChildByField(node, 'property');
+      if (obj && prop && obj.type === 'this' && prop.type === 'property_identifier') {
+        return [{ name: `this.${getNodeText(prop, source)}`, node: prop }];
+      }
+      return [];
+    }
+
     // `self.handle_click` (Python) — object must be EXACTLY `self`.
     case 'attribute': {
       const obj = getChildByField(node, 'object');

+ 15 - 0
src/extraction/languages/javascript.ts

@@ -1,10 +1,14 @@
 import { getNodeText, getChildByField } from '../tree-sitter-helpers';
 import type { LanguageExtractor } from '../tree-sitter-types';
+import { classifyTsClassMember } from './typescript';
 
 export const javascriptExtractor: LanguageExtractor = {
   functionTypes: ['function_declaration', 'arrow_function', 'function_expression'],
   classTypes: ['class_declaration'],
   methodTypes: ['method_definition', 'field_definition'],
+  // JS `field_definition` ≙ TS `public_field_definition`: plain fields are
+  // properties, function-valued fields are methods (#808).
+  classifyMethodNode: classifyTsClassMember,
   interfaceTypes: [],
   structTypes: [],
   enumTypes: [],
@@ -13,6 +17,17 @@ export const javascriptExtractor: LanguageExtractor = {
   callTypes: ['call_expression'],
   variableTypes: ['lexical_declaration', 'variable_declaration'],
   nameField: 'name',
+  // JS `field_definition` names its key the `property` field (TS's
+  // public_field_definition uses `name`). Without this, JS class fields —
+  // including arrow-function handler fields — extracted no name and produced
+  // no node at all (#808).
+  resolveName: (node, source) => {
+    if (node.type === 'field_definition') {
+      const prop = getChildByField(node, 'property');
+      if (prop) return getNodeText(prop, source);
+    }
+    return undefined;
+  },
   bodyField: 'body',
   resolveBody: (node, bodyField) => {
     // field_definition (arrow function class fields) nest the body inside

+ 38 - 0
src/extraction/languages/typescript.ts

@@ -1,10 +1,48 @@
 import { getNodeText, getChildByField } from '../tree-sitter-helpers';
 import type { LanguageExtractor } from '../tree-sitter-types';
+import type { Node as SyntaxNode } from 'web-tree-sitter';
+
+/**
+ * A TS/JS class field (`public_field_definition` / `field_definition`) is a
+ * METHOD only when its value is callable — an arrow function, a function
+ * expression, or a HOF call wrapping one (`onScroll = throttle(() => {…})`),
+ * exactly mirroring what `resolveBody` below knows how to walk. Everything
+ * else (`public fonts: Fonts;`, `count = 0`, `static defaults = {…}`) is a
+ * PROPERTY. Previously every field extracted as method-kind (#808), which
+ * misrepresented class shape and defeated kind-based filtering — the reason
+ * #756's function-ref resolution had to restrict TS/JS bare identifiers to
+ * function targets.
+ */
+export function classifyTsClassMember(node: SyntaxNode): 'method' | 'property' {
+  if (node.type !== 'public_field_definition' && node.type !== 'field_definition') {
+    return 'method'; // method_definition, getters/setters — untouched
+  }
+  for (let i = 0; i < node.namedChildCount; i++) {
+    const child = node.namedChild(i);
+    if (!child) continue;
+    if (child.type === 'arrow_function' || child.type === 'function_expression') {
+      return 'method';
+    }
+    if (child.type === 'call_expression') {
+      const args = getChildByField(child, 'arguments');
+      if (args) {
+        for (let j = 0; j < args.namedChildCount; j++) {
+          const arg = args.namedChild(j);
+          if (arg && (arg.type === 'arrow_function' || arg.type === 'function_expression')) {
+            return 'method';
+          }
+        }
+      }
+    }
+  }
+  return 'property';
+}
 
 export const typescriptExtractor: LanguageExtractor = {
   functionTypes: ['function_declaration', 'arrow_function', 'function_expression'],
   classTypes: ['class_declaration', 'abstract_class_declaration'],
   methodTypes: ['method_definition', 'public_field_definition'],
+  classifyMethodNode: classifyTsClassMember,
   interfaceTypes: ['interface_declaration'],
   structTypes: [],
   enumTypes: ['enum_declaration'],

+ 9 - 0
src/extraction/tree-sitter-types.ts

@@ -180,6 +180,15 @@ export interface LanguageExtractor {
    */
   classifyClassNode?: (node: SyntaxNode) => 'class' | 'struct' | 'enum' | 'interface' | 'trait';
 
+  /**
+   * Classify a methodTypes node when the grammar reuses one node type for
+   * both callable and data members (#808): TS/JS class FIELDS
+   * (`public_field_definition` / `field_definition`) are methods only when
+   * their value is callable (`onClick = () => {}`); a plain field
+   * (`public fonts: Fonts;`, `count = 0`) is a property. Default: 'method'.
+   */
+  classifyMethodNode?: (node: SyntaxNode) => 'method' | 'property';
+
   /**
    * Resolve the body node for a function/method/class when it's not a child field.
    * (e.g. Dart puts function_body as a sibling, not a child.)

+ 59 - 19
src/extraction/tree-sitter.ts

@@ -473,11 +473,14 @@ export class TreeSitterExtractor {
       // variable; see FnRefSpec.ungatedModes). Local initializers and
       // everything else require a same-file/import match.
       const skipGate = ungated?.has(c.mode) === true && atFileScope;
-      // Qualified C++ member-pointers (`Widget::on_click`) gate on the member
-      // name; everything else on the full name.
-      const gateName = c.name.includes('::')
-        ? c.name.slice(c.name.lastIndexOf('::') + 2)
-        : c.name;
+      // Qualified C++ member-pointers (`Widget::on_click`) and TS/JS
+      // `this.<member>` candidates gate on the member name; everything else
+      // on the full name.
+      const gateName = c.name.startsWith('this.')
+        ? c.name.slice(5)
+        : c.name.includes('::')
+          ? c.name.slice(c.name.lastIndexOf('::') + 2)
+          : c.name;
       if (!skipGate && !definedHere.has(gateName) && !importedNames.has(gateName)) {
         continue;
       }
@@ -564,8 +567,30 @@ export class TreeSitterExtractor {
     }
     // Check for method declarations (only if not already handled by functionTypes)
     else if (this.extractor.methodTypes.includes(nodeType)) {
-      this.extractMethod(node);
-      skipChildren = true; // extractMethod visits children via visitFunctionBody
+      // TS/JS class fields parse as a methodTypes node; only function-valued
+      // fields are methods — a plain field (`public fonts: Fonts;`) is a
+      // property (#808). classifyMethodNode is absent for other languages.
+      if (this.extractor.classifyMethodNode?.(node) === 'property') {
+        const propNode = this.extractProperty(node);
+        // Walk the initializer so its calls/instantiations attribute to the
+        // property (`history = createHistory()` → history calls
+        // createHistory). The old field-as-method path never walked these
+        // (resolveBody only resolves function bodies), so this is additive.
+        const valueNode = getChildByField(node, 'value');
+        if (propNode && valueNode) {
+          this.nodeStack.push(propNode.id);
+          this.visitFunctionBody(valueNode, '');
+          this.nodeStack.pop();
+        }
+        // A field initializer can also register callbacks
+        // (`static handlers = { click: onClick }`) — scan it for
+        // function-as-value candidates (capture-only, halts at functions).
+        this.scanFnRefSubtree(node, 0);
+        skipChildren = true;
+      } else {
+        this.extractMethod(node);
+        skipChildren = true; // extractMethod visits children via visitFunctionBody
+      }
     }
     // Check for interface/protocol/trait declarations
     else if (this.extractor.interfaceTypes.includes(nodeType)) {
@@ -1302,27 +1327,41 @@ export class TreeSitterExtractor {
    * Extract a class property declaration (e.g. C# `public string Name { get; set; }`).
    * Extracts as 'property' kind node inside the owning class.
    */
-  private extractProperty(node: SyntaxNode): void {
-    if (!this.extractor) return;
+  private extractProperty(node: SyntaxNode): Node | null {
+    if (!this.extractor) return null;
 
     const docstring = getPrecedingDocstring(node, this.source);
     const visibility = this.extractor.getVisibility?.(node);
     const isStatic = this.extractor.isStatic?.(node) ?? false;
 
     const hookName = this.extractor.extractPropertyName?.(node, this.source);
+    // JS `field_definition` names its key the `property` field (TS uses
+    // `name`) — try both before the generic identifier scan (#808).
     const nameNode = hookName
       ? null
-      : getChildByField(node, 'name') || node.namedChildren.find(c => c.type === 'identifier');
+      : getChildByField(node, 'name') ||
+        getChildByField(node, 'property') ||
+        node.namedChildren.find(c => c.type === 'identifier');
     const name = hookName ?? (nameNode ? getNodeText(nameNode, this.source) : null);
-    if (!name) return;
-
-    // Get property type from the type child (first named child that isn't modifier or identifier)
-    const typeNode = node.namedChildren.find(
-      c => c.type !== 'modifier' && c.type !== 'modifiers'
-        && c.type !== 'identifier' && c.type !== 'accessor_list'
-        && c.type !== 'accessors' && c.type !== 'equals_value_clause'
-    );
-    const typeText = typeNode ? getNodeText(typeNode, this.source) : undefined;
+    if (!name) return null;
+
+    // Get property type. TS/JS field definitions carry an explicit `type`
+    // field (a `type_annotation`); their other named children are the name
+    // and the initializer VALUE, which the generic finder below would
+    // wrongly pick — so fields use the type field only (#808). Other
+    // languages (C# property_declaration) keep the generic scan.
+    const isTsJsField =
+      node.type === 'public_field_definition' || node.type === 'field_definition';
+    const typeNode = isTsJsField
+      ? getChildByField(node, 'type')
+      : node.namedChildren.find(
+          c => c.type !== 'modifier' && c.type !== 'modifiers'
+            && c.type !== 'identifier' && c.type !== 'accessor_list'
+            && c.type !== 'accessors' && c.type !== 'equals_value_clause'
+        );
+    const typeText = typeNode
+      ? getNodeText(typeNode, this.source).replace(/^:\s*/, '')
+      : undefined;
     const signature = typeText ? `${typeText} ${name}` : name;
 
     const propNode = this.createNode('property', name, node, {
@@ -1341,6 +1380,7 @@ export class TreeSitterExtractor {
       // `type_annotation` children; the C# branch walks the `type` field.
       this.extractTypeAnnotations(node, propNode.id);
     }
+    return propNode;
   }
 
   /**

+ 40 - 0
src/resolution/index.ts

@@ -675,6 +675,11 @@ export class ReferenceResolver {
     // (same-file first, unique-only cross-file, function/method targets only).
     // They never reach the framework or fuzzy strategies below.
     if (ref.referenceKind === 'function_ref') {
+      // `this.<member>` values (TS/JS) resolve ONLY against the enclosing
+      // class's own members — never a same-named symbol elsewhere.
+      if (ref.referenceName.startsWith('this.')) {
+        return this.gateLanguage(this.resolveThisMemberFnRef(ref), ref);
+      }
       const viaImport = this.gateLanguage(resolveViaImport(ref, this.context), ref);
       if (viaImport) {
         const target = this.queries.getNodeById(viaImport.targetNodeId);
@@ -1184,6 +1189,41 @@ export class ReferenceResolver {
     return { original: ref, targetNodeId: target.id, confidence: 0.9, resolvedBy: 'import' };
   }
 
+  /**
+   * Resolve a `this.<member>` function-as-value reference (#756/#808) to the
+   * ENCLOSING CLASS's own member — never a same-named symbol elsewhere. The
+   * registration idiom (`btn.on('click', this.handleClick)`) names a member
+   * of the class being defined, so the only valid target shares the
+   * from-symbol's qualified-name scope. Function/method targets only — a
+   * property (a data field, post-#808 classification) yields no edge — same
+   * file required, no fallback of any kind.
+   */
+  private resolveThisMemberFnRef(ref: UnresolvedRef): ResolvedRef | null {
+    const member = ref.referenceName.slice('this.'.length);
+    if (!member) return null;
+    const fromNode = this.queries.getNodeById(ref.fromNodeId);
+    if (!fromNode) return null;
+    const sep = fromNode.qualifiedName.lastIndexOf('::');
+    if (sep <= 0) return null; // not inside a class scope
+    const classPrefix = fromNode.qualifiedName.slice(0, sep);
+    const candidates = this.context
+      .getNodesByQualifiedName(`${classPrefix}::${member}`)
+      .filter(
+        (n) =>
+          (n.kind === 'function' || n.kind === 'method') &&
+          n.filePath === ref.filePath &&
+          n.id !== ref.fromNodeId
+      );
+    if (candidates.length === 0) return null;
+    const target = candidates.reduce((a, b) => (a.startLine <= b.startLine ? a : b));
+    return {
+      original: ref,
+      targetNodeId: target.id,
+      confidence: 0.95,
+      resolvedBy: 'function-ref',
+    };
+  }
+
   private gateLanguage(result: ResolvedRef | null, ref: UnresolvedRef): ResolvedRef | null {
     if (!result) return result;
     const tgt = this.getLanguageFromNodeId(result.targetNodeId);

+ 4 - 0
src/resolution/name-matcher.ts

@@ -180,6 +180,10 @@ export function matchFunctionRef(
   ref: UnresolvedRef,
   context: ResolutionContext
 ): ResolvedRef | null {
+  // `this.<member>` refs are resolved ONLY by the class-scoped resolver in
+  // resolveOne (resolveThisMemberFnRef) — never by name matching here.
+  if (ref.referenceName.startsWith('this.')) return null;
+
   // In JS/TS/Python a bare identifier can never be a method value (methods
   // are only reachable through a receiver — `this.m` / `self.m` /
   // `Cls.m`), so bare fn-refs match FUNCTIONS only. This also sidesteps the