feat(vue/no-negated-v-if-condition): upgrade rule suggestion to autofix

docs/rules/index.md

@@ -238,7 +238,7 @@ For example:
 | [vue/no-empty-component-block] | disallow the `<template>` `<script>` `<style>` block to be empty | :wrench: | :hammer: |
 | [vue/no-import-compiler-macros] | disallow importing Vue compiler macros | :wrench: | :warning: |
 | [vue/no-multiple-objects-in-class] | disallow passing multiple objects in an array to class |  | :hammer: |
-| [vue/no-negated-v-if-condition] | disallow negated conditions in v-if/v-else | :bulb: | :hammer: |
+| [vue/no-negated-v-if-condition] | disallow negated conditions in v-if/v-else | :wrench::bulb: | :hammer: |
 | [vue/no-potential-component-option-typo] | disallow a potential typo in your component property | :bulb: | :hammer: |
 | [vue/no-ref-object-reactivity-loss] | disallow usages of ref objects that can lead to loss of reactivity |  | :warning: |
 | [vue/no-restricted-block] | disallow specific block |  | :hammer: |

docs/rules/no-negated-v-if-condition.md

@@ -10,6 +10,7 @@ since: v10.4.0
 
 > disallow negated conditions in v-if/v-else
 
+- :wrench: The `--fix` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fix-problems) can automatically fix some of the problems reported by this rule.
 - :bulb: Some problems reported by this rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
 
 ## :book: Rule Details
@@ -18,7 +19,7 @@ This rule disallows negated conditions in `v-if` and `v-else-if` directives whic
 
 Negated conditions make the code less readable. When there's an `else` clause, it's better to use a positive condition and switch the branches.
 
-<eslint-code-block :rules="{'vue/no-negated-v-if-condition': ['error']}">
+<eslint-code-block fix :rules="{'vue/no-negated-v-if-condition': ['error']}">
 
 ```vue
 <template>
@@ -50,7 +51,15 @@ Negated conditions make the code less readable. When there's an `else` clause, i
 
 ## :wrench: Options
 
-Nothing.
+```json
+{
+  "vue/no-negated-v-if-condition": ["error", {
+    "autofix": false,
+  }]
+}
+```
+
+- `"autofix"` ... If `true`, enable autofix. (Default: `false`)
 
 ## :couple: Related Rules
 

lib/rules/no-negated-v-if-condition.js

@@ -76,9 +76,19 @@ module.exports = {
       categories: undefined,
       url: 'https://eslint.vuejs.org/rules/no-negated-v-if-condition.html'
     },
-    fixable: null,
+    fixable: 'code',
     hasSuggestions: true,
-    schema: [],
+    schema: [
+      {
+        type: 'object',
+        properties: {
+          autofix: {
+            type: 'boolean'
+          }
+        },
+        additionalProperties: false
+      }
+    ],
     messages: {
       negatedCondition: 'Unexpected negated condition in v-if with v-else.',
       fixNegatedCondition:
@@ -88,6 +98,7 @@ module.exports = {
   /** @param {RuleContext} context */
   create(context) {
     const sourceCode = context.sourceCode
+    const canAutoFix = !!context.options[0]?.autofix
 
     const processedPairs = new Set()
 
@@ -152,14 +163,21 @@ module.exports = {
       context.report({
         node: expression,
         messageId: 'negatedCondition',
-        suggest: [
-          {
-            messageId: 'fixNegatedCondition',
-            *fix(fixer) {
-              yield* swapElements(fixer, element, elseElement, expression)
-            }
-          }
-        ]
+        suggest: canAutoFix
+          ? null
+          : [
+              {
+                messageId: 'fixNegatedCondition',
+                *fix(fixer) {
+                  yield* swapElements(fixer, element, elseElement, expression)
+                }
+              }
+            ],
+        fix: canAutoFix
+          ? (fixer) => [
+              ...swapElements(fixer, element, elseElement, expression)
+            ]
+          : null
       })
     }
 

tests/lib/rules/no-negated-v-if-condition.js

@@ -145,6 +145,23 @@ tester.run('no-negated-v-if-condition', rule, {
     }
   ],
   invalid: [
+    {
+      filename: 'test.vue',
+      code: `
+        <template>
+          <div v-if="!foo">Content</div>
+          <span v-else>Alternative</span>
+        </template>
+      `,
+      output: `
+        <template>
+          <span v-if="foo">Alternative</span>
+          <div v-else>Content</div>
+        </template>
+      `,
+      options: [{ autofix: true }],
+      errors: [{ messageId: 'negatedCondition', line: 3, column: 22 }]
+    },
     {
       filename: 'test.vue',
       code: `
@@ -153,6 +170,7 @@ tester.run('no-negated-v-if-condition', rule, {
         <span v-else class="secondary">Alternative</span>
       </template>
       `,
+      output: null,
       errors: [
         {
           messageId: 'negatedCondition',
@@ -182,6 +200,7 @@ tester.run('no-negated-v-if-condition', rule, {
         <span v-else id="positive">Otherwise</span>
       </template>
       `,
+      output: null,
       errors: [
         {
           messageId: 'negatedCondition',
@@ -211,6 +230,7 @@ tester.run('no-negated-v-if-condition', rule, {
         <div v-else>Equal</div>
       </template>
       `,
+      output: null,
       errors: [
         {
           messageId: 'negatedCondition',
@@ -240,6 +260,7 @@ tester.run('no-negated-v-if-condition', rule, {
         <div v-else>Strictly equal</div>
       </template>
       `,
+      output: null,
       errors: [
         {
           messageId: 'negatedCondition',
@@ -270,6 +291,7 @@ tester.run('no-negated-v-if-condition', rule, {
         <p v-else class="default">Default</p>
       </template>
       `,
+      output: null,
       errors: [
         {
           messageId: 'negatedCondition',
@@ -301,6 +323,7 @@ tester.run('no-negated-v-if-condition', rule, {
         <p v-else data-default>Default</p>
       </template>
       `,
+      output: null,
       errors: [
         {
           messageId: 'negatedCondition',
@@ -331,6 +354,7 @@ tester.run('no-negated-v-if-condition', rule, {
         <span v-else class="span-class" span-attr="baz" span-attr2 :span-attr-3="baz">span contents</span>
       </template>
       `,
+      output: null,
       errors: [
         {
           messageId: 'negatedCondition',
@@ -366,6 +390,7 @@ tester.run('no-negated-v-if-condition', rule, {
         </section>
       </template>
       `,
+      output: null,
       errors: [
         {
           messageId: 'negatedCondition',