Change rule to allow key before spread

meitner-se · Nov 14, 2024 · 626b713 · 626b713
1 parent f5ea003
commit 626b713
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 5 deletions.
diff --git a/src/rules/alwaysSpreadJSXPropsFirst.ts b/src/rules/alwaysSpreadJSXPropsFirst.ts
@@ -26,17 +26,27 @@ export const alwaysSpreadJSXPropsFirst = ESLintUtils.RuleCreator.withoutDocs({
                     return;
                 }
 
-                context.report({
-                    node,
-                    messageId: "alwaysSpreadJSXPropsFirst",
-                });
+                const beforeSpread = attributes.slice(0, spreadAttributeIndex);
+
+                const hasOnlyKeyBeforeSpread = beforeSpread.every(
+                    (attribute) =>
+                        attribute.type === "JSXAttribute" &&
+                        attribute.name.name === "key"
+                );
+
+                if (!hasOnlyKeyBeforeSpread) {
+                    context.report({
+                        node,
+                        messageId: "alwaysSpreadJSXPropsFirst",
+                    });
+                }
             },
         };
     },
     meta: {
         messages: {
             alwaysSpreadJSXPropsFirst:
-                "Always put JSX spread props first to avoid unintended behavior",
+                "Only 'key' prop is allowed before JSX spread props.",
         },
         type: "problem",
         schema: [],

diff --git a/src/tests/alwaysSpreadPropsFirst.test.ts b/src/tests/alwaysSpreadPropsFirst.test.ts
@@ -13,6 +13,10 @@ const ruleTester = new RuleTester({
 
 ruleTester.run("alwaysSpreadJSXPropsFirst", alwaysSpreadJSXPropsFirst, {
     valid: [
+        {
+            code: "<Component key={key} {...props} myProp={myValue} />",
+            parserOptions: { ecmaFeatures: { jsx: true } },
+        },
         {
             code: "<Component {...props} myProp={myValue} />",
             parserOptions: { ecmaFeatures: { jsx: true } },