diff --git a/.changeset/honest-jobs-grow.md b/.changeset/honest-jobs-grow.md new file mode 100644 index 00000000..7a60b4d4 --- /dev/null +++ b/.changeset/honest-jobs-grow.md @@ -0,0 +1,5 @@ +--- +"eslint-plugin-astro": minor +--- + +feat: add sort-attributes rule diff --git a/docs/rules/sort-attributes.md b/docs/rules/sort-attributes.md new file mode 100644 index 00000000..e35ea143 --- /dev/null +++ b/docs/rules/sort-attributes.md @@ -0,0 +1,59 @@ +--- +title: "astro/sort-attributes" +description: "Enforce sorted Astro attributes" +since: "v1.3.0" +--- + +# astro/sort-attributes + +> Enforce sorted Astro attributes + +- :wrench: The `--fix` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fixing-problems) can automatically fix some of the problems reported by this rule. + +## :book: Rule Details + +Maintaining a consistent order of attributes in Astro elements is crucial for readability and maintainability. This rule ensures that attributes are sorted, making the structure of your elements more predictable and easier to manage. + +Adopting this rule helps standardize code formatting across your project, facilitating better collaboration and reducing cognitive load for developers. + +It’s safe. The rule considers spread elements in an attributes list and does not break component functionality. + +Default: + + + + + +```astro +--- +--- + +{/* ✓ GOOD */} + + +{/* ✓ BAD */} + +``` + + + +## :wrench: Options + +```json +{ + "astro/sort-attributes": [ + "error", + { "type": "alphabetical", "order": "asc", "ignoreCase": true } + ] +} +``` + +## :rocket: Version + +This rule was introduced in eslint-plugin-astro v1.3.0 + +## :mag: Implementation + +- [Rule source](https://github.com/ota-meshi/eslint-plugin-astro/blob/main/src/rules/sort-attributes.ts) +- [Test source](https://github.com/ota-meshi/eslint-plugin-astro/blob/main/tests/src/rules/sort-attributes.ts) +- [Test fixture sources](https://github.com/ota-meshi/eslint-plugin-astro/tree/main/tests/fixtures/rules/sort-attributes) diff --git a/src/rules/sort-attributes.ts b/src/rules/sort-attributes.ts new file mode 100644 index 00000000..b19fdc3c --- /dev/null +++ b/src/rules/sort-attributes.ts @@ -0,0 +1,137 @@ +import type { AST } from "astro-eslint-parser" + +import { createRule } from "../utils" + +export default createRule("sort-attributes", { + meta: { + docs: { + description: "enforce sorting of attributes", + category: "Stylistic Issues", + recommended: false, + }, + schema: [ + { + type: "object", + properties: { + type: { type: "string", enum: ["alphabetical", "line-length"] }, + ignoreCase: { type: "boolean" }, + order: { type: "string", enum: ["asc", "desc"] }, + }, + additionalProperties: false, + }, + ], + messages: { + unexpectedAstroAttributesOrder: + 'Expected "{{right}}" to come before "{{left}}".', + }, + fixable: "code", + type: "suggestion", + }, + create(context) { + if (!context.parserServices.isAstro) { + return {} + } + + return { + JSXElement(node) { + const { openingElement } = node + const { attributes } = openingElement + + if (attributes.length <= 1) { + return + } + + const sourceCode = context.getSourceCode() + + const pairwise = ( + nodes: T[], + callback: (left: T, right: T, iteration: number) => void, + ) => { + if (nodes.length > 1) { + for (let i = 1; i < nodes.length; i++) { + let left = nodes.at(i - 1) + let right = nodes.at(i) + + if (left && right) { + callback(left, right, i - 1) + } + } + } + } + + type Node = + | AST.AstroShorthandAttribute + | AST.AstroTemplateLiteralAttribute + | AST.JSXAttribute + + type SortingNode = { + name: string + node: Node + size: number + } + + const compare = (left: SortingNode, right: SortingNode) => { + const compareFunc = (a: SortingNode, b: SortingNode) => { + if (context.options[0]?.type === "line-length") { + return a.size - b.size + } + const formatName = (name: string) => + context.options[0]?.ignoreCase === false + ? name + : name.toLowerCase() + return formatName(a.name).localeCompare(formatName(b.name)) + } + + const orderCoefficient = context.options[0]?.order === "desc" ? -1 : 1 + + return compareFunc(left, right) * orderCoefficient + } + + const parts = attributes.reduce( + (accumulator: SortingNode[][], attribute) => { + if (attribute.type === "JSXSpreadAttribute") { + accumulator.push([]) + return accumulator + } + + const name = + typeof attribute.name.name === "string" + ? attribute.name.name + : sourceCode.text.slice(...attribute.name.range) + + accumulator[accumulator.length - 1].push({ + name, + node: attribute, + size: attribute.range[1] - attribute.range[0], + }) + + return accumulator + }, + [[]], + ) + + for (let nodes of parts) { + pairwise(nodes, (left, right) => { + if (compare(left, right) > 0) { + context.report({ + node: left.node, + messageId: "unexpectedAstroAttributesOrder", + data: { + left: left.name, + right: right.name, + }, + fix(fixer) { + return fixer.replaceTextRange( + [left.node.range[0], right.node.range[1]], + sourceCode.text.slice(...right.node.range) + + sourceCode.text.slice(...left.node.range), + ) + }, + }) + } + }) + } + }, + } + }, +}) diff --git a/src/utils/rules.ts b/src/utils/rules.ts index 76b2bb58..0d98f4e4 100644 --- a/src/utils/rules.ts +++ b/src/utils/rules.ts @@ -15,6 +15,7 @@ import preferClassListDirective from "../rules/prefer-class-list-directive" import preferObjectClassList from "../rules/prefer-object-class-list" import preferSplitClassList from "../rules/prefer-split-class-list" import semi from "../rules/semi" +import sortAttributes from "../rules/sort-attributes" import validCompile from "../rules/valid-compile" import { buildA11yRules } from "../a11y" @@ -32,6 +33,7 @@ export const rules = [ preferObjectClassList, preferSplitClassList, semi, + sortAttributes, validCompile, ...buildA11yRules(), ] as RuleModule[] diff --git a/tests/fixtures/rules/sort-attributes/invalid/alphabetical/_config.json b/tests/fixtures/rules/sort-attributes/invalid/alphabetical/_config.json new file mode 100644 index 00000000..9c47765b --- /dev/null +++ b/tests/fixtures/rules/sort-attributes/invalid/alphabetical/_config.json @@ -0,0 +1,3 @@ +{ + "options": [{ "type": "alphabetical", "order": "asc" }] +} diff --git a/tests/fixtures/rules/sort-attributes/invalid/alphabetical/test01-errors.json b/tests/fixtures/rules/sort-attributes/invalid/alphabetical/test01-errors.json new file mode 100644 index 00000000..ebe798ec --- /dev/null +++ b/tests/fixtures/rules/sort-attributes/invalid/alphabetical/test01-errors.json @@ -0,0 +1,12 @@ +[ + { + "message": "Expected \"b\" to come before \"c\".", + "line": 5, + "column": 6 + }, + { + "message": "Expected \"a\" to come before \"b\".", + "line": 5, + "column": 12 + } +] diff --git a/tests/fixtures/rules/sort-attributes/invalid/alphabetical/test01-input.astro b/tests/fixtures/rules/sort-attributes/invalid/alphabetical/test01-input.astro new file mode 100644 index 00000000..b608c746 --- /dev/null +++ b/tests/fixtures/rules/sort-attributes/invalid/alphabetical/test01-input.astro @@ -0,0 +1,5 @@ +--- + +--- + +
diff --git a/tests/fixtures/rules/sort-attributes/invalid/alphabetical/test01-output.astro b/tests/fixtures/rules/sort-attributes/invalid/alphabetical/test01-output.astro new file mode 100644 index 00000000..3e2c256f --- /dev/null +++ b/tests/fixtures/rules/sort-attributes/invalid/alphabetical/test01-output.astro @@ -0,0 +1,5 @@ +--- + +--- + +
diff --git a/tests/fixtures/rules/sort-attributes/invalid/line-length/_config.json b/tests/fixtures/rules/sort-attributes/invalid/line-length/_config.json new file mode 100644 index 00000000..d9e66553 --- /dev/null +++ b/tests/fixtures/rules/sort-attributes/invalid/line-length/_config.json @@ -0,0 +1,3 @@ +{ + "options": [{ "type": "line-length", "order": "desc" }] +} diff --git a/tests/fixtures/rules/sort-attributes/invalid/line-length/test01-errors.json b/tests/fixtures/rules/sort-attributes/invalid/line-length/test01-errors.json new file mode 100644 index 00000000..a2956281 --- /dev/null +++ b/tests/fixtures/rules/sort-attributes/invalid/line-length/test01-errors.json @@ -0,0 +1,12 @@ +[ + { + "message": "Expected \"bb\" to come before \"c\".", + "line": 5, + "column": 6 + }, + { + "message": "Expected \"aaa\" to come before \"bb\".", + "line": 5, + "column": 12 + } +] diff --git a/tests/fixtures/rules/sort-attributes/invalid/line-length/test01-input.astro b/tests/fixtures/rules/sort-attributes/invalid/line-length/test01-input.astro new file mode 100644 index 00000000..045c0a39 --- /dev/null +++ b/tests/fixtures/rules/sort-attributes/invalid/line-length/test01-input.astro @@ -0,0 +1,5 @@ +--- + +--- + +
diff --git a/tests/fixtures/rules/sort-attributes/invalid/line-length/test01-output.astro b/tests/fixtures/rules/sort-attributes/invalid/line-length/test01-output.astro new file mode 100644 index 00000000..0ce47b62 --- /dev/null +++ b/tests/fixtures/rules/sort-attributes/invalid/line-length/test01-output.astro @@ -0,0 +1,5 @@ +--- + +--- + +
diff --git a/tests/fixtures/rules/sort-attributes/valid/alphabetical/_config.json b/tests/fixtures/rules/sort-attributes/valid/alphabetical/_config.json new file mode 100644 index 00000000..9c47765b --- /dev/null +++ b/tests/fixtures/rules/sort-attributes/valid/alphabetical/_config.json @@ -0,0 +1,3 @@ +{ + "options": [{ "type": "alphabetical", "order": "asc" }] +} diff --git a/tests/fixtures/rules/sort-attributes/valid/alphabetical/test01-input.astro b/tests/fixtures/rules/sort-attributes/valid/alphabetical/test01-input.astro new file mode 100644 index 00000000..c282513f --- /dev/null +++ b/tests/fixtures/rules/sort-attributes/valid/alphabetical/test01-input.astro @@ -0,0 +1,5 @@ +--- + +--- + +
diff --git a/tests/fixtures/rules/sort-attributes/valid/alphabetical/test02-input.astro b/tests/fixtures/rules/sort-attributes/valid/alphabetical/test02-input.astro new file mode 100644 index 00000000..6ca9e245 --- /dev/null +++ b/tests/fixtures/rules/sort-attributes/valid/alphabetical/test02-input.astro @@ -0,0 +1,5 @@ +--- +const d = [] +--- + +
diff --git a/tests/fixtures/rules/sort-attributes/valid/line-length/_config.json b/tests/fixtures/rules/sort-attributes/valid/line-length/_config.json new file mode 100644 index 00000000..d9e66553 --- /dev/null +++ b/tests/fixtures/rules/sort-attributes/valid/line-length/_config.json @@ -0,0 +1,3 @@ +{ + "options": [{ "type": "line-length", "order": "desc" }] +} diff --git a/tests/fixtures/rules/sort-attributes/valid/line-length/test01-input.astro b/tests/fixtures/rules/sort-attributes/valid/line-length/test01-input.astro new file mode 100644 index 00000000..78f1a906 --- /dev/null +++ b/tests/fixtures/rules/sort-attributes/valid/line-length/test01-input.astro @@ -0,0 +1,5 @@ +--- + +--- + +
diff --git a/tests/fixtures/rules/sort-attributes/valid/line-length/test02-input.astro b/tests/fixtures/rules/sort-attributes/valid/line-length/test02-input.astro new file mode 100644 index 00000000..5feb2bf3 --- /dev/null +++ b/tests/fixtures/rules/sort-attributes/valid/line-length/test02-input.astro @@ -0,0 +1,5 @@ +--- +const d = [] +--- + +
diff --git a/tests/src/rules/sort-attributes.ts b/tests/src/rules/sort-attributes.ts new file mode 100644 index 00000000..25032a8c --- /dev/null +++ b/tests/src/rules/sort-attributes.ts @@ -0,0 +1,15 @@ +import { RuleTester } from "eslint" +import rule from "../../../src/rules/sort-attributes" +import { loadTestCases } from "../../utils/utils" + +const tester = new RuleTester({ + parserOptions: { + ecmaVersion: 2020, + sourceType: "module", + }, + globals: { + Astro: false, + }, +}) + +tester.run("sort-attributes", rule as any, loadTestCases("sort-attributes"))