@ethlete/eslint-plugin 1.0.0-next.23 → 1.0.0-next.25

package/src/rules/require-on-push-change-detection.js

@@ -1,6 +1,14 @@
 // @ts-check
 'use strict';
 
+const {
+  ANGULAR_CORE,
+  getAngularDecoratorName,
+  getImportLocalName,
+  isImportedAs,
+  resolveIdentifier,
+} = require('./internals/import-resolution');
+
 const COMPONENT_ORDER = ['selector', 'template', 'styleUrl', 'encapsulation', 'changeDetection'];
 
 // OnPush became the default change detection strategy in Angular 22, so from
@@ -187,7 +195,7 @@ const getChangeDetectionInsertionTarget = (metadata) => {
  * @param {any} metadata
  */
 const buildMetadataFix = (sourceCode, metadata) => {
-  const changeDetectionText = 'changeDetection: ChangeDetectionStrategy.OnPush';
+  const changeDetectionText = `changeDetection: ${getImportLocalName(sourceCode, ANGULAR_CORE, 'ChangeDetectionStrategy') ?? 'ChangeDetectionStrategy'}.OnPush`;
   const properties = metadata.properties;
   const insertionTarget = getChangeDetectionInsertionTarget(metadata);
   const isMultiline = Boolean(metadata.loc && metadata.loc.start.line !== metadata.loc.end.line);
@@ -236,6 +244,10 @@ const buildMetadataFix = (sourceCode, metadata) => {
  * @param {any} valueNode
  */
 const buildFix = (sourceCode, metadata, valueNode) => {
+  const valueFix = valueNode && ((fixer) => fixer.replaceText(valueNode.property, 'OnPush'));
+  if (valueNode && valueNode.object.type !== 'Identifier') return valueFix;
+  if (valueNode && resolveIdentifier(sourceCode, valueNode.object)?.source) return valueFix;
+
   const fixes = [];
   const angularCoreImport = findAngularCoreImport(sourceCode);
   const importFix = angularCoreImport
@@ -244,12 +256,8 @@ const buildFix = (sourceCode, metadata, valueNode) => {
 
   if (importFix) fixes.push(importFix);
 
-  if (valueNode) {
-    fixes.push((fixer) => fixer.replaceText(valueNode, 'ChangeDetectionStrategy.OnPush'));
-  } else {
-    const metadataFix = buildMetadataFix(sourceCode, metadata);
-    if (metadataFix) fixes.push(metadataFix);
-  }
+  const metadataFix = valueFix ?? buildMetadataFix(sourceCode, metadata);
+  if (metadataFix) fixes.push(metadataFix);
 
   return (fixer) => fixes.map((applyFix) => applyFix(fixer));
 };
@@ -278,24 +286,9 @@ const requireOnPushChangeDetection = {
 
     const sourceCode = context.sourceCode;
 
-    /**
-     * @param {import('eslint').Rule.Node} node
-     */
-    const isComponentDecorator = (node) => {
-      const decorator = /** @type {any} */ (node);
-      if (decorator.type !== 'Decorator') return false;
-
-      const expression = decorator.expression;
-      if (expression.type === 'CallExpression') {
-        return expression.callee.type === 'Identifier' && expression.callee.name === 'Component';
-      }
-
-      return expression.type === 'Identifier' && expression.name === 'Component';
-    };
-
     return {
       Decorator(node) {
-        if (!isComponentDecorator(node)) return;
+        if (getAngularDecoratorName(sourceCode, node) !== 'Component') return;
 
         const decorator = /** @type {any} */ (node);
         const expression = decorator.expression;
@@ -320,8 +313,7 @@ const requireOnPushChangeDetection = {
         const value = changeDetectionProp.value;
         if (
           value.type === 'MemberExpression' &&
-          value.object.type === 'Identifier' &&
-          value.object.name === 'ChangeDetectionStrategy' &&
+          isImportedAs(sourceCode, value.object, 'ChangeDetectionStrategy') &&
           value.property.type === 'Identifier' &&
           value.property.name !== 'OnPush'
         ) {

package/src/rules/require-view-encapsulation-none.js

@@ -1,6 +1,14 @@
 // @ts-check
 'use strict';
 
+const {
+  ANGULAR_CORE,
+  getAngularDecoratorName,
+  getImportLocalName,
+  isImportedAs,
+  resolveIdentifier,
+} = require('./internals/import-resolution');
+
 const COMPONENT_ORDER = ['selector', 'template', 'styleUrl', 'encapsulation', 'changeDetection'];
 
 /**
@@ -141,7 +149,7 @@ const getEncapsulationInsertionTarget = (metadata) => {
  * @param {any} metadata
  */
 const buildMetadataFix = (sourceCode, metadata) => {
-  const encText = 'encapsulation: ViewEncapsulation.None';
+  const encText = `encapsulation: ${getImportLocalName(sourceCode, ANGULAR_CORE, 'ViewEncapsulation') ?? 'ViewEncapsulation'}.None`;
   const properties = metadata.properties;
   const insertionTarget = getEncapsulationInsertionTarget(metadata);
   const isMultiline = Boolean(metadata.loc && metadata.loc.start.line !== metadata.loc.end.line);
@@ -189,6 +197,10 @@ const buildMetadataFix = (sourceCode, metadata) => {
  * @param {any} valueNode
  */
 const buildFix = (sourceCode, metadata, valueNode) => {
+  const valueFix = valueNode && ((fixer) => fixer.replaceText(valueNode.property, 'None'));
+  if (valueNode && valueNode.object.type !== 'Identifier') return valueFix;
+  if (valueNode && resolveIdentifier(sourceCode, valueNode.object)?.source) return valueFix;
+
   const fixes = [];
   const angularCoreImport = findAngularCoreImport(sourceCode);
   const importFix = angularCoreImport
@@ -197,12 +209,8 @@ const buildFix = (sourceCode, metadata, valueNode) => {
 
   if (importFix) fixes.push(importFix);
 
-  if (valueNode) {
-    fixes.push((fixer) => fixer.replaceText(valueNode, 'ViewEncapsulation.None'));
-  } else {
-    const metadataFix = buildMetadataFix(sourceCode, metadata);
-    if (metadataFix) fixes.push(metadataFix);
-  }
+  const metadataFix = valueFix ?? buildMetadataFix(sourceCode, metadata);
+  if (metadataFix) fixes.push(metadataFix);
 
   return (fixer) => fixes.map((applyFix) => applyFix(fixer));
 };
@@ -224,24 +232,9 @@ const requireViewEncapsulationNone = {
   create(context) {
     const sourceCode = context.sourceCode;
 
-    /**
-     * @param {import('eslint').Rule.Node} node
-     */
-    const isComponentDecorator = (node) => {
-      const decorator = /** @type {any} */ (node);
-      if (decorator.type !== 'Decorator') return false;
-
-      const expression = decorator.expression;
-      if (expression.type === 'CallExpression') {
-        return expression.callee.type === 'Identifier' && expression.callee.name === 'Component';
-      }
-
-      return expression.type === 'Identifier' && expression.name === 'Component';
-    };
-
     return {
       Decorator(node) {
-        if (!isComponentDecorator(node)) return;
+        if (getAngularDecoratorName(sourceCode, node) !== 'Component') return;
 
         const decorator = /** @type {any} */ (node);
         const expression = decorator.expression;
@@ -266,8 +259,7 @@ const requireViewEncapsulationNone = {
         const value = encProp.value;
         if (
           value.type === 'MemberExpression' &&
-          value.object.type === 'Identifier' &&
-          value.object.name === 'ViewEncapsulation' &&
+          isImportedAs(sourceCode, value.object, 'ViewEncapsulation') &&
           value.property.type === 'Identifier' &&
           value.property.name !== 'None'
         ) {

package/src/rules/take-until-destroyed-last.js

@@ -0,0 +1,64 @@
+// @ts-check
+'use strict';
+
+const { isImportedAs } = require('./internals/import-resolution');
+
+/**
+ * Requires takeUntilDestroyed() to be the last operator in a .pipe().
+ *
+ * BAD:
+ *   obs$.pipe(
+ *     takeUntilDestroyed(),
+ *     switchMap(() => fromEvent(el, 'scroll')), // ❌ the inner subscription outlives the component
+ *   ).subscribe();
+ *
+ * GOOD:
+ *   obs$.pipe(
+ *     switchMap(() => fromEvent(el, 'scroll')),
+ *     takeUntilDestroyed(), // ✅ tears down everything above it
+ *   ).subscribe();
+ */
+
+/** @type {import('eslint').Rule.RuleModule} */
+const takeUntilDestroyedLast = {
+  meta: {
+    type: 'problem',
+    docs: {
+      description: 'Require takeUntilDestroyed() to be the last operator in a .pipe().',
+      recommended: true,
+    },
+    messages: {
+      takeUntilDestroyedLast:
+        'takeUntilDestroyed() must be the last operator in the pipe. An operator after it (switchMap, shareReplay, …) can keep the subscription alive after destroy.',
+    },
+    schema: [],
+  },
+  create(context) {
+    /** @param {import('estree').Node} node */
+    const isTakeUntilDestroyedCall = (node) =>
+      node.type === 'CallExpression' &&
+      isImportedAs(context.sourceCode, node.callee, 'takeUntilDestroyed', '@angular/core/rxjs-interop');
+
+    return {
+      CallExpression(node) {
+        const { callee } = node;
+        if (
+          callee.type !== 'MemberExpression' ||
+          callee.property.type !== 'Identifier' ||
+          callee.property.name !== 'pipe'
+        ) {
+          return;
+        }
+
+        const lastIndex = node.arguments.length - 1;
+        node.arguments.forEach((arg, index) => {
+          if (index < lastIndex && isTakeUntilDestroyedCall(arg)) {
+            context.report({ node: arg, messageId: 'takeUntilDestroyedLast' });
+          }
+        });
+      },
+    };
+  },
+};
+
+module.exports = takeUntilDestroyedLast;

package/src/rules/template-member-accessibility.js

@@ -7,15 +7,17 @@ const {
   isReferencedFromTemplateOrHost,
 } = require('./internals/angular-member-visibility');
 const { getImplementedContractMemberNames } = require('./internals/implemented-contract-members');
+const { isImportedAs } = require('./internals/import-resolution');
 const { buildAccessibilityFix } = require('./internals/member-accessibility-fix');
 
 /**
+ * @param {import('eslint').SourceCode} sourceCode
  * @param {any} node
  */
-const isInjectCall = (node) => {
+const isInjectCall = (sourceCode, node) => {
   if (!node || node.type !== 'PropertyDefinition' || !node.value) return false;
   if (node.value.type !== 'CallExpression') return false;
-  return node.value.callee.type === 'Identifier' && node.value.callee.name === 'inject';
+  return isImportedAs(sourceCode, node.value.callee, 'inject');
 };
 
 /**
@@ -91,11 +93,11 @@ const templateMemberAccessibility = {
      */
     const checkMember = (node) => {
       if (!isSupportedMember(node)) return;
-      if (node.type === 'PropertyDefinition' && isInjectCall(node)) return;
+      if (node.type === 'PropertyDefinition' && isInjectCall(context.sourceCode, node)) return;
 
       const classNode = node.parent && node.parent.type === 'ClassBody' ? node.parent.parent : null;
       if (!classNode || (classNode.type !== 'ClassDeclaration' && classNode.type !== 'ClassExpression')) return;
-      if (!getAngularMetadata(classNode)) return;
+      if (!getAngularMetadata(context.sourceCode, classNode)) return;
 
       const memberName = getMemberName(node);
       if (!memberName) return;
@@ -148,11 +150,11 @@ const templateMemberAccessibility = {
      */
     const checkImplicitPublicMember = (node) => {
       if (!isSupportedMember(node)) return;
-      if (node.type === 'PropertyDefinition' && isInjectCall(node)) return;
+      if (node.type === 'PropertyDefinition' && isInjectCall(context.sourceCode, node)) return;
 
       const classNode = node.parent && node.parent.type === 'ClassBody' ? node.parent.parent : null;
       if (!classNode || (classNode.type !== 'ClassDeclaration' && classNode.type !== 'ClassExpression')) return;
-      if (!getAngularMetadata(classNode)) return;
+      if (!getAngularMetadata(context.sourceCode, classNode)) return;
 
       const memberName = getMemberName(node);
       if (!memberName) return;