fix: refactor is-from-react utility and improve no-forward-ref rule autofix handling, closes #1172 (#1173)

Rel1cx · Copilot · web-flow · commit a3544b5a724e · 2025-08-15T11:17:51.000+08:00
Signed-off-by: REL1CX &lt;dokimondex@gmail.com&gt;
Co-authored-by: Copilot &lt;175728472+Copilot@users.noreply.github.com&gt;
diff --git a/.pkgs/configs/package.json b/.pkgs/configs/package.json
@@ -23,7 +23,7 @@
     "@stylistic/eslint-plugin": "^5.2.3",
     "eslint-plugin-de-morgan": "^1.3.1",
     "eslint-plugin-function": "^0.0.22",
-    "eslint-plugin-jsdoc": "^53.0.1",
+    "eslint-plugin-jsdoc": "^54.1.0",
     "eslint-plugin-perfectionist": "^4.15.0",
     "eslint-plugin-regexp": "^2.10.0",
     "eslint-plugin-unicorn": "^60.0.0",
diff --git a/.pkgs/eslint-plugin-local/package.json b/.pkgs/eslint-plugin-local/package.json
@@ -33,7 +33,7 @@
     "@typescript-eslint/types": "^8.39.1",
     "@typescript-eslint/utils": "^8.39.1",
     "eslint-plugin-de-morgan": "^1.3.1",
-    "eslint-plugin-jsdoc": "^53.0.1",
+    "eslint-plugin-jsdoc": "^54.1.0",
     "eslint-plugin-perfectionist": "^4.15.0",
     "eslint-plugin-regexp": "^2.10.0",
     "eslint-plugin-unicorn": "^60.0.0",
diff --git a/apps/website/package.json b/apps/website/package.json
@@ -37,7 +37,7 @@
     "@eslint/markdown": "^7.1.0",
     "@local/configs": "workspace:*",
     "@mdx-js/mdx": "^3.1.0",
-    "@tailwindcss/postcss": "^4.1.11",
+    "@tailwindcss/postcss": "^4.1.12",
     "@theguild/remark-mermaid": "^0.3.0",
     "@tsconfig/next": "^2.0.3",
     "@tsconfig/node22": "^22.0.2",
@@ -58,7 +58,7 @@
     "eslint-plugin-unicorn": "^60.0.0",
     "importx": "^0.5.2",
     "postcss": "^8.5.6",
-    "tailwindcss": "^4.1.11",
+    "tailwindcss": "^4.1.12",
     "tailwindcss-animated": "^2.0.0",
     "typescript": "^5.9.2",
     "typescript-eslint": "^8.39.1"
diff --git a/examples/next-app/package.json b/examples/next-app/package.json
@@ -15,7 +15,7 @@
   },
   "devDependencies": {
     "@eslint-react/eslint-plugin": "workspace:*",
-    "@eslint/config-inspector": "^1.1.0",
+    "@eslint/config-inspector": "^1.2.0",
     "@eslint/js": "^9.33.0",
     "@next/eslint-plugin-next": "^15.4.6",
     "@tsconfig/next": "^2.0.3",
diff --git a/examples/vite-react-dom-app/package.json b/examples/vite-react-dom-app/package.json
@@ -16,7 +16,7 @@
   },
   "devDependencies": {
     "@eslint-react/eslint-plugin": "workspace:*",
-    "@eslint/config-inspector": "^1.1.0",
+    "@eslint/config-inspector": "^1.2.0",
     "@eslint/js": "^9.33.0",
     "@tsconfig/node22": "^22.0.2",
     "@tsconfig/strictest": "^2.0.5",
diff --git a/examples/vite-react-dom-js-app/package.json b/examples/vite-react-dom-js-app/package.json
@@ -16,7 +16,7 @@
   },
   "devDependencies": {
     "@eslint-react/eslint-plugin": "workspace:*",
-    "@eslint/config-inspector": "^1.1.0",
+    "@eslint/config-inspector": "^1.2.0",
     "@eslint/js": "^9.33.0",
     "@types/react": "^19.1.10",
     "@types/react-dom": "^19.1.7",
diff --git a/examples/vite-react-dom-js-with-babel-eslint-parser-app/package.json b/examples/vite-react-dom-js-with-babel-eslint-parser-app/package.json
@@ -15,11 +15,11 @@
     "react-dom": "^19.1.1"
   },
   "devDependencies": {
-    "@babel/core": "^7.28.0",
+    "@babel/core": "^7.28.3",
     "@babel/eslint-parser": "^7.28.0",
-    "@babel/preset-env": "^7.28.0",
+    "@babel/preset-env": "^7.28.3",
     "@babel/preset-react": "^7.27.1",
-    "@eslint/config-inspector": "^1.1.0",
+    "@eslint/config-inspector": "^1.2.0",
     "@eslint/js": "^9.33.0",
     "@types/babel__core": "~7.20.5",
     "@types/babel__preset-env": "~7.10.0",
diff --git a/examples/vite-react-dom-with-ts-blank-eslint-parser-app/package.json b/examples/vite-react-dom-with-ts-blank-eslint-parser-app/package.json
@@ -18,7 +18,7 @@
     "@eslint-react/eslint-plugin": "workspace:*",
     "@eslint-react/kit": "workspace:*",
     "@eslint-react/shared": "workspace:*",
-    "@eslint/config-inspector": "^1.1.0",
+    "@eslint/config-inspector": "^1.2.0",
     "@eslint/js": "^9.33.0",
     "@tsconfig/node22": "^22.0.2",
     "@tsconfig/strictest": "^2.0.5",
diff --git a/package.json b/package.json
@@ -52,7 +52,7 @@
     "update:website": "tsx ./scripts/update-website.ts"
   },
   "devDependencies": {
-    "@eslint/config-inspector": "^1.1.0",
+    "@eslint/config-inspector": "^1.2.0",
     "@eslint/markdown": "^7.1.0",
     "@local/configs": "workspace:*",
     "@local/eslint-plugin-local": "workspace:*",
diff --git a/packages/core/src/utils/index.ts b/packages/core/src/utils/index.ts
@@ -1,4 +1,4 @@
 export * from "./get-instance-id";
-export * from "./is-initialized-from-react";
+export * from "./is-from-react";
 export * from "./is-instance-id-equal";
 export * from "./is-react-api";
diff --git a/packages/core/src/utils/is-from-react.ts b/packages/core/src/utils/is-from-react.ts
@@ -21,11 +21,12 @@ function getRequireExpressionArguments(node: TSESTree.Node) {
 }
 
 /**
- * Check if an identifier is initialized from react
+ * Check if an identifier name is initialized from react
  * @param name The top-level identifier's name
  * @param importSource The import source to check against
  * @param initialScope Initial scope to search for the identifier
- * @returns Whether the identifier is initialized from react
+ * @returns Whether the identifier name is initialized from react
+ * @internal
  */
 export function isInitializedFromReact(
   name: string,
diff --git a/packages/plugins/eslint-plugin-react-debug/src/rules/is-from-react.ts b/packages/plugins/eslint-plugin-react-debug/src/rules/is-from-react.ts
@@ -37,30 +37,14 @@ export default createRule<[], MessageID>({
 export function create(context: RuleContext<MessageID, []>): RuleListener {
   const { importSource = "react" } = getSettingsFromContext(context);
 
-  function isFromReact(node: TSESTree.Identifier | TSESTree.JSXIdentifier, initialScope: Scope) {
-    const name = node.name;
-    switch (true) {
-      case node.parent.type === T.MemberExpression
-        && node.parent.property === node
-        && node.parent.object.type === T.Identifier:
-        return ER.isInitializedFromReact(node.parent.object.name, importSource, initialScope);
-      case node.parent.type === T.JSXMemberExpression
-        && node.parent.property === node
-        && node.parent.object.type === T.JSXIdentifier:
-        return ER.isInitializedFromReact(node.parent.object.name, importSource, initialScope);
-      default:
-        return ER.isInitializedFromReact(name, importSource, initialScope);
-    }
-  }
-
   function visitorFunction(node: TSESTree.Identifier | TSESTree.JSXIdentifier) {
     const shouldSkipDuplicate = node.parent.type === T.ImportSpecifier
       && node.parent.imported === node
       && node.parent.imported.name === node.parent.local.name;
     if (shouldSkipDuplicate) return;
     const name = node.name;
     const initialScope = context.sourceCode.getScope(node);
-    if (!isFromReact(node, initialScope)) return;
+    if (!isFromReact(node, importSource, initialScope)) return;
     context.report({
       messageId: "isFromReact",
       node,
@@ -77,3 +61,30 @@ export function create(context: RuleContext<MessageID, []>): RuleListener {
     JSXIdentifier: visitorFunction,
   };
 }
+
+/**
+ * Check if an identifier node is initialized from React
+ * @param node The identifier node to check
+ * @param importSource The import source to check against
+ * @param initialScope Initial scope to search for the identifier
+ * @returns Whether the identifier node is initialized from React
+ */
+function isFromReact(
+  node: TSESTree.Identifier | TSESTree.JSXIdentifier,
+  importSource: string,
+  initialScope: Scope,
+) {
+  const name = node.name;
+  switch (true) {
+    case node.parent.type === T.MemberExpression
+      && node.parent.property === node
+      && node.parent.object.type === T.Identifier:
+      return ER.isInitializedFromReact(node.parent.object.name, importSource, initialScope);
+    case node.parent.type === T.JSXMemberExpression
+      && node.parent.property === node
+      && node.parent.object.type === T.JSXIdentifier:
+      return ER.isInitializedFromReact(node.parent.object.name, importSource, initialScope);
+    default:
+      return ER.isInitializedFromReact(name, importSource, initialScope);
+  }
+}
diff --git a/packages/plugins/eslint-plugin-react-x/src/rules/no-forward-ref.spec.ts b/packages/plugins/eslint-plugin-react-x/src/rules/no-forward-ref.spec.ts
@@ -5,6 +5,20 @@ import rule, { RULE_NAME } from "./no-forward-ref";
 
 ruleTester.run(RULE_NAME, rule, {
   invalid: [
+    {
+      // Not safe to fix because the import source is "not-react"
+      code: tsx`
+        import { forwardRef } from "not-react"
+
+        forwardRef(() => null)
+      `,
+      errors: [{ messageId: "noForwardRef" }],
+      settings: {
+        "react-x": {
+          version: "19.0.0",
+        },
+      },
+    },
     {
       code: tsx`
         import { forwardRef } from 'react'
diff --git a/packages/plugins/eslint-plugin-react-x/src/rules/no-forward-ref.ts b/packages/plugins/eslint-plugin-react-x/src/rules/no-forward-ref.ts
@@ -51,15 +51,38 @@ export function create(context: RuleContext<MessageID, []>): RuleListener {
         return;
       }
       const id = AST.getFunctionId(node);
+      const fix = canFix(context, node) ? getFix(context, node) : null;
       context.report({
         messageId: "noForwardRef",
         node: id ?? node,
-        fix: getFix(context, node),
+        fix,
       });
     },
   };
 }
 
+/**
+ * Determines whether the given CallExpression can be safely auto-fixed by replacing
+ * the usage of `forwardRef` with passing `ref` as a prop.
+ *
+ * @param context - The rule context object.
+ * @param node - The CallExpression node to check.
+ * @returns True if the call can be auto-fixed, false otherwise.
+ */
+function canFix(context: RuleContext, node: TSESTree.CallExpression) {
+  const { importSource } = getSettingsFromContext(context);
+  const initialScope = context.sourceCode.getScope(node);
+  switch (node.callee.type) {
+    case T.Identifier:
+      return ER.isInitializedFromReact(node.callee.name, importSource, initialScope);
+    case T.MemberExpression:
+      return node.callee.object.type === T.Identifier
+        && ER.isInitializedFromReact(node.callee.object.name, importSource, initialScope);
+    default:
+      return false;
+  }
+}
+
 function getFix(context: RuleContext, node: TSESTree.CallExpression): (fixer: RuleFixer) => RuleFix[] {
   return (fixer) => {
     const [componentNode] = node.arguments;
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
