refactor(compiler-cli): add a resource debugName transform (angular#64172)

Add a TS transform for `resource` (and `httpResource`) `debugName`. Test the transformations.

PR Close angular#64172

Author: hawkgs

packages/compiler-cli/src/ngtsc/transform/src/implicit_signal_debug_name_transform.ts

@@ -15,31 +15,27 @@ function insertDebugNameIntoCallExpression(
   const signalExpressionIsRequired = isRequiredSignalFunction(callExpression.expression);
   let configPosition = signalExpressionIsRequired ? 0 : 1;
 
-  const nodeArgs = Array.from(callExpression.arguments);
-
   // 1. If the call expression has no arguments, we pretend that the config object is at position 0.
   // We do this so that we can insert a spread element at the start of the args list in a way where
   // undefined can be the first argument but still get tree-shaken out in production builds.
   // or
-  // 2. Since `linkedSignal` with computation uses a single object for both computation logic
-  // and options (unlike other signal-based primitives), we set the argument position to 0, i.e.
-  // reusing the computation logic object.
+  // 2. If the signal has an object-only definition (e.g. `linkedSignal` or `resource`), we set
+  // the argument position to 0, i.e. reusing the existing object.
   const signalExpressionHasNoArguments = callExpression.arguments.length === 0;
-  const isLinkedSignal = callExpression.expression.getText() === 'linkedSignal';
-  const isComputationLinkedSignal =
-    isLinkedSignal && nodeArgs[0].kind === ts.SyntaxKind.ObjectLiteralExpression;
-  if (signalExpressionHasNoArguments || isComputationLinkedSignal) {
+  const signalWithObjectOnlyDefinition = isSignalWithObjectOnlyDefinition(callExpression);
+  if (signalExpressionHasNoArguments || signalWithObjectOnlyDefinition) {
     configPosition = 0;
   }
 
+  const nodeArgs = Array.from(callExpression.arguments);
   let existingArgument = nodeArgs[configPosition];
 
   if (existingArgument === undefined) {
     existingArgument = ts.factory.createObjectLiteralExpression([]);
   }
 
   // Do nothing if an identifier is used as the config object
-  // Ex -
+  // Ex:
   // const defaultObject = { equals: () => false };
   // signal(123, defaultObject)
   if (ts.isIdentifier(existingArgument)) {
@@ -104,15 +100,18 @@ function insertDebugNameIntoCallExpression(
 
   let transformedSignalArgs: ts.NodeArray<ts.Expression>;
 
-  if (signalExpressionIsRequired || signalExpressionHasNoArguments || isComputationLinkedSignal) {
+  if (
+    signalExpressionIsRequired ||
+    signalExpressionHasNoArguments ||
+    signalWithObjectOnlyDefinition
+  ) {
     // 1. If the call expression is a required signal function, there is no args other than the config object.
     // So we just use the spread element as the only argument.
     // or
     // 2. If the call expression has no arguments (ex. input(), model(), etc), we already added the undefined
     // identifier in the spread element above. So we use that spread Element as is.
     // or
-    // 3. We are transforming a `linkedSignal` with computation (i.e. we have a single object for both
-    // logic and options).
+    // 3. We are transforming a signal with object-only definition.
     transformedSignalArgs = ts.factory.createNodeArray([spreadElementContainingUpdatedOptions]);
   } else {
     // 3. Signal expression is not required and has arguments.
@@ -234,6 +233,23 @@ function isPropertyDeclarationCase(
   return ts.isIdentifier(expression) && isSignalFunction(expression);
 }
 
+type PackageName = 'core' | 'common';
+
+const signalFunctions: ReadonlyMap<string, PackageName> = new Map([
+  ['signal', 'core'],
+  ['computed', 'core'],
+  ['linkedSignal', 'core'],
+  ['input', 'core'],
+  ['model', 'core'],
+  ['viewChild', 'core'],
+  ['viewChildren', 'core'],
+  ['contentChild', 'core'],
+  ['contentChildren', 'core'],
+  ['effect', 'core'],
+  ['resource', 'core'],
+  ['httpResource', 'common'],
+]);
+
 /**
  *
  * Determines if a node is an expression that references an @angular/core imported symbol.
@@ -243,7 +259,7 @@ function isPropertyDeclarationCase(
  * const mySignal = signal(123); // expressionIsUsingAngularImportedSymbol === true
  * ```
  */
-function expressionIsUsingAngularCoreImportedSymbol(
+function expressionIsUsingAngularImportedSymbol(
   program: ts.Program,
   expression: ts.Expression,
 ): boolean {
@@ -282,25 +298,14 @@ function expressionIsUsingAngularCoreImportedSymbol(
   }
 
   const specifier = importDeclaration.moduleSpecifier.text;
+  const packageName = signalFunctions.get(expression.getText());
   return (
     specifier !== undefined &&
-    (specifier === '@angular/core' || specifier.startsWith('@angular/core/'))
+    packageName !== undefined &&
+    (specifier === `@angular/${packageName}` || specifier.startsWith(`@angular/${packageName}/`))
   );
 }
 
-const signalFunctions: ReadonlySet<string> = new Set([
-  'signal',
-  'computed',
-  'linkedSignal',
-  'input',
-  'model',
-  'viewChild',
-  'viewChildren',
-  'contentChild',
-  'contentChildren',
-  'effect',
-]);
-
 function isSignalFunction(expression: ts.Identifier): boolean {
   const text = expression.text;
 
@@ -331,10 +336,10 @@ function transformVariableDeclaration(
 
   const expression = node.initializer.expression;
   if (ts.isPropertyAccessExpression(expression)) {
-    if (!expressionIsUsingAngularCoreImportedSymbol(program, expression.expression)) {
+    if (!expressionIsUsingAngularImportedSymbol(program, expression.expression)) {
       return node;
     }
-  } else if (!expressionIsUsingAngularCoreImportedSymbol(program, expression)) {
+  } else if (!expressionIsUsingAngularImportedSymbol(program, expression)) {
     return node;
   }
 
@@ -362,10 +367,10 @@ function transformPropertyAssignment(
 ): ts.ExpressionStatement {
   const expression = node.expression.right.expression;
   if (ts.isPropertyAccessExpression(expression)) {
-    if (!expressionIsUsingAngularCoreImportedSymbol(program, expression.expression)) {
+    if (!expressionIsUsingAngularImportedSymbol(program, expression.expression)) {
       return node;
     }
-  } else if (!expressionIsUsingAngularCoreImportedSymbol(program, expression)) {
+  } else if (!expressionIsUsingAngularImportedSymbol(program, expression)) {
     return node;
   }
 
@@ -387,10 +392,10 @@ function transformPropertyDeclaration(
 
   const expression = node.initializer.expression;
   if (ts.isPropertyAccessExpression(expression)) {
-    if (!expressionIsUsingAngularCoreImportedSymbol(program, expression.expression)) {
+    if (!expressionIsUsingAngularImportedSymbol(program, expression.expression)) {
       return node;
     }
-  } else if (!expressionIsUsingAngularCoreImportedSymbol(program, expression)) {
+  } else if (!expressionIsUsingAngularImportedSymbol(program, expression)) {
     return node;
   }
 
@@ -410,6 +415,24 @@ function transformPropertyDeclaration(
   }
 }
 
+/**
+ * The function determines whether the target signal has an object-only definition, that includes
+ * both the computation logic and the options (unlike other signal-based primitives), or not.
+ * Ex: `linkedSignal` with computation, `resource`
+ */
+function isSignalWithObjectOnlyDefinition(callExpression: ts.CallExpression): boolean {
+  const callExpressionText = callExpression.expression.getText();
+  const nodeArgs = Array.from(callExpression.arguments);
+
+  const isLinkedSignal = callExpressionText === 'linkedSignal';
+  const isComputationLinkedSignal =
+    isLinkedSignal && nodeArgs[0].kind === ts.SyntaxKind.ObjectLiteralExpression;
+
+  const isResource = callExpressionText === 'resource';
+
+  return isComputationLinkedSignal || isResource;
+}
+
 /**
  *
  * This transformer adds a debugName property to the config object of signal functions like