add jsxPropsNoSpreading rule and tests
MODIFY
packages/@romejs/compiler/lint/rules/index.ts
packages/@romejs/compiler/lint/rules/index.ts
@@ -85,6 +85,7 @@ import jsxKey from "./react/jsxKey";
import jsxNoCommentText from "./react/jsxNoCommentText";
import jsxNoDuplicateProps from "./react/jsxNoDuplicateProps";
import jsxPascalCase from "./react/jsxPascalCase";
+import jsxPropsNoSpreading from "./react/jsxPropsNoSpreading";
import noAccessStateInSetState from "./react/noAccessStateInSetState";
import noArrayIndexKey from "./react/noArrayIndexKey";
import noChildrenProp from "./react/noChildrenProp";
@@ -187,6 +188,7 @@ export const lintTransforms = [
jsxNoCommentText,
jsxNoDuplicateProps,
jsxPascalCase,
+ jsxPropsNoSpreading,
noAccessStateInSetState,
noArrayIndexKey,
noChildrenProp,

ADD
packages/@romejs/compiler/lint/rules/react/jsxPropsNoSpreading.test.ts
+import {test} from "rome";
+import {testLint} from "../testHelpers";
+
+test(
+ "react jsx props no spreading",
+ async (t) => {
+ await testLint(
+ t,
+ {
+ invalid: [
+ "<App {...props} />",
+ "<MyCustomComponent {...props} some_other_prop={some_other_prop} />",
+ "<MyCustomComponent some_other_prop={some_other_prop} {...props} />",
+ "<img {...props} />",
+ ],
+ valid: [
+ "<MyCustomComponent one_prop={one_prop} two_prop={two_prop} />",
+ "<img src={src} alt={alt} />",
+ ],
+ },
+ {category: "lint/react/jsxPropsNoSpreading"},
+ );
+ },
+);

ADD
packages/@romejs/compiler/lint/rules/react/jsxPropsNoSpreading.ts
+import {Path, TransformExitResult} from "@romejs/compiler";
+import {descriptions} from "@romejs/diagnostics";
+
+export default {
+ name: "reactJsxPropsNoSpreading",
+ enter(path: Path): TransformExitResult {
+ const {node} = path;
+
+ if (node.type === "JSXSpreadAttribute") {
+ path.context.addNodeDiagnostic(
+ node,
+ descriptions.LINT.REACT_JSX_PROPS_NO_SPREADING,
+ );
+ }
+
+ return node;
+ },
+};

MODIFY
packages/@romejs/diagnostics/categories.ts
packages/@romejs/diagnostics/categories.ts
@@ -172,6 +172,7 @@ type LintDiagnosticCategory =
| "lint/react/jsxNoCommentText"
| "lint/react/jsxNoDuplicateProps"
| "lint/react/jsxPascalCase"
+ | "lint/react/jsxPropsNoSpreading"
| "lint/react/noAccessStateInSetState"
| "lint/react/noArrayIndexKey"
| "lint/react/noChildrenProp"

MODIFY
packages/@romejs/diagnostics/descriptions/lint.ts
packages/@romejs/diagnostics/descriptions/lint.ts
@@ -16,6 +16,17 @@ import {buildSuggestionAdvice} from "../helpers";
import {createDiagnosticsCategory, orJoin} from "./index";
export const lint = createDiagnosticsCategory({
+ REACT_JSX_PROPS_NO_SPREADING: {
+ category: "lint/react/jsxPropsNoSpreading",
+ message: "Avoid using property spreading in JSX components.",
+ advice: [
+ {
+ type: "log",
+ category: "info",
+ text: "Explicit JSX attributes enhance the readability of code by clearly indicating which props are accepted by a given element.",
+ },
+ ],
+ },
REACT_NO_ARRAY_INDEX_KEY: {
category: "lint/react/noArrayIndexKey",
message: "Avoid using array index as key property in an element.",

add jsxPropsNoSpreading rule and tests (#610)