eslint-plugin-what 0.5.6 → 0.7.0

package/README.md

@@ -161,7 +161,7 @@ count.set(5);
 ## Links
 
 - [Documentation](https://whatfw.com)
-- [GitHub](https://github.com/CelsianJs/whatfw)
+- [GitHub](https://github.com/CelsianJs/what-framework)
 
 ## License
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eslint-plugin-what",
-  "version": "0.5.6",
+  "version": "0.7.0",
   "description": "ESLint rules for What Framework — catch signal bugs, enforce patterns",
   "type": "module",
   "main": "src/index.js",
@@ -25,10 +25,10 @@
   "license": "MIT",
   "repository": {
     "type": "git",
-    "url": "https://github.com/CelsianJs/whatfw"
+    "url": "https://github.com/CelsianJs/what-framework"
   },
   "bugs": {
-    "url": "https://github.com/CelsianJs/whatfw/issues"
+    "url": "https://github.com/CelsianJs/what-framework/issues"
   },
   "homepage": "https://whatfw.com"
 }

package/src/index.js

@@ -15,11 +15,14 @@ import noSignalWriteInRender from './rules/no-signal-write-in-render.js';
 import noCamelcaseEvents from './rules/no-camelcase-events.js';
 import preferSet from './rules/prefer-set.js';
 import noUncalledSignals from './rules/no-uncalled-signals.js';
+import noHInUserCode from './rules/no-h-in-user-code.js';
+import signalCallInJsx from './rules/signal-call-in-jsx.js';
+import noSetInComputed from './rules/no-set-in-computed.js';
 
 const plugin = {
   meta: {
     name: 'eslint-plugin-what',
-    version: '0.5.6',
+    version: '0.6.0',
   },
 
   rules: {
@@ -29,6 +32,9 @@ const plugin = {
     'no-camelcase-events': noCamelcaseEvents,
     'prefer-set': preferSet,
     'no-uncalled-signals': noUncalledSignals,
+    'no-h-in-user-code': noHInUserCode,
+    'signal-call-in-jsx': signalCallInJsx,
+    'no-set-in-computed': noSetInComputed,
   },
 
   configs: {},
@@ -45,6 +51,9 @@ plugin.configs.recommended = {
     'what/no-camelcase-events': 'warn',
     'what/no-uncalled-signals': 'warn',
     'what/prefer-set': 'off',
+    'what/no-h-in-user-code': 'warn',
+    'what/signal-call-in-jsx': 'warn',
+    'what/no-set-in-computed': 'error',
   },
 };
 
@@ -58,6 +67,9 @@ plugin.configs.strict = {
     'what/no-camelcase-events': 'error',
     'what/no-uncalled-signals': 'error',
     'what/prefer-set': 'warn',
+    'what/no-h-in-user-code': 'error',
+    'what/signal-call-in-jsx': 'error',
+    'what/no-set-in-computed': 'error',
   },
 };
 
@@ -71,6 +83,9 @@ plugin.configs.compiler = {
     'what/no-camelcase-events': 'off',          // compiler normalizes events
     'what/no-uncalled-signals': 'warn',
     'what/prefer-set': 'off',
+    'what/no-h-in-user-code': 'warn',
+    'what/signal-call-in-jsx': 'off',          // compiler handles signal wrapping in JSX
+    'what/no-set-in-computed': 'error',
   },
 };
 

package/src/rules/no-h-in-user-code.js

@@ -0,0 +1,76 @@
+/**
+ * Rule: what/no-h-in-user-code
+ *
+ * Warn when user code imports `h` from what-framework.
+ * Users should use JSX syntax instead of calling h() directly.
+ * The compiler handles JSX-to-h() transformation automatically.
+ *
+ * Bad:  import { h } from 'what-framework';
+ *       h('div', { class: 'foo' }, 'Hello');
+ *
+ * Good: <div class="foo">Hello</div>
+ */
+
+export default {
+  meta: {
+    type: 'suggestion',
+    docs: {
+      description: 'Disallow importing h() from what-framework — use JSX instead',
+      recommended: true,
+    },
+    messages: {
+      noHImport:
+        'Avoid importing "h" directly. Use JSX syntax instead — ' +
+        'the What compiler transforms JSX to optimized template() + insert() calls automatically.',
+      noHCall:
+        'Avoid calling h() directly in user code. Use JSX syntax instead — ' +
+        'the What compiler transforms JSX to optimized template() + insert() calls automatically.',
+    },
+    schema: [],
+  },
+
+  create(context) {
+    let hImported = false;
+
+    return {
+      ImportDeclaration(node) {
+        // Check for imports from what-framework or what-core
+        const source = node.source.value;
+        if (
+          source === 'what-framework' ||
+          source === 'what-core' ||
+          source === 'what-framework/h' ||
+          source === 'what-core/h'
+        ) {
+          for (const spec of node.specifiers) {
+            if (
+              spec.type === 'ImportSpecifier' &&
+              spec.imported.type === 'Identifier' &&
+              spec.imported.name === 'h'
+            ) {
+              hImported = true;
+              context.report({
+                node: spec,
+                messageId: 'noHImport',
+              });
+            }
+          }
+        }
+      },
+
+      CallExpression(node) {
+        // Only warn on h() calls if h was imported from the framework
+        if (
+          hImported &&
+          node.callee.type === 'Identifier' &&
+          node.callee.name === 'h'
+        ) {
+          context.report({
+            node,
+            messageId: 'noHCall',
+          });
+        }
+      },
+    };
+  },
+};

package/src/rules/no-set-in-computed.js

@@ -0,0 +1,154 @@
+/**
+ * Rule: what/no-set-in-computed
+ *
+ * Error when .set() is called inside a computed() callback.
+ * Writing to signals inside computed() can cause infinite loops because
+ * the write triggers re-evaluation of the computed which writes again.
+ *
+ * Bad:
+ *   const doubled = computed(() => {
+ *     otherSignal.set(count() * 2);  // writes inside computed
+ *     return count() * 2;
+ *   });
+ *
+ * Good:
+ *   const doubled = computed(() => count() * 2);
+ *   effect(() => otherSignal.set(doubled()));
+ */
+
+import { createSignalTracker } from '../utils/signal-tracking.js';
+
+export default {
+  meta: {
+    type: 'problem',
+    docs: {
+      description: 'Disallow signal writes (.set()) inside computed() callbacks',
+      recommended: true,
+    },
+    messages: {
+      setInComputed:
+        'Signal.set() called inside a computed() callback. ' +
+        'This may cause infinite loops. Move signal writes to effect() instead.',
+      signalWriteInComputed:
+        'Signal write to "{{name}}" inside a computed() callback. ' +
+        'This may cause infinite loops. Move signal writes to effect() instead.',
+    },
+    schema: [],
+  },
+
+  create(context) {
+    const tracker = createSignalTracker();
+    // Stack of computed scopes — tracks whether we're inside a computed callback
+    let computedDepth = 0;
+
+    function isInsideComputed() {
+      return computedDepth > 0;
+    }
+
+    return {
+      VariableDeclarator(node) {
+        tracker.visitors.VariableDeclarator(node);
+      },
+
+      CallExpression(node) {
+        // Track entering computed() or useComputed() callbacks
+        if (
+          node.callee.type === 'Identifier' &&
+          (node.callee.name === 'computed' || node.callee.name === 'useComputed') &&
+          node.arguments.length > 0 &&
+          (node.arguments[0].type === 'ArrowFunctionExpression' ||
+           node.arguments[0].type === 'FunctionExpression')
+        ) {
+          // We'll check the body in the function visitor below
+        }
+
+        // Check for .set() calls inside computed
+        if (isInsideComputed()) {
+          // signal.set(value)
+          if (
+            node.callee.type === 'MemberExpression' &&
+            node.callee.property.type === 'Identifier' &&
+            node.callee.property.name === 'set'
+          ) {
+            const objName = node.callee.object.type === 'Identifier'
+              ? node.callee.object.name
+              : null;
+
+            if (objName && tracker.isSignal(objName)) {
+              context.report({
+                node,
+                messageId: 'signalWriteInComputed',
+                data: { name: objName },
+              });
+            } else {
+              // Could still be a signal — report generic warning
+              context.report({
+                node,
+                messageId: 'setInComputed',
+              });
+            }
+          }
+
+          // signal(newValue) — direct call with argument (write via unified getter/setter)
+          if (
+            node.callee.type === 'Identifier' &&
+            tracker.isSignal(node.callee.name) &&
+            node.arguments.length > 0
+          ) {
+            context.report({
+              node,
+              messageId: 'signalWriteInComputed',
+              data: { name: node.callee.name },
+            });
+          }
+        }
+      },
+
+      // Track computed callback scope entry/exit
+      'CallExpression > ArrowFunctionExpression'(node) {
+        const parent = node.parent;
+        if (
+          parent.type === 'CallExpression' &&
+          parent.callee.type === 'Identifier' &&
+          (parent.callee.name === 'computed' || parent.callee.name === 'useComputed') &&
+          parent.arguments[0] === node
+        ) {
+          computedDepth++;
+        }
+      },
+      'CallExpression > ArrowFunctionExpression:exit'(node) {
+        const parent = node.parent;
+        if (
+          parent.type === 'CallExpression' &&
+          parent.callee.type === 'Identifier' &&
+          (parent.callee.name === 'computed' || parent.callee.name === 'useComputed') &&
+          parent.arguments[0] === node
+        ) {
+          computedDepth--;
+        }
+      },
+      'CallExpression > FunctionExpression'(node) {
+        const parent = node.parent;
+        if (
+          parent.type === 'CallExpression' &&
+          parent.callee.type === 'Identifier' &&
+          (parent.callee.name === 'computed' || parent.callee.name === 'useComputed') &&
+          parent.arguments[0] === node
+        ) {
+          computedDepth++;
+        }
+      },
+      'CallExpression > FunctionExpression:exit'(node) {
+        const parent = node.parent;
+        if (
+          parent.type === 'CallExpression' &&
+          parent.callee.type === 'Identifier' &&
+          (parent.callee.name === 'computed' || parent.callee.name === 'useComputed') &&
+          parent.arguments[0] === node
+        ) {
+          computedDepth--;
+        }
+      },
+    };
+  },
+};

package/src/rules/signal-call-in-jsx.js

@@ -0,0 +1,128 @@
+/**
+ * Rule: what/signal-call-in-jsx
+ *
+ * Warn when a signal is used in JSX without calling it.
+ * Signals are functions — using them without () in JSX renders "[Function]"
+ * instead of the signal's value.
+ *
+ * This rule specifically targets JSX expression containers, complementing
+ * the broader no-uncalled-signals rule with JSX-specific messaging.
+ *
+ * Bad:  <span>{count}</span>          — renders "[Function]"
+ * Bad:  <p>{isLoading && <Spinner />}</p> — always truthy
+ *
+ * Good: <span>{count()}</span>
+ * Good: <p>{isLoading() && <Spinner />}</p>
+ */
+
+import { createSignalTracker, SIGNAL_METHODS } from '../utils/signal-tracking.js';
+
+export default {
+  meta: {
+    type: 'problem',
+    docs: {
+      description: 'Require calling signals in JSX expressions — catch missing ()',
+      recommended: true,
+    },
+    messages: {
+      signalNotCalledInJsx:
+        '"{{name}}" is a signal used in JSX without calling it. ' +
+        'Use {{{name}}()} to read the value, or the JSX will render "[Function]".',
+      signalNotCalledInJsxLogical:
+        '"{{name}}" is a signal used in a JSX conditional without calling it. ' +
+        'Signals are always truthy — use {{{name}}() && ...} instead.',
+    },
+    schema: [],
+  },
+
+  create(context) {
+    const tracker = createSignalTracker();
+
+    function isInsideJSXExpression(node) {
+      let current = node.parent;
+      while (current) {
+        if (current.type === 'JSXExpressionContainer') return true;
+        // Stop at function boundaries
+        if (
+          current.type === 'ArrowFunctionExpression' ||
+          current.type === 'FunctionExpression' ||
+          current.type === 'FunctionDeclaration'
+        ) {
+          return false;
+        }
+        current = current.parent;
+      }
+      return false;
+    }
+
+    function isBeingCalled(node) {
+      return node.parent?.type === 'CallExpression' && node.parent.callee === node;
+    }
+
+    function isMethodAccess(node) {
+      return (
+        node.parent?.type === 'MemberExpression' &&
+        node.parent.object === node &&
+        node.parent.property?.type === 'Identifier' &&
+        SIGNAL_METHODS.has(node.parent.property.name)
+      );
+    }
+
+    function isJSXAttributeValue(node) {
+      const exprContainer = node.parent;
+      if (exprContainer?.type === 'JSXExpressionContainer') {
+        return exprContainer.parent?.type === 'JSXAttribute';
+      }
+      return false;
+    }
+
+    return {
+      VariableDeclarator(node) {
+        tracker.visitors.VariableDeclarator(node);
+      },
+
+      Identifier(node) {
+        const parent = node.parent;
+        if (!parent) return;
+
+        // Skip declaration positions
+        if (parent.type === 'VariableDeclarator' && parent.id === node) return;
+        if (parent.type === 'FunctionDeclaration' && parent.id === node) return;
+        if (parent.type === 'Property' && parent.key === node && !parent.computed) return;
+        if (parent.type === 'ImportSpecifier') return;
+        if (parent.type === 'ImportDefaultSpecifier') return;
+        if (parent.type === 'MemberExpression' && parent.property === node && !parent.computed) return;
+
+        // Skip if being called — correct usage
+        if (isBeingCalled(node)) return;
+        // Skip method access
+        if (isMethodAccess(node)) return;
+        // Skip JSX attribute values (event handlers)
+        if (isJSXAttributeValue(node)) return;
+
+        // Only check signals inside JSX expressions
+        if (!tracker.isSignalLike(node.name)) return;
+        if (!isInsideJSXExpression(node)) return;
+
+        // Check if inside a logical expression (&&, ||) — likely a conditional render
+        if (
+          parent.type === 'LogicalExpression' &&
+          parent.left === node
+        ) {
+          context.report({
+            node,
+            messageId: 'signalNotCalledInJsxLogical',
+            data: { name: node.name },
+          });
+          return;
+        }
+
+        context.report({
+          node,
+          messageId: 'signalNotCalledInJsx',
+          data: { name: node.name },
+        });
+      },
+    };
+  },
+};