Add vue/no-v-text rule

docs/rules/README.md

@@ -324,6 +324,7 @@ For example:
 | [vue/no-use-computed-property-like-method](./no-use-computed-property-like-method.md) | disallow use computed property like method |  |
 | [vue/no-useless-mustaches](./no-useless-mustaches.md) | disallow unnecessary mustache interpolations | :wrench: |
 | [vue/no-useless-v-bind](./no-useless-v-bind.md) | disallow unnecessary `v-bind` directives | :wrench: |
+| [vue/no-v-text](./no-v-text.md) | disallow use of v-text | :wrench: |
 | [vue/padding-line-between-blocks](./padding-line-between-blocks.md) | require or disallow padding lines between blocks | :wrench: |
 | [vue/require-direct-export](./require-direct-export.md) | require the component to be directly exported |  |
 | [vue/require-emit-validator](./require-emit-validator.md) | require type definitions in emits |  |

docs/rules/no-v-text.md

@@ -0,0 +1,48 @@
+---
+pageClass: rule-details
+sidebarDepth: 0
+title: vue/no-v-text
+description: disallow use of v-text
+since: v7.17.0
+---
+# vue/no-v-text
+
+> disallow use of v-text
+
+- :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.
+
+  - However, when using selfClose to element with v-text like `<div v-text="foobar" />`, it can't be fixed.
+
+## :book: Rule Details
+
+This rule reports all uses of `v-text` directive.
+
+
+<eslint-code-block fix :rules="{'vue/no-v-text': ['error']}">
+
+```vue
+<template>
+  <!-- ✓ GOOD -->
+  <div>{{ foobar }}</div>
+
+  <!-- ✗ BAD -->
+  <div v-text="foobar"></div>
+  <!-- Reported. However, Not fixable -->
+  <div v-text="foobar" />
+</template>
+```
+
+</eslint-code-block>
+
+## :wrench: Options
+
+Nothing.
+
+## :rocket: Version
+
+This rule was introduced in eslint-plugin-vue v7.17.0
+
+## :mag: Implementation
+
+- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/no-v-text.js)
+- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/no-v-text.js)

lib/index.js

@@ -132,6 +132,7 @@ module.exports = {
     'no-v-for-template-key': require('./rules/no-v-for-template-key'),
     'no-v-html': require('./rules/no-v-html'),
     'no-v-model-argument': require('./rules/no-v-model-argument'),
+    'no-v-text': require('./rules/no-v-text'),
     'no-watch-after-await': require('./rules/no-watch-after-await'),
     'object-curly-newline': require('./rules/object-curly-newline'),
     'object-curly-spacing': require('./rules/object-curly-spacing'),

lib/rules/no-v-text.js

@@ -0,0 +1,76 @@
+/**
+ * @author tyankatsu <https://github.com/tyankatsu0105>
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+const utils = require('../utils')
+
+// ------------------------------------------------------------------------------
+// Rule Definition
+// ------------------------------------------------------------------------------
+
+/**
+ *
+ * @param {VElement} node
+ * @returns {{node: VAttribute | VDirective, value: string}}
+ */
+const getVText = (node) => {
+  const vText = node.startTag.attributes.find(
+    (attribute) =>
+      attribute.key.type === 'VDirectiveKey' &&
+      attribute.key.name.name === 'text'
+  )
+
+  if (!vText) return
+  if (!vText.value) return
+  if (vText.value.type !== 'VExpressionContainer') return
+  if (!vText.value.expression) return
+  if (vText.value.expression.type !== 'Identifier') return
+
+  const vTextValue = vText.value.expression.name
+
+  return {
+    node: vText,
+    value: vTextValue
+  }
+}
+
+module.exports = {
+  meta: {
+    type: 'suggestion',
+    docs: {
+      description: 'disallow use of v-text',
+      categories: undefined,
+      url: 'https://eslint.vuejs.org/rules/no-v-text.html'
+    },
+    fixable: 'code',
+    schema: []
+  },
+  /** @param {RuleContext} context */
+  create(context) {
+    return utils.defineTemplateBodyVisitor(context, {
+      /** @param {VElement} node */
+      "VElement:has(VAttribute[directive=true][key.name.name='text'])"(node) {
+        const vText = getVText(node)
+        if (!vText) return
+
+        context.report({
+          node: vText.node,
+          loc: vText.loc,
+          message: "Don't use 'v-text'.",
+          fix(fixable) {
+            if (node.startTag.selfClosing) return
+
+            return [
+              fixable.remove(vText.node),
+              fixable.insertTextAfterRange(
+                node.startTag.range,
+                `{{${vText.value}}}`
+              )
+            ]
+          }
+        })
+      }
+    })
+  }
+}

tests/lib/rules/no-v-text.js

@@ -0,0 +1,52 @@
+/**
+ * @author tyankatsu <https://github.com/tyankatsu0105>
+ * See LICENSE file in root directory for full license.
+ */
+
+'use strict'
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+const RuleTester = require('eslint').RuleTester
+const rule = require('../../../lib/rules/no-v-text')
+
+// ------------------------------------------------------------------------------
+// Tests
+// ------------------------------------------------------------------------------
+const ruleTester = new RuleTester({
+  parser: require.resolve('vue-eslint-parser'),
+  parserOptions: { ecmaVersion: 2015 }
+})
+
+ruleTester.run('no-v-text', rule, {
+  valid: [
+    {
+      filename: 'test.vue',
+      code: ''
+    },
+    {
+      filename: 'test.vue',
+      code: '<template></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div>{{foobar}}</div></template>'
+    }
+  ],
+  invalid: [
+    {
+      filename: 'test.vue',
+      code: '<template><div v-text="foobar"></div></template>',
+      output: '<template><div >{{foobar}}</div></template>',
+      errors: ["Don't use 'v-text'."]
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div v-text="foobar" /></template>',
+      output: '<template><div v-text="foobar" /></template>',
+      errors: ["Don't use 'v-text'."]
+    }
+  ]
+})