@ethlete/eslint-plugin 1.0.0-next.24 → 1.0.0-next.26

package/src/rules/prefer-linked-signal.js

@@ -24,27 +24,43 @@ const { isImportedAs } = require('./internals/import-resolution');
  * GOOD:
  *   selectedItem = linkedSignal(() => this.items()[0] ?? null);
  *
- * NOTE: Only flag when .set() is called directly inside an effect() callback.
- * Setting signals outside effects (in methods, event handlers, etc.) is fine.
+ * Also flagged when the write sits behind an `if`, as long as every branch only
+ * writes signals: `linkedSignal` keeps the previous value for the untaken branch.
  */
 
 /**
- * Returns true only when the `.set()` call node is a *pure derivation* inside
- * an effect() callback — meaning:
- *
- * 1. The IMMEDIATE enclosing function (the first function boundary walking up
- *    from the node) IS the first argument passed to `effect()`. This ensures
- *    that `.set()` calls nested inside `untracked(() => ...)` or other inner
- *    functions within the effect are NOT flagged — those are intentional
- *    write-back patterns, not derivations.
- *
- * 2. The `.set()` call is the SOLE expression in that callback:
- *    - Arrow with expression body: `effect(() => sig.set(x))`
- *    - Block body with a single ExpressionStatement: `effect(() => { sig.set(x); })`
+ * @param {any} node
+ * @returns {boolean}
+ */
+const isSetCall = (node) =>
+  node.type === 'CallExpression' &&
+  node.callee.type === 'MemberExpression' &&
+  node.callee.property.type === 'Identifier' &&
+  node.callee.property.name === 'set' &&
+  node.arguments.length === 1;
+
+/**
+ * A statement that does nothing but write signals: a lone `.set()`, a block holding one, or an
+ * `if`/`else` whose every branch is one.
  *
- *    Multi-statement blocks (even if they end with a `.set()`) indicate that the
- *    effect is performing side effects alongside the signal write, so they are
- *    not flagged either.
+ * @param {any} statement
+ * @returns {boolean}
+ */
+const isSetOnlyStatement = (statement) => {
+  if (!statement) return false;
+  if (statement.type === 'ExpressionStatement') return isSetCall(statement.expression);
+  if (statement.type === 'BlockStatement') return statement.body.length === 1 && isSetOnlyStatement(statement.body[0]);
+  if (statement.type === 'IfStatement') {
+    return (
+      isSetOnlyStatement(statement.consequent) && (!statement.alternate || isSetOnlyStatement(statement.alternate))
+    );
+  }
+  return false;
+};
+
+/**
+ * True when the `.set()` call sits directly in an `effect()` callback (not in a nested function such as
+ * `untracked(() => …)`) and that callback does nothing but write signals, optionally behind an `if`.
  *
  * @param {import('eslint').SourceCode} sourceCode
  * @param {import('eslint').Rule.Node} node The `.set()` CallExpression node
@@ -75,20 +91,10 @@ const isPureSetInDirectEffectCallback = (sourceCode, node) => {
     return false;
   }
 
-  // The .set() must be the sole expression — no surrounding statements.
-  // Case A: arrow with expression body — the body IS the .set() call.
-  if (immediateFunction.type === 'ArrowFunctionExpression' && immediateFunction.body === node) {
-    return true;
-  }
-
-  // Case B: block body with exactly one ExpressionStatement wrapping the .set() call.
   const body = immediateFunction.body;
-  return (
-    body.type === 'BlockStatement' &&
-    body.body.length === 1 &&
-    body.body[0].type === 'ExpressionStatement' &&
-    body.body[0].expression === node
-  );
+  if (body.type !== 'BlockStatement') return body === node;
+
+  return node.parent.type === 'ExpressionStatement' && body.body.length === 1 && isSetOnlyStatement(body.body[0]);
 };
 
 /** @type {import('eslint').Rule.RuleModule} */
@@ -108,15 +114,7 @@ const preferLinkedSignal = {
   create(context) {
     return {
       CallExpression(node) {
-        const { callee } = node;
-
-        if (
-          callee.type === 'MemberExpression' &&
-          callee.property.type === 'Identifier' &&
-          callee.property.name === 'set' &&
-          node.arguments.length === 1 &&
-          isPureSetInDirectEffectCallback(context.sourceCode, node)
-        ) {
+        if (isSetCall(node) && isPureSetInDirectEffectCallback(context.sourceCode, node)) {
           context.report({ node, messageId: 'preferLinkedSignal' });
         }
       },

package/src/rules/prefer-match-media.js

@@ -37,7 +37,12 @@
  *   // … etc. All from @ethlete/core.
  */
 
-const { MODULE_REFERENCE_SELECTOR, getModuleReference, isImportedAs } = require('./internals/import-resolution');
+const {
+  MODULE_REFERENCE_SELECTOR,
+  getModuleReference,
+  isGlobalReference,
+  isImportedAs,
+} = require('./internals/import-resolution');
 
 const CDK_LAYOUT = '@angular/cdk/layout';
 
@@ -62,7 +67,15 @@ const preferMatchMedia = {
       CallExpression(node) {
         const { callee } = node;
 
-        // ── window.matchMedia() ───────────────────────────────────────────────
+        if (
+          callee.type === 'Identifier' &&
+          callee.name === 'matchMedia' &&
+          isGlobalReference(context.sourceCode, callee)
+        ) {
+          context.report({ node, messageId: 'preferMatchMedia' });
+          return;
+        }
+
         if (
           callee.type === 'MemberExpression' &&
           callee.property.type === 'Identifier' &&
@@ -74,9 +87,10 @@ const preferMatchMedia = {
           return;
         }
 
-        // ── inject(BreakpointObserver) ────────────────────────────────────────
         if (
           isImportedAs(context.sourceCode, callee, 'inject') &&
+          node.arguments[0]?.type === 'Identifier' &&
+          isGlobalReference(context.sourceCode, node.arguments[0]) &&
           isImportedAs(context.sourceCode, node.arguments[0], 'BreakpointObserver', CDK_LAYOUT)
         ) {
           context.report({ node, messageId: 'noBreakpointObserver' });

package/src/rules/prefer-rxjs-timer.js

@@ -21,6 +21,9 @@
 
 const { isGlobalReference } = require('./internals/import-resolution');
 
+const GLOBAL_OBJECTS = new Set(['window', 'globalThis', 'self']);
+const WINDOW_MEMBERS = new Set(['win', 'window', '_win', '_window']);
+
 /** @type {import('eslint').Rule.RuleModule} */
 const preferRxjsTimer = {
   meta: {
@@ -44,13 +47,33 @@ const preferRxjsTimer = {
     schema: [],
   },
   create(context) {
+    const getTimerName = (callee) => {
+      if (callee.type === 'Identifier') {
+        return isGlobalReference(context.sourceCode, callee) ? callee.name : null;
+      }
+      if (callee.type !== 'MemberExpression' || callee.computed || callee.property.type !== 'Identifier') return null;
+
+      const { object } = callee;
+      const isWindow =
+        (object.type === 'Identifier' &&
+          GLOBAL_OBJECTS.has(object.name) &&
+          isGlobalReference(context.sourceCode, object)) ||
+        (object.type === 'MemberExpression' &&
+          object.object.type === 'ThisExpression' &&
+          !object.computed &&
+          object.property.type === 'Identifier' &&
+          WINDOW_MEMBERS.has(object.property.name));
+
+      return isWindow ? callee.property.name : null;
+    };
+
     return {
       CallExpression(node) {
         const { callee } = node;
 
-        // ── Global timer calls ────────────────────────────────────────────────
-        if (isGlobalReference(context.sourceCode, callee)) {
-          const { name } = callee;
+        const timerName = getTimerName(callee);
+        if (timerName) {
+          const name = timerName;
           if (name === 'setTimeout') {
             context.report({ node, messageId: 'preferTimer' });
             return;
@@ -65,7 +88,6 @@ const preferRxjsTimer = {
           }
         }
 
-        // ── Member calls: .addEventListener / .removeEventListener ────────────
         if (callee.type === 'MemberExpression' && callee.property.type === 'Identifier') {
           const methodName = callee.property.name;
           if (methodName === 'addEventListener') {

package/src/rules/prefer-scroll-state.js

@@ -41,7 +41,6 @@ const preferScrollState = {
         const { callee } = node;
         const args = node.arguments;
 
-        // ── el.addEventListener('scroll', fn) / window.addEventListener('scroll', fn) ──
         if (
           callee.type === 'MemberExpression' &&
           callee.property.type === 'Identifier' &&
@@ -53,7 +52,6 @@ const preferScrollState = {
           return;
         }
 
-        // ── fromEvent(el, 'scroll') ──────────────────────────────────────────
         if (
           callee.type === 'Identifier' &&
           callee.name === 'fromEvent' &&
@@ -64,7 +62,6 @@ const preferScrollState = {
           return;
         }
 
-        // ── renderer.listen(el, 'scroll', fn) ───────────────────────────────
         if (
           callee.type === 'MemberExpression' &&
           callee.property.type === 'Identifier' &&
@@ -77,7 +74,6 @@ const preferScrollState = {
       },
 
       AssignmentExpression(node) {
-        // ── el.onscroll = fn ────────────────────────────────────────────────
         const { left } = node;
         if (
           left.type === 'MemberExpression' &&

package/src/rules/prefer-static-boolean-properties.js

@@ -57,6 +57,7 @@ const preferStaticBooleanProperties = {
     docs: {
       description:
         'Prefer a static attribute over a property binding for static boolean values when the input uses a booleanAttribute transform.',
+      recommended: true,
     },
     hasSuggestions: true,
     schema: [],

package/src/rules/prefer-viewport-size.js

@@ -20,8 +20,37 @@
  *   const h = viewport().height;
  */
 
-/** Properties on window that report viewport dimensions. */
+const { isGlobalReference } = require('./internals/import-resolution');
+
 const VIEWPORT_PROPERTIES = new Set(['innerWidth', 'innerHeight']);
+const GLOBAL_OBJECTS = new Set(['window', 'globalThis', 'self']);
+
+/**
+ * @param {any} node
+ * @returns {string | null}
+ */
+const getPropertyName = (node) => {
+  if (!node.computed && node.property.type === 'Identifier') return node.property.name;
+  if (node.computed && node.property.type === 'Literal' && typeof node.property.value === 'string') {
+    return node.property.value;
+  }
+
+  return null;
+};
+
+/**
+ * @param {any} node
+ */
+const getThisClassBody = (node) => {
+  let current = node.parent;
+
+  while (current) {
+    if (current.type === 'ClassBody') return current;
+    current = current.parent;
+  }
+
+  return null;
+};
 
 /** @type {import('eslint').Rule.RuleModule} */
 const preferViewportSize = {
@@ -38,30 +67,138 @@ const preferViewportSize = {
     schema: [],
   },
   create(context) {
-    return {
-      MemberExpression(node) {
-        if (node.property.type !== 'Identifier') return;
-        if (!VIEWPORT_PROPERTIES.has(node.property.name)) return;
+    const { sourceCode } = context;
+    /** @type {WeakMap<any, Set<string>>} */
+    const classWindowMembers = new WeakMap();
+
+    /**
+     * @param {any} classBody
+     * @returns {Set<string>}
+     */
+    const getClassWindowMembers = (classBody) => {
+      const cached = classWindowMembers.get(classBody);
+      if (cached) return cached;
+
+      /** @type {Set<string>} */
+      const members = new Set();
+      classWindowMembers.set(classBody, members);
+
+      /** @param {any} node */
+      const visit = (node) => {
+        if (!node || typeof node.type !== 'string') return;
+        if (node !== classBody && node.type === 'ClassBody') return;
 
-        // Only flag when the object is clearly a window-like reference.
-        const obj = node.object;
-        const objText = context.sourceCode.getText(obj).toLowerCase();
+        if (
+          node.type === 'PropertyDefinition' &&
+          !node.computed &&
+          node.key.type === 'Identifier' &&
+          isWindowLike(node.value)
+        ) {
+          members.add(node.key.name);
+        }
 
-        const isWindowRef =
-          objText === 'window' ||
-          objText.endsWith('.defaultview') ||
-          objText.endsWith('?.defaultview') ||
-          // document.defaultView without optional chain
-          /defaultview$/.test(objText);
+        if (
+          node.type === 'AssignmentExpression' &&
+          node.left.type === 'MemberExpression' &&
+          node.left.object.type === 'ThisExpression' &&
+          !node.left.computed &&
+          node.left.property.type === 'Identifier' &&
+          isWindowLike(node.right)
+        ) {
+          members.add(node.left.property.name);
+        }
+
+        for (const key of Object.keys(node)) {
+          if (key === 'parent') continue;
+
+          const value = node[key];
+          if (Array.isArray(value)) value.forEach(visit);
+          else if (value && typeof value.type === 'string') visit(value);
+        }
+      };
+
+      visit(classBody);
+
+      return members;
+    };
 
-        if (!isWindowRef) return;
+    /**
+     * @param {any} node
+     * @param {Set<any>} seen
+     * @returns {boolean}
+     */
+    const isWindowLike = (node, seen = new Set()) => {
+      if (!node || seen.has(node)) return false;
+      seen.add(node);
+
+      if (node.type === 'ChainExpression' || node.type === 'TSNonNullExpression' || node.type === 'TSAsExpression') {
+        return isWindowLike(node.expression, seen);
+      }
+
+      if (node.type === 'Identifier') {
+        if (isGlobalReference(sourceCode, node)) return GLOBAL_OBJECTS.has(node.name);
+
+        /** @type {import('eslint').Scope.Scope | null} */
+        let scope = sourceCode.getScope(node);
+
+        while (scope) {
+          const variable = scope.set.get(node.name);
+
+          if (variable) {
+            const definition = /** @type {any} */ (variable.defs[0]);
+
+            return definition?.type === 'Variable' && isWindowLike(definition.node.init, seen);
+          }
+
+          scope = scope.upper;
+        }
+
+        return false;
+      }
+
+      if (node.type !== 'MemberExpression') return false;
+
+      const name = getPropertyName(node);
+      if (name === 'defaultView') return true;
+      if (name && GLOBAL_OBJECTS.has(name) && isWindowLike(node.object, seen)) return true;
+      if (node.object.type !== 'ThisExpression' || !name) return false;
+
+      const classBody = getThisClassBody(node);
+
+      return !!classBody && getClassWindowMembers(classBody).has(name);
+    };
+
+    return {
+      MemberExpression(node) {
+        const prop = getPropertyName(node);
+        if (!prop || !VIEWPORT_PROPERTIES.has(prop)) return;
+        if (!isWindowLike(node.object)) return;
 
         context.report({
           node,
           messageId: 'preferViewportSize',
-          data: { prop: node.property.name },
+          data: { prop },
         });
       },
+      'Program:exit'(program) {
+        const globalScope = sourceCode.getScope(program);
+        const declaredGlobalReferences = [...VIEWPORT_PROPERTIES].flatMap((name) => {
+          const variable = globalScope.set.get(name);
+
+          return variable && variable.defs.length === 0 ? variable.references : [];
+        });
+
+        for (const reference of [...globalScope.through, ...declaredGlobalReferences]) {
+          const { identifier } = reference;
+          if (!VIEWPORT_PROPERTIES.has(identifier.name)) continue;
+
+          context.report({
+            node: identifier,
+            messageId: 'preferViewportSize',
+            data: { prop: identifier.name },
+          });
+        }
+      },
     };
   },
 };

package/src/rules/require-dollar-suffix.js

@@ -12,7 +12,8 @@ const { getImportedName } = require('./internals/import-resolution');
  *   - `new Subject / BehaviorSubject / ReplaySubject / AsyncSubject / Observable()`
  *   - a call to a known RxJS creator: from, of, interval, timer, fromEvent,
  *     fromEventPattern, combineLatest, merge, concat, forkJoin, race, zip,
- *     defer, iif, throwError, using, partition
+ *     defer, iif, throwError, using
+ *   - `toObservable(...)` or `.asObservable()`
  *
  * ❌ const myData = someObs.pipe(map(...));
  * ❌ const clicks = fromEvent(el, 'click');
@@ -40,7 +41,6 @@ const RXJS_CREATORS = new Set([
   'iif',
   'throwError',
   'using',
-  'partition',
 ]);
 
 const RXJS_SUBJECT_CTORS = new Set(['Subject', 'BehaviorSubject', 'ReplaySubject', 'AsyncSubject', 'Observable']);
@@ -58,7 +58,7 @@ const isObservableInit = (sourceCode, node) => {
     node.type === 'CallExpression' &&
     node.callee.type === 'MemberExpression' &&
     node.callee.property.type === 'Identifier' &&
-    node.callee.property.name === 'pipe'
+    (node.callee.property.name === 'pipe' || node.callee.property.name === 'asObservable')
   ) {
     return true;
   }
@@ -68,6 +68,13 @@ const isObservableInit = (sourceCode, node) => {
     return true;
   }
 
+  if (
+    node.type === 'CallExpression' &&
+    getImportedName(sourceCode, node.callee, '@angular/core/rxjs-interop') === 'toObservable'
+  ) {
+    return true;
+  }
+
   // new Subject(), new BehaviorSubject(...), etc.
   if (node.type === 'NewExpression' && RXJS_SUBJECT_CTORS.has(getImportedName(sourceCode, node.callee, 'rxjs') ?? '')) {
     return true;
@@ -82,6 +89,7 @@ const rule = {
     type: 'suggestion',
     docs: {
       description: 'Require observable variables and class properties to use the $ suffix.',
+      recommended: true,
     },
     schema: [],
     messages: {

package/src/rules/require-form-submit.js

@@ -28,7 +28,9 @@ const handlesSubmit = (node) =>
 
 /** @param {any} node */
 const submitsNatively = (node) =>
-  hasBinding(node, 'action') || hasBinding(node, 'ngNoForm') || attribute(node, 'method')?.value === 'dialog';
+  hasBinding(node, 'action') ||
+  hasBinding(node, 'ngNoForm') ||
+  attribute(node, 'method')?.value?.trim().toLowerCase() === 'dialog';
 
 /** @type {import('eslint').Rule.RuleModule} */
 const requireFormSubmit = {
@@ -36,6 +38,7 @@ const requireFormSubmit = {
     type: 'problem',
     docs: {
       description: 'Require a `<form>` to handle its own submission.',
+      recommended: true,
     },
     schema: [],
     messages: {