fix(compiler-cli): signal not invoked diagnostic not raised when input has same name in template (#63754)

The diagnostic that flags signals which haven't been invoked has some logic to skip over inputs, however it was looking at the used directives across the entire template, not the ones on the specific node.

Fixes #63739.

PR Close #63754

Author: crisbeto

packages/compiler-cli/src/ngtsc/typecheck/extended/checks/interpolated_signal_not_invoked/index.ts

@@ -54,14 +54,16 @@ class InterpolatedSignalCheck extends TemplateCheckWithVisitor<ErrorCode.INTERPO
     }
     // bound properties like `[prop]="mySignal"`
     else if (node instanceof TmplAstBoundAttribute) {
-      // we skip the check if the node is an input binding
-      const usedDirectives = ctx.templateTypeChecker.getUsedDirectives(component);
+      const symbol = ctx.templateTypeChecker.getSymbolOfNode(node, component);
+
       if (
-        usedDirectives !== null &&
-        usedDirectives.some((dir) => dir.inputs.getByBindingPropertyName(node.name) !== null)
+        symbol?.kind === SymbolKind.Input &&
+        symbol.bindings.length > 0 &&
+        symbol.bindings.some((binding) => binding.target.kind === SymbolKind.Directive)
       ) {
         return [];
       }
+
       // otherwise, we check if the node is
       const nodeAst = isPropertyReadNodeAst(node);
       if (

packages/compiler-cli/src/ngtsc/typecheck/extended/test/checks/interpolated_signal_not_invoked/interpolated_signal_not_invoked_spec.ts

@@ -627,6 +627,56 @@ runInEachFileSystem(() => {
     expect(getSourceCodeForDiagnostic(diags[0])).toBe(`myNestedSignal`);
   });
 
+  // See https://github.com/angular/angular/issues/63739
+  it('should produce a warning if the template contains a directive with the same input name, but on a different node', () => {
+    const fileName = absoluteFrom('/main.ts');
+    const {program, templateTypeChecker} = setup([
+      {
+        fileName,
+        templates: {
+          'TestCmp': `<child /> <div [id]="title"></div>`,
+        },
+        source: `
+          import {signal, input} from '@angular/core';
+
+          export class Child {
+            id = input(0);
+          }
+
+          export class TestCmp {
+            title = signal('');
+          }`,
+        declarations: [
+          {
+            type: 'directive',
+            name: 'Child',
+            selector: 'child',
+            inputs: {
+              id: {
+                isSignal: true,
+                bindingPropertyName: 'id',
+                classPropertyName: 'id',
+                required: false,
+                transform: null,
+              },
+            },
+          },
+        ],
+      },
+    ]);
+    const sf = getSourceFileOrError(program, fileName);
+    const component = getClass(sf, 'TestCmp');
+    const extendedTemplateChecker = new ExtendedTemplateCheckerImpl(
+      templateTypeChecker,
+      program.getTypeChecker(),
+      [interpolatedSignalFactory],
+      {} /* options */,
+    );
+    const diags = extendedTemplateChecker.getDiagnosticsForComponent(component);
+    expect(diags.length).toBe(1);
+    expect(diags[0].messageText).toBe('title is a function and should be invoked: title()');
+  });
+
   [
     ['dom property', 'id'],
     ['class', 'class.green'],
@@ -640,7 +690,7 @@ runInEachFileSystem(() => {
         {
           fileName,
           templates: {
-            'TestCmp': `<div [${binding}]="mySignal"></div> 
+            'TestCmp': `<div [${binding}]="mySignal"></div>
             <div [${binding}]="!negatedSignal"></div>`,
           },
           source: `