eslint-plugin-power-esrules 0.1.14 → 0.1.16

package/lib/rules/props-destructuring-sort.js

@@ -108,10 +108,16 @@ function getReactComponentName(funcNode) {
     return funcNode.id.name;
   }
   const { parent } = funcNode;
-  if (parent?.type === "VariableDeclarator" && parent.id?.type === "Identifier") {
+  if (
+    parent?.type === "VariableDeclarator" &&
+    parent.id?.type === "Identifier"
+  ) {
     return parent.id.name;
   }
-  if (parent?.type === "AssignmentExpression" && parent.left?.type === "Identifier") {
+  if (
+    parent?.type === "AssignmentExpression" &&
+    parent.left?.type === "Identifier"
+  ) {
     return parent.left.name;
   }
   return null;
@@ -195,7 +201,10 @@ function getEnclosingFunction(node) {
 function isInsideReactClass(node) {
   let current = node.parent;
   while (current) {
-    if (current.type === "ClassDeclaration" || current.type === "ClassExpression") {
+    if (
+      current.type === "ClassDeclaration" ||
+      current.type === "ClassExpression"
+    ) {
       return isReactComponentClass(current);
     }
     current = current.parent;
@@ -211,8 +220,14 @@ function isInsideReactComponentFunction(node) {
   return isReactComponentFunction(enclosingFunction);
 }
 
+function isRestProperty(prop) {
+  return (
+    prop.type === "RestElement" || prop.type === "ExperimentalRestProperty"
+  );
+}
+
 function getPropertySortKey(prop) {
-  if (prop.type === "RestElement") {
+  if (isRestProperty(prop)) {
     return null;
   }
   if (prop.type === "Property") {
@@ -230,7 +245,7 @@ function partitionProperties(properties) {
   const regular = [];
   const rest = [];
   for (const prop of properties) {
-    if (prop.type === "RestElement") {
+    if (isRestProperty(prop)) {
       rest.push(prop);
     } else {
       regular.push(prop);
@@ -239,6 +254,21 @@ function partitionProperties(properties) {
   return { regular, rest };
 }
 
+function comparePatternProperties(a, b) {
+  const aRest = isRestProperty(a);
+  const bRest = isRestProperty(b);
+  if (aRest && bRest) {
+    return 0;
+  }
+  if (aRest) {
+    return 1;
+  }
+  if (bRest) {
+    return -1;
+  }
+  return getPropertySortKey(a).localeCompare(getPropertySortKey(b));
+}
+
 function isAlphabeticallySorted(regular) {
   for (let i = 1; i < regular.length; i += 1) {
     const prevKey = getPropertySortKey(regular[i - 1]);
@@ -252,9 +282,7 @@ function isAlphabeticallySorted(regular) {
 
 function sortObjectPatternProperties(properties) {
   const { regular, rest } = partitionProperties(properties);
-  const sortedRegular = [...regular].sort((a, b) =>
-    getPropertySortKey(a).localeCompare(getPropertySortKey(b)),
-  );
+  const sortedRegular = [...regular].sort(comparePatternProperties);
   return [...sortedRegular, ...rest];
 }
 
@@ -271,7 +299,11 @@ function getPropertiesSeparator(sourceCode, properties) {
   return sourceCode.text.slice(comma.range[0], properties[1].range[0]);
 }
 
-function buildSortedObjectPatternText(patternNode, sortedProperties, sourceCode) {
+function buildSortedObjectPatternText(
+  patternNode,
+  sortedProperties,
+  sourceCode,
+) {
   const openBrace = sourceCode.getFirstToken(patternNode);
   const closeBrace = sourceCode.getLastToken(patternNode);
   const originalProperties = patternNode.properties;
@@ -359,7 +391,10 @@ module.exports = {
   create(context) {
     return {
       VariableDeclarator(node) {
-        if (node.id.type !== "ObjectPattern" || !isPropsInitializer(node.init)) {
+        if (
+          node.id.type !== "ObjectPattern" ||
+          !isPropsInitializer(node.init)
+        ) {
           return;
         }
         const isThisProps =

package/lib/rules/require-data-testid.js

@@ -34,6 +34,17 @@ function isPascalCase(name) {
 function getComponentName(node) {
   if (!node) return null;
 
+  if (node.type === "ClassDeclaration") {
+    return node.id?.name ?? null;
+  }
+
+  if (
+    node.type === "ClassExpression" &&
+    node.parent?.type === "VariableDeclarator"
+  ) {
+    return node.parent.id?.name ?? null;
+  }
+
   // Функция объявлена напрямую
   if (node.type === "FunctionDeclaration") {
     return node.id?.name ?? null;
@@ -48,6 +59,20 @@ function getComponentName(node) {
     return node.parent.id?.name ?? null;
   }
 
+  if (
+    node.parent?.type === "CallExpression" &&
+    node.parent.parent?.type === "VariableDeclarator"
+  ) {
+    node.parent.parent.id?.name ?? null;
+  }
+
+  if (
+    node.type === "CallExpression" &&
+    node.parent?.type === "VariableDeclarator"
+  ) {
+    return node.parent.id?.name ?? null;
+  }
+
   // HOC обёртка: memo(() => {}) или forwardRef(() => {}) или observer(() => {})
   if (node.type === "CallExpression" && node.arguments.length > 0) {
     return getComponentName(node.arguments[0]);
@@ -66,6 +91,28 @@ function isReactComponent(node) {
 function getRootJSXFromComponent(fnNode) {
   if (!fnNode) return null;
 
+  if (fnNode.type === "ClassDeclaration" || fnNode.type === "ClassExpression") {
+    const renderMethod = fnNode.body.body.find(
+      (member) =>
+        member.type === "MethodDefinition" && member.key?.name === "render",
+    );
+
+    if (!renderMethod) return null;
+
+    const body = renderMethod.value.body.body;
+
+    for (const stmt of body) {
+      if (
+        stmt.type === "ReturnStatement" &&
+        stmt.argument &&
+        (stmt.argument.type === "JSXElement" ||
+          stmt.argument.type === "JSXFragment")
+      ) {
+        return stmt.argument;
+      }
+    }
+  }
+
   // Разворачиваем HOC
   if (fnNode.type === "CallExpression" && fnNode.arguments.length > 0) {
     return getRootJSXFromComponent(fnNode.arguments[0]);
@@ -177,8 +224,9 @@ module.exports = {
       FunctionDeclaration: collectComponent,
       FunctionExpression: collectComponent,
       ArrowFunctionExpression: collectComponent,
-      // CallExpression больше не нужен, HOC разворачиваются внутри getComponentName
-      //"CallExpression": collectComponent,
+      ClassDeclaration: collectComponent,
+      ClassExpression: collectComponent,
+      CallExpression: collectComponent,
 
       "Program:exit"() {
         for (const component of components) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eslint-plugin-power-esrules",
-  "version": "0.1.14",
+  "version": "0.1.16",
   "description": "custom ESLint rules",
   "main": "index.js",
   "peerDependencies": {

package/tests/import-sorting.test.js

@@ -14,63 +14,63 @@ ruleTester.run("import-sorting", rule, {
     {
       name: "correctly sorted imports with blank lines",
       code: `
-        import React from 'react';
-        import _ from 'lodash';
+import React from 'react';
+import _ from 'lodash';
 
-        import { fetchData } from 'api';
-        import { calculate } from 'utils';
+import { fetchData } from 'api';
+import { calculate } from 'utils';
 
-        import Button from 'components/Button';
-        import Header from 'components/Header';
+import Button from 'components/Button';
+import Header from 'components/Header';
 
-        import helper from './helper';
+import helper from './helper';
       `,
     },
     {
       name: "single external import",
       code: `
-        import React from 'react';
+import React from 'react';
       `,
     },
     {
       name: "external and internal imports only",
       code: `
-        import React from 'react';
+import React from 'react';
 
-        import { fetchData } from 'api';
+import { fetchData } from 'api';
       `,
     },
     {
       name: "component import after internal",
       code: `
-        import React from 'react';
+import React from 'react';
 
-        import { fetchData } from 'api';
+import { fetchData } from 'api';
 
-        import Button from 'components/Button';
+import Button from 'components/Button';
       `,
     },
     {
       name: "relative imports last",
       code: `
-        import React from 'react';
+import React from 'react';
 
-        import { fetchData } from 'api';
+import { fetchData } from 'api';
 
-        import Button from 'components/Button';
+import Button from 'components/Button';
 
-        import util from '../util';
-        import helper from './helper';
+import util from '../util';
+import helper from './helper';
       `,
     },
     {
       name: "React context import is inner import",
       code: `
-        import { fetchData } from 'api';
-        import {PageContext} from 'pages/page';
-        
-        import ComponentA from 'components/ComponentA';
-        
+import { fetchData } from 'api';
+import {PageContext} from 'pages/page';
+
+import ComponentA from 'components/ComponentA';
+
       `,
     },
   ],
@@ -79,78 +79,75 @@ ruleTester.run("import-sorting", rule, {
     {
       name: "external import after internal",
       code: `
-        import { fetchData } from 'api';
-        import React from 'react';
+import { fetchData } from 'api';
+import React from 'react';
       `,
       output: `
-        import React from 'react';
+import React from 'react';
 
-        import { fetchData } from 'api';
+import { fetchData } from 'api';
       `,
       errors: [{ messageId: "incorrectOrder" }],
     },
     {
       name: "component import before internal",
       code: `
-        import Button from 'components/Button';
-        import { fetchData } from 'api';
+import Button from 'components/Button';
+import { fetchData } from 'api';
       `,
       output: `
-        import { fetchData } from 'api';
+import { fetchData } from 'api';
 
-        import Button from 'components/Button';
+import Button from 'components/Button';
       `,
       errors: [{ messageId: "incorrectOrder" }],
     },
     {
       name: "missing blank line between groups",
       code: `
-        import React from 'react';
-        import _ from 'lodash';
-        import { fetchData } from 'api';
+import React from 'react';
+import _ from 'lodash';
+import { fetchData } from 'api';
       `,
       output: `
-        import React from 'react';
-        import _ from 'lodash';
+import React from 'react';
+import _ from 'lodash';
 
-        import { fetchData } from 'api';
+import { fetchData } from 'api';
       `,
       errors: [{ messageId: "missingBlankLine" }],
     },
     {
       name: "relative import not last",
       code: `
-        import helper from './helper';
-        import { fetchData } from 'api';
+import helper from './helper';
+import { fetchData } from 'api';
       `,
       output: `
-        import { fetchData } from 'api';
+import { fetchData } from 'api';
 
-        import helper from './helper';
+import helper from './helper';
       `,
       errors: [{ messageId: "incorrectOrder" }],
     },
     {
       name: "multiple issues at once",
       code: `
-        import Button from 'components/Button';
-        import React from 'react';
-        import { fetchData } from 'api';
-        import helper from './helper';
+import Button from 'components/Button';
+import React from 'react';
+import { fetchData } from 'api';
+import helper from './helper';
       `,
       output: `
-        import React from 'react';
+import React from 'react';
 
-        import { fetchData } from 'api';
+import { fetchData } from 'api';
 
-        import Button from 'components/Button';
+import Button from 'components/Button';
 
-        import helper from './helper';
+import helper from './helper';
       `,
-      errors: [
-        { messageId: "incorrectOrder" },
-        { messageId: "missingBlankLine" },
-      ],
+      errors: [{ messageId: "incorrectOrder" }],
     },
   ],
 });

package/tests/props-destructuring-sort.test.js

@@ -1,14 +1,57 @@
+const espree = require("espree");
 const { RuleTester } = require("eslint");
 const rule = require("../lib/rules/props-destructuring-sort");
 
+const defaultParserOptions = {
+  ecmaVersion: 2022,
+  sourceType: "module",
+  ecmaFeatures: { jsx: true },
+};
+
 const ruleTester = new RuleTester({
-  parserOptions: {
-    ecmaVersion: 2022,
-    sourceType: "module",
-    ecmaFeatures: { jsx: true },
-  },
+  parserOptions: defaultParserOptions,
 });
 
+function rewriteRestElementsToExperimentalRestProperty(node) {
+  if (!node || typeof node !== "object") {
+    return;
+  }
+  if (node.type === "RestElement") {
+    node.type = "ExperimentalRestProperty";
+  }
+  for (const key of Object.keys(node)) {
+    if (key === "parent") {
+      continue;
+    }
+    const value = node[key];
+    if (!value) {
+      continue;
+    }
+    if (Array.isArray(value)) {
+      for (const item of value) {
+        rewriteRestElementsToExperimentalRestProperty(item);
+      }
+    } else if (typeof value === "object" && value.type) {
+      rewriteRestElementsToExperimentalRestProperty(value);
+    }
+  }
+}
+
+const babelLegacyRestParser = {
+  parse(code, options) {
+    const ast = espree.parse(code, {
+      ecmaVersion: options.ecmaVersion,
+      sourceType: options.sourceType,
+      loc: true,
+      range: true,
+      tokens: true,
+      ecmaFeatures: options.ecmaFeatures,
+    });
+    rewriteRestElementsToExperimentalRestProperty(ast);
+    return ast;
+  },
+};
+
 ruleTester.run("props-destructuring-sort", rule, {
   valid: [
     {
@@ -143,6 +186,53 @@ ruleTester.run("props-destructuring-sort", rule, {
     `,
       errors: [{ messageId: "incorrectOrder" }],
     },
+    {
+      name: "rest stays last when sorting three props",
+      code: `
+      function MyComponent(props) {
+        const { c, b, a, ...d } = props;
+        return <div>{a}</div>;
+      }
+    `,
+      output: `
+      function MyComponent(props) {
+        const { a, b, c, ...d } = props;
+        return <div>{a}</div>;
+      }
+    `,
+      errors: [{ messageId: "incorrectOrder" }],
+    },
+    {
+      name: "rest stays last with babel legacy ExperimentalRestProperty AST",
+      parser: babelLegacyRestParser,
+      code: `
+      function MyComponent(props) {
+        const { c, b, a, ...d } = props;
+        return <div>{a}</div>;
+      }
+    `,
+      output: `
+      function MyComponent(props) {
+        const { a, b, c, ...d } = props;
+        return <div>{a}</div>;
+      }
+    `,
+      errors: [{ messageId: "incorrectOrder" }],
+    },
+    {
+      name: "rest stays last in destructured params",
+      code: `
+      function MyComponent({ c, b, a, ...d }) {
+        return <div>{a}</div>;
+      }
+    `,
+      output: `
+      function MyComponent({ a, b, c, ...d }) {
+        return <div>{a}</div>;
+      }
+    `,
+      errors: [{ messageId: "incorrectOrder" }],
+    },
     {
       name: "memo-wrapped component params",
       code: `

package/tests/require-data-testid.test.js

@@ -19,6 +19,16 @@ ruleTester.run("require-data-testid", rule, {
         }
       `,
     },
+    {
+      name: "class component with data-testid",
+      code: `
+      class MyComponent extends PureComponent {
+        render() {
+          return <div data-testid="my-component">Hello</div>;
+        }
+      }
+      `,
+    },
     {
       name: "arrow component with dataTestID",
       code: `
@@ -67,6 +77,17 @@ ruleTester.run("require-data-testid", rule, {
       `,
       errors: [{ messageId: "missingDataTestId" }],
     },
+    {
+      name: "class component without data-testid",
+      code: `
+      class MyComponent extends PureComponent {
+        render() {
+          return <div>Hello</div>;
+        }
+      }
+      `,
+      errors: [{ messageId: "missingDataTestId" }],
+    },
     {
       name: "arrow component missing data-testid",
       code: `