Merge pull request #2649 from johanrd/autofix/sort-invocations

Post-merge-review: Restore autofix for template-sort-invocations

Author: NullVoxPopuli

README.md

@@ -284,7 +284,7 @@ rules in templates can be disabled with eslint directives with mustache or html
 | [template-self-closing-void-elements](docs/rules/template-self-closing-void-elements.md)                           | require self-closing on void elements                                        |    | 🔧 |    |
 | [template-simple-modifiers](docs/rules/template-simple-modifiers.md)                                               | require simple modifier syntax                                               |    |    |    |
 | [template-simple-unless](docs/rules/template-simple-unless.md)                                                     | require simple conditions in unless blocks                                   |    |    |    |
-| [template-sort-invocations](docs/rules/template-sort-invocations.md)                                               | require sorted attributes and modifiers                                      |    |    |    |
+| [template-sort-invocations](docs/rules/template-sort-invocations.md)                                               | require sorted attributes and modifiers                                      |    | 🔧 |    |
 | [template-splat-attributes-only](docs/rules/template-splat-attributes-only.md)                                     | disallow ...spread other than ...attributes                                  |    |    |    |
 | [template-style-concatenation](docs/rules/template-style-concatenation.md)                                         | disallow string concatenation in inline styles                               |    |    |    |
 

docs/rules/template-sort-invocations.md

@@ -1,5 +1,7 @@
 # ember/template-sort-invocations
 
+🔧 This rule is automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix).
+
 <!-- end auto-generated rule header -->
 
 ## Why use it?

lib/rules/template-sort-invocations.js

@@ -9,7 +9,7 @@ module.exports = {
       url: 'https://github.com/ember-cli/eslint-plugin-ember/tree/master/docs/rules/template-sort-invocations.md',
       templateMode: 'both',
     },
-    fixable: null,
+    fixable: 'code',
     schema: [],
     messages: {
       attributeOrder: '`{{attributeName}}` must appear after `{{expectedAfter}}`',
@@ -26,6 +26,24 @@ module.exports = {
   },
 
   create(context) {
+    const sourceCode = context.sourceCode;
+
+    // Glimmer attribute and modifier nodes can have trailing whitespace
+    // absorbed into their range, so we strip the trailing whitespace from
+    // each side and re-append it at the end of the swapped output.
+    function createSwapFix(fixer, nodeA, nodeB) {
+      const rawA = sourceCode.getText(nodeA);
+      const rawB = sourceCode.getText(nodeB);
+      const contentA = rawA.trimEnd();
+      const contentB = rawB.trimEnd();
+      const separator = sourceCode.text.slice(nodeA.range[0] + contentA.length, nodeB.range[0]);
+      const trailing = rawB.slice(contentB.length);
+      return fixer.replaceTextRange(
+        [nodeA.range[0], nodeB.range[1]],
+        contentB + separator + contentA + trailing
+      );
+    }
+
     function getAttributeName(node) {
       return node.name;
     }
@@ -171,6 +189,9 @@ module.exports = {
                 attributeName: getAttributeName(attributes[index]),
                 expectedAfter: getAttributeName(attributes[index + 1]),
               },
+              fix(fixer) {
+                return createSwapFix(fixer, attributes[index], attributes[index + 1]);
+              },
             });
           }
         }
@@ -186,13 +207,28 @@ module.exports = {
                 modifierName: getModifierName(modifiers[index]),
                 expectedAfter: getModifierName(modifiers[index + 1]),
               },
+              fix(fixer) {
+                return createSwapFix(fixer, modifiers[index], modifiers[index + 1]);
+              },
             });
           }
         }
 
         if (!canSkipSplattributesLast(node)) {
           const splattributes = attributes.at(-1);
 
+          // Swap ...attributes past the first modifier that appears after it;
+          // ESLint's fix loop continues until splattributes is fully sorted.
+          // canSkipSplattributesLast guarantees at least one such modifier exists.
+          const firstModifierAfter = modifiers.find(
+            (mod) =>
+              mod.loc.start.line > splattributes.loc.start.line ||
+              (mod.loc.start.line === splattributes.loc.start.line &&
+                mod.loc.start.column > splattributes.loc.start.column)
+          );
+
+          const splatFixFn = (fixer) => createSwapFix(fixer, splattributes, firstModifierAfter);
+
           // When ...attributes is the only attribute, report as attributeOrder
           // (the ordering issue is that ...attributes should appear after modifiers)
           if (attributes.length === 1) {
@@ -203,11 +239,13 @@ module.exports = {
                 attributeName: '...attributes',
                 expectedAfter: 'modifiers',
               },
+              fix: splatFixFn,
             });
           } else {
             context.report({
               node: splattributes,
               messageId: 'splattributesOrder',
+              fix: splatFixFn,
             });
           }
         }
@@ -225,6 +263,9 @@ module.exports = {
                 hashPairName: getHashPairName(node.hash.pairs[index]),
                 expectedAfter: getHashPairName(node.hash.pairs[index + 1]),
               },
+              fix(fixer) {
+                return createSwapFix(fixer, node.hash.pairs[index], node.hash.pairs[index + 1]);
+              },
             });
           }
         }
@@ -244,6 +285,10 @@ module.exports = {
               node.params.length > 0 &&
               node.params[0].type === 'GlimmerStringLiteral';
 
+            const fixFn = function (fixer) {
+              return createSwapFix(fixer, node.hash.pairs[index], node.hash.pairs[index + 1]);
+            };
+
             if (isComponentInvocation) {
               context.report({
                 node: node.hash.pairs[index],
@@ -252,6 +297,7 @@ module.exports = {
                   attributeName: getHashPairName(node.hash.pairs[index]),
                   expectedAfter: getHashPairName(node.hash.pairs[index + 1]),
                 },
+                fix: fixFn,
               });
             } else {
               context.report({
@@ -261,6 +307,7 @@ module.exports = {
                   hashPairName: getHashPairName(node.hash.pairs[index]),
                   expectedAfter: getHashPairName(node.hash.pairs[index + 1]),
                 },
+                fix: fixFn,
               });
             }
           }
@@ -279,6 +326,9 @@ module.exports = {
                 hashPairName: getHashPairName(node.hash.pairs[index]),
                 expectedAfter: getHashPairName(node.hash.pairs[index + 1]),
               },
+              fix(fixer) {
+                return createSwapFix(fixer, node.hash.pairs[index], node.hash.pairs[index + 1]);
+              },
             });
           }
         }