From 325a7776d7e59b63c0434eed9030dae1c80b0cfa Mon Sep 17 00:00:00 2001
From: Douglas Wade <douglas.b.wade@gmail.com>
Date: Sat, 16 Apr 2022 00:44:22 -0700
Subject: [PATCH 01/19] Fix #1373: Add rule no-invalid-attribute-name

---
 docs/rules/README.md                         |   2 +
 docs/rules/no-invalid-attribute-name.md      |  43 +++++
 lib/index.js                                 |   1 +
 lib/rules/no-invalid-attribute-name.js       |  54 +++++++
 tests/lib/rules/no-invalid-attribute-name.js | 158 +++++++++++++++++++
 5 files changed, 258 insertions(+)
 create mode 100644 docs/rules/no-invalid-attribute-name.md
 create mode 100644 lib/rules/no-invalid-attribute-name.js
 create mode 100644 tests/lib/rules/no-invalid-attribute-name.js

diff --git a/docs/rules/README.md b/docs/rules/README.md
index 3d2d113d7..a872a23c6 100644
--- a/docs/rules/README.md
+++ b/docs/rules/README.md
@@ -12,6 +12,7 @@ sidebarDepth: 0
   :bulb: Indicates that some problems reported by the rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
 :::
 
+
 ## Base Rules (Enabling Correct ESLint Parsing)
 
 Enforce all the rules in this category, as well as all higher priority rules, with:
@@ -326,6 +327,7 @@ For example:
 | [vue/no-duplicate-attr-inheritance](./no-duplicate-attr-inheritance.md) | enforce `inheritAttrs` to be set to `false` when using `v-bind="$attrs"` |  |
 | [vue/no-empty-component-block](./no-empty-component-block.md) | disallow the `<template>` `<script>` `<style>` block to be empty |  |
 | [vue/no-expose-after-await](./no-expose-after-await.md) | disallow asynchronously registered `expose` |  |
+| [vue/no-invalid-attribute-name](./no-invalid-attribute-name.md) | require the attributes to match the imported component name |  |
 | [vue/no-invalid-model-keys](./no-invalid-model-keys.md) | require valid keys in model option |  |
 | [vue/no-multiple-objects-in-class](./no-multiple-objects-in-class.md) | disallow to pass multiple objects into array to class |  |
 | [vue/no-potential-component-option-typo](./no-potential-component-option-typo.md) | disallow a potential typo in your component property | :bulb: |
diff --git a/docs/rules/no-invalid-attribute-name.md b/docs/rules/no-invalid-attribute-name.md
new file mode 100644
index 000000000..405658878
--- /dev/null
+++ b/docs/rules/no-invalid-attribute-name.md
@@ -0,0 +1,43 @@
+---
+pageClass: rule-details
+sidebarDepth: 0
+title: vue/no-invalid-attribute-name
+description: require the attributes to match the imported component name
+---
+# vue/no-invalid-attribute-name
+
+> require the attributes to match the imported component name
+
+- :exclamation: <badge text="This rule has not been released yet." vertical="middle" type="error"> ***This rule has not been released yet.*** </badge>
+
+## :book: Rule Details
+
+This rule detects invalid html attributes.
+
+<eslint-code-block :rules="{'vue/no-invalid-attribute-name': ['error']}">
+
+```vue
+<template>
+  <!-- ✓ GOOD -->
+  <p foo.bar></p>
+  <p foo-bar></p>
+  <p _foo.bar></p>
+  <p :foo-bar></p>
+
+  <!-- ✗ BAD -->
+  <p 0abc></p>
+  <p -def></p>
+  <p !ghi></p>
+</template>
+```
+
+</eslint-code-block>
+
+## :wrench: Options
+
+Nothing.
+
+## :mag: Implementation
+
+- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/no-invalid-attribute-name.js)
+- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/no-invalid-attribute-name.js)
diff --git a/lib/index.js b/lib/index.js
index d412a6bf1..dcdfa5e1b 100644
--- a/lib/index.js
+++ b/lib/index.js
@@ -93,6 +93,7 @@ module.exports = {
     'no-export-in-script-setup': require('./rules/no-export-in-script-setup'),
     'no-expose-after-await': require('./rules/no-expose-after-await'),
     'no-extra-parens': require('./rules/no-extra-parens'),
+    'no-invalid-attribute-name': require('./rules/no-invalid-attribute-name'),
     'no-invalid-model-keys': require('./rules/no-invalid-model-keys'),
     'no-irregular-whitespace': require('./rules/no-irregular-whitespace'),
     'no-lifecycle-after-await': require('./rules/no-lifecycle-after-await'),
diff --git a/lib/rules/no-invalid-attribute-name.js b/lib/rules/no-invalid-attribute-name.js
new file mode 100644
index 000000000..75f802c26
--- /dev/null
+++ b/lib/rules/no-invalid-attribute-name.js
@@ -0,0 +1,54 @@
+/**
+ * @author Doug Wade <douglas.b.wade@gmail.com>
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+const utils = require('../utils')
+
+module.exports = {
+  meta: {
+    type: 'problem',
+    docs: {
+      description:
+        'require the attributes to match the imported component name',
+      categories: undefined,
+      url: 'https://eslint.vuejs.org/rules/no-invalid-attribute-name.html'
+    },
+    fixable: null,
+    schema: [],
+    messages: {
+      unexpected: '{{name}} is not a valid attribute name'
+    }
+  },
+  /** @param {RuleContext} context */
+  create(context) {
+    /**
+     * @param {string | VIdentifier} key
+     * @return {string}
+     */
+    const getName = (key) => {
+      if (typeof key === 'string') {
+        return key
+      }
+
+      return key.name
+    }
+
+    return utils.defineTemplateBodyVisitor(context, {
+      VAttribute(node) {
+        const name = getName(node.key.name)
+
+        if (!/^[_:a-zA-Z][_:.\-a-zA-Z0-9]+/.test(name)) {
+          context.report({
+            node,
+            messageId: 'unexpected',
+            data: {
+              name
+            }
+          })
+        }
+      }
+    })
+  }
+}
diff --git a/tests/lib/rules/no-invalid-attribute-name.js b/tests/lib/rules/no-invalid-attribute-name.js
new file mode 100644
index 000000000..9d6d584cb
--- /dev/null
+++ b/tests/lib/rules/no-invalid-attribute-name.js
@@ -0,0 +1,158 @@
+/**
+ * @author *****your name*****
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+const RuleTester = require('eslint').RuleTester
+const rule = require('../../../lib/rules/no-invalid-attribute-name')
+
+const tester = new RuleTester({
+  parser: require.resolve('vue-eslint-parser'),
+  parserOptions: {
+    ecmaVersion: 2020,
+    sourceType: 'module'
+  }
+})
+
+tester.run('no-invalid-attribute-name', rule, {
+  valid: [
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <div>
+          <p foo>
+            {{ content }}
+          </p>
+        </div>
+      </template>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <div>
+          <p foo="bar">
+            {{ content }}
+          </p>
+        </div>
+      </template>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <div>
+          <p foo-bar>
+            {{ content }}
+          </p>
+        </div>
+      </template>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <div>
+          <p _foo-bar>
+            {{ content }}
+          </p>
+        </div>
+      </template>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <div>
+          <p :foo-bar>
+            {{ content }}
+          </p>
+        </div>
+      </template>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <div>
+          <p foo.bar>
+            {{ content }}
+          </p>
+        </div>
+      </template>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <div>
+          <p quux-.9>
+            {{ content }}
+          </p>
+        </div>
+      </template>
+      `
+    }
+  ],
+  invalid: [
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <div>
+          <p 0abc>
+            {{ content }}
+          </p>
+        </div>
+      </template>
+      `,
+      errors: [
+        {
+          message: '0abc is not a valid attribute name'
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <div>
+          <p -def>
+            {{ content }}
+          </p>
+        </div>
+      </template>
+      `,
+      errors: [
+        {
+          message: '-def is not a valid attribute name'
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <div>
+          <p !ghi>
+            {{ content }}
+          </p>
+        </div>
+      </template>
+      `,
+      errors: [
+        {
+          message: '!ghi is not a valid attribute name'
+        }
+      ]
+    }
+  ]
+})

From 05c60a08a16f14442581b52a481f801f40b9db43 Mon Sep 17 00:00:00 2001
From: Douglas Wade <douglas.b.wade@gmail.com>
Date: Sat, 16 Apr 2022 00:46:14 -0700
Subject: [PATCH 02/19] Remove stray newline

---
 docs/rules/README.md | 1 -
 1 file changed, 1 deletion(-)

diff --git a/docs/rules/README.md b/docs/rules/README.md
index a872a23c6..aa5f35a0e 100644
--- a/docs/rules/README.md
+++ b/docs/rules/README.md
@@ -12,7 +12,6 @@ sidebarDepth: 0
   :bulb: Indicates that some problems reported by the rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
 :::
 
-
 ## Base Rules (Enabling Correct ESLint Parsing)
 
 Enforce all the rules in this category, as well as all higher priority rules, with:

From 34c2976ae42efd39860af338f950fed7749f096e Mon Sep 17 00:00:00 2001
From: Douglas Wade <douglas.b.wade@gmail.com>
Date: Sat, 16 Apr 2022 14:39:53 -0700
Subject: [PATCH 03/19] Apply suggestions from code review

Co-authored-by: Flo Edelmann <florian-edelmann@online.de>
---
 docs/rules/no-invalid-attribute-name.md      |  2 +-
 lib/rules/no-invalid-attribute-name.js       | 11 +++--------
 tests/lib/rules/no-invalid-attribute-name.js | 10 +---------
 3 files changed, 5 insertions(+), 18 deletions(-)

diff --git a/docs/rules/no-invalid-attribute-name.md b/docs/rules/no-invalid-attribute-name.md
index 405658878..dbba62746 100644
--- a/docs/rules/no-invalid-attribute-name.md
+++ b/docs/rules/no-invalid-attribute-name.md
@@ -12,7 +12,7 @@ description: require the attributes to match the imported component name
 
 ## :book: Rule Details
 
-This rule detects invalid html attributes.
+This rule detects invalid HTML attributes.
 
 <eslint-code-block :rules="{'vue/no-invalid-attribute-name': ['error']}">
 
diff --git a/lib/rules/no-invalid-attribute-name.js b/lib/rules/no-invalid-attribute-name.js
index 75f802c26..bfbe0a440 100644
--- a/lib/rules/no-invalid-attribute-name.js
+++ b/lib/rules/no-invalid-attribute-name.js
@@ -11,7 +11,7 @@ module.exports = {
     type: 'problem',
     docs: {
       description:
-        'require the attributes to match the imported component name',
+        'report invalid attribute names',
       categories: undefined,
       url: 'https://eslint.vuejs.org/rules/no-invalid-attribute-name.html'
     },
@@ -27,15 +27,10 @@ module.exports = {
      * @param {string | VIdentifier} key
      * @return {string}
      */
-    const getName = (key) => {
-      if (typeof key === 'string') {
-        return key
-      }
-
-      return key.name
-    }
+    const getName = (key) => (typeof key === 'string' ? key : key.name)
 
     return utils.defineTemplateBodyVisitor(context, {
+      /** @param {VAttribute} node */
       VAttribute(node) {
         const name = getName(node.key.name)
 
diff --git a/tests/lib/rules/no-invalid-attribute-name.js b/tests/lib/rules/no-invalid-attribute-name.js
index 9d6d584cb..249b7f1e5 100644
--- a/tests/lib/rules/no-invalid-attribute-name.js
+++ b/tests/lib/rules/no-invalid-attribute-name.js
@@ -19,15 +19,7 @@ tester.run('no-invalid-attribute-name', rule, {
   valid: [
     {
       filename: 'test.vue',
-      code: `
-      <template>
-        <div>
-          <p foo>
-            {{ content }}
-          </p>
-        </div>
-      </template>
-      `
+      code: '<template><p foo /></template>'
     },
     {
       filename: 'test.vue',

From 01ed0d7ae907ff3b801f167124703dad39877882 Mon Sep 17 00:00:00 2001
From: Douglas Wade <douglas.b.wade@gmail.com>
Date: Thu, 21 Apr 2022 00:08:59 -0700
Subject: [PATCH 04/19] #1373 Use xml-name-validator

---
 lib/rules/no-invalid-attribute-name.js       | 5 +++--
 package.json                                 | 3 ++-
 tests/lib/rules/no-invalid-attribute-name.js | 6 +++---
 3 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/lib/rules/no-invalid-attribute-name.js b/lib/rules/no-invalid-attribute-name.js
index 75f802c26..55a2b9b72 100644
--- a/lib/rules/no-invalid-attribute-name.js
+++ b/lib/rules/no-invalid-attribute-name.js
@@ -5,6 +5,7 @@
 'use strict'
 
 const utils = require('../utils')
+const xnv = require('xml-name-validator')
 
 module.exports = {
   meta: {
@@ -18,7 +19,7 @@ module.exports = {
     fixable: null,
     schema: [],
     messages: {
-      unexpected: '{{name}} is not a valid attribute name'
+      unexpected: 'Attribute name {{name}} is not valid.'
     }
   },
   /** @param {RuleContext} context */
@@ -39,7 +40,7 @@ module.exports = {
       VAttribute(node) {
         const name = getName(node.key.name)
 
-        if (!/^[_:a-zA-Z][_:.\-a-zA-Z0-9]+/.test(name)) {
+        if (!xnv.name(name)) {
           context.report({
             node,
             messageId: 'unexpected',
diff --git a/package.json b/package.json
index 9ddbb72a4..7e9c1217b 100644
--- a/package.json
+++ b/package.json
@@ -59,7 +59,8 @@
     "nth-check": "^2.0.1",
     "postcss-selector-parser": "^6.0.9",
     "semver": "^7.3.5",
-    "vue-eslint-parser": "^8.0.1"
+    "vue-eslint-parser": "^8.0.1",
+    "xml-name-validator": "^4.0.0"
   },
   "devDependencies": {
     "@types/eslint": "^7.28.1",
diff --git a/tests/lib/rules/no-invalid-attribute-name.js b/tests/lib/rules/no-invalid-attribute-name.js
index 9d6d584cb..37d50099b 100644
--- a/tests/lib/rules/no-invalid-attribute-name.js
+++ b/tests/lib/rules/no-invalid-attribute-name.js
@@ -116,7 +116,7 @@ tester.run('no-invalid-attribute-name', rule, {
       `,
       errors: [
         {
-          message: '0abc is not a valid attribute name'
+          message: 'Attribute name 0abc is not valid.'
         }
       ]
     },
@@ -133,7 +133,7 @@ tester.run('no-invalid-attribute-name', rule, {
       `,
       errors: [
         {
-          message: '-def is not a valid attribute name'
+          message: 'Attribute name -def is not valid.'
         }
       ]
     },
@@ -150,7 +150,7 @@ tester.run('no-invalid-attribute-name', rule, {
       `,
       errors: [
         {
-          message: '!ghi is not a valid attribute name'
+          message: 'Attribute name !ghi is not valid.'
         }
       ]
     }

From 5004cb8ef21e9ec3f6037bbbdc3d8b60dda30754 Mon Sep 17 00:00:00 2001
From: Douglas Wade <douglas.b.wade@gmail.com>
Date: Thu, 21 Apr 2022 00:14:13 -0700
Subject: [PATCH 05/19] Fix linting error

---
 docs/rules/README.md                    | 3 ++-
 docs/rules/no-invalid-attribute-name.md | 4 ++--
 lib/rules/no-invalid-attribute-name.js  | 3 +--
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/docs/rules/README.md b/docs/rules/README.md
index aa5f35a0e..5e5b98818 100644
--- a/docs/rules/README.md
+++ b/docs/rules/README.md
@@ -12,6 +12,7 @@ sidebarDepth: 0
   :bulb: Indicates that some problems reported by the rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
 :::
 
+
 ## Base Rules (Enabling Correct ESLint Parsing)
 
 Enforce all the rules in this category, as well as all higher priority rules, with:
@@ -326,7 +327,7 @@ For example:
 | [vue/no-duplicate-attr-inheritance](./no-duplicate-attr-inheritance.md) | enforce `inheritAttrs` to be set to `false` when using `v-bind="$attrs"` |  |
 | [vue/no-empty-component-block](./no-empty-component-block.md) | disallow the `<template>` `<script>` `<style>` block to be empty |  |
 | [vue/no-expose-after-await](./no-expose-after-await.md) | disallow asynchronously registered `expose` |  |
-| [vue/no-invalid-attribute-name](./no-invalid-attribute-name.md) | require the attributes to match the imported component name |  |
+| [vue/no-invalid-attribute-name](./no-invalid-attribute-name.md) | require valid attribute names |  |
 | [vue/no-invalid-model-keys](./no-invalid-model-keys.md) | require valid keys in model option |  |
 | [vue/no-multiple-objects-in-class](./no-multiple-objects-in-class.md) | disallow to pass multiple objects into array to class |  |
 | [vue/no-potential-component-option-typo](./no-potential-component-option-typo.md) | disallow a potential typo in your component property | :bulb: |
diff --git a/docs/rules/no-invalid-attribute-name.md b/docs/rules/no-invalid-attribute-name.md
index dbba62746..811d92322 100644
--- a/docs/rules/no-invalid-attribute-name.md
+++ b/docs/rules/no-invalid-attribute-name.md
@@ -2,11 +2,11 @@
 pageClass: rule-details
 sidebarDepth: 0
 title: vue/no-invalid-attribute-name
-description: require the attributes to match the imported component name
+description: require valid attribute names
 ---
 # vue/no-invalid-attribute-name
 
-> require the attributes to match the imported component name
+> require valid attribute names
 
 - :exclamation: <badge text="This rule has not been released yet." vertical="middle" type="error"> ***This rule has not been released yet.*** </badge>
 
diff --git a/lib/rules/no-invalid-attribute-name.js b/lib/rules/no-invalid-attribute-name.js
index b0c16254c..42faf76f7 100644
--- a/lib/rules/no-invalid-attribute-name.js
+++ b/lib/rules/no-invalid-attribute-name.js
@@ -11,8 +11,7 @@ module.exports = {
   meta: {
     type: 'problem',
     docs: {
-      description:
-        'report invalid attribute names',
+      description: 'require valid attribute names',
       categories: undefined,
       url: 'https://eslint.vuejs.org/rules/no-invalid-attribute-name.html'
     },

From 770a2cffc35a1ed53fa340d0337bbf9ce40587c5 Mon Sep 17 00:00:00 2001
From: Douglas Wade <douglas.b.wade@gmail.com>
Date: Thu, 21 Apr 2022 00:18:42 -0700
Subject: [PATCH 06/19] remove stray newline

---
 docs/rules/README.md | 1 -
 1 file changed, 1 deletion(-)

diff --git a/docs/rules/README.md b/docs/rules/README.md
index 5e5b98818..89418b4dd 100644
--- a/docs/rules/README.md
+++ b/docs/rules/README.md
@@ -12,7 +12,6 @@ sidebarDepth: 0
   :bulb: Indicates that some problems reported by the rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
 :::
 
-
 ## Base Rules (Enabling Correct ESLint Parsing)
 
 Enforce all the rules in this category, as well as all higher priority rules, with:

From 976624573d0806773d5bb55712215c371e19d4d3 Mon Sep 17 00:00:00 2001
From: Douglas Wade <douglas.b.wade@gmail.com>
Date: Thu, 21 Apr 2022 00:24:35 -0700
Subject: [PATCH 07/19] refactor test code

---
 tests/lib/rules/no-invalid-attribute-name.js | 90 ++------------------
 1 file changed, 9 insertions(+), 81 deletions(-)

diff --git a/tests/lib/rules/no-invalid-attribute-name.js b/tests/lib/rules/no-invalid-attribute-name.js
index b0ce54cd5..d742567f5 100644
--- a/tests/lib/rules/no-invalid-attribute-name.js
+++ b/tests/lib/rules/no-invalid-attribute-name.js
@@ -23,89 +23,33 @@ tester.run('no-invalid-attribute-name', rule, {
     },
     {
       filename: 'test.vue',
-      code: `
-      <template>
-        <div>
-          <p foo="bar">
-            {{ content }}
-          </p>
-        </div>
-      </template>
-      `
+      code: `<template><p foo="bar" /></template>`
     },
     {
       filename: 'test.vue',
-      code: `
-      <template>
-        <div>
-          <p foo-bar>
-            {{ content }}
-          </p>
-        </div>
-      </template>
-      `
+      code: `<template><p foo-bar /></template>`
     },
     {
       filename: 'test.vue',
-      code: `
-      <template>
-        <div>
-          <p _foo-bar>
-            {{ content }}
-          </p>
-        </div>
-      </template>
-      `
+      code: `<template><p _foo-bar /></template>`
     },
     {
       filename: 'test.vue',
-      code: `
-      <template>
-        <div>
-          <p :foo-bar>
-            {{ content }}
-          </p>
-        </div>
-      </template>
-      `
+      code: `<template><p :foo-bar /></template>`
     },
     {
       filename: 'test.vue',
-      code: `
-      <template>
-        <div>
-          <p foo.bar>
-            {{ content }}
-          </p>
-        </div>
-      </template>
-      `
+      code: `<template><p foo.bar /></template>`
     },
     {
       filename: 'test.vue',
-      code: `
-      <template>
-        <div>
-          <p quux-.9>
-            {{ content }}
-          </p>
-        </div>
-      </template>
-      `
+      code: `<template><p quux-.9 /></template>`
     }
   ],
   invalid: [
     {
       filename: 'test.vue',
-      code: `
-      <template>
-        <div>
-          <p 0abc>
-            {{ content }}
-          </p>
-        </div>
-      </template>
-      `,
+      code: `<template><p 0abc /></template>`,
       errors: [
         {
           message: 'Attribute name 0abc is not valid.'
@@ -114,15 +58,7 @@ tester.run('no-invalid-attribute-name', rule, {
     },
     {
       filename: 'test.vue',
-      code: `
-      <template>
-        <div>
-          <p -def>
-            {{ content }}
-          </p>
-        </div>
-      </template>
-      `,
+      code: `<template><p -def></template>`,
       errors: [
         {
           message: 'Attribute name -def is not valid.'
@@ -131,15 +67,7 @@ tester.run('no-invalid-attribute-name', rule, {
     },
     {
       filename: 'test.vue',
-      code: `
-      <template>
-        <div>
-          <p !ghi>
-            {{ content }}
-          </p>
-        </div>
-      </template>
-      `,
+      code: `<template><p !ghi /></template>`,
       errors: [
         {
           message: 'Attribute name !ghi is not valid.'

From f4e7ab96d2b494c583da88ffc30a7edbfd19f9f0 Mon Sep 17 00:00:00 2001
From: Douglas Wade <douglas.b.wade@gmail.com>
Date: Thu, 21 Apr 2022 00:29:05 -0700
Subject: [PATCH 08/19] Update lib/rules/no-invalid-attribute-name.js

Co-authored-by: Flo Edelmann <florian-edelmann@online.de>
---
 lib/rules/no-invalid-attribute-name.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/lib/rules/no-invalid-attribute-name.js b/lib/rules/no-invalid-attribute-name.js
index 42faf76f7..b5c92cbdc 100644
--- a/lib/rules/no-invalid-attribute-name.js
+++ b/lib/rules/no-invalid-attribute-name.js
@@ -30,6 +30,7 @@ module.exports = {
     const getName = (key) => (typeof key === 'string' ? key : key.name)
 
     return utils.defineTemplateBodyVisitor(context, {
+      /** @param {VAttribute} node */
       /** @param {VAttribute} node */
       VAttribute(node) {
         const name = getName(node.key.name)

From 195984f5aef261254da9ce3f2cd159434d30d1b3 Mon Sep 17 00:00:00 2001
From: Douglas Wade <douglas.b.wade@gmail.com>
Date: Thu, 21 Apr 2022 00:29:54 -0700
Subject: [PATCH 09/19] fix bad commit from github ui

---
 lib/rules/no-invalid-attribute-name.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/lib/rules/no-invalid-attribute-name.js b/lib/rules/no-invalid-attribute-name.js
index b5c92cbdc..42faf76f7 100644
--- a/lib/rules/no-invalid-attribute-name.js
+++ b/lib/rules/no-invalid-attribute-name.js
@@ -30,7 +30,6 @@ module.exports = {
     const getName = (key) => (typeof key === 'string' ? key : key.name)
 
     return utils.defineTemplateBodyVisitor(context, {
-      /** @param {VAttribute} node */
       /** @param {VAttribute} node */
       VAttribute(node) {
         const name = getName(node.key.name)

From 0027adf403a24d09bfbe43cf17d6d48656d5b203 Mon Sep 17 00:00:00 2001
From: Douglas Wade <douglas.b.wade@gmail.com>
Date: Thu, 21 Apr 2022 00:46:48 -0700
Subject: [PATCH 10/19] fix typechecking error

---
 lib/rules/no-invalid-attribute-name.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/rules/no-invalid-attribute-name.js b/lib/rules/no-invalid-attribute-name.js
index 42faf76f7..e82d7ec84 100644
--- a/lib/rules/no-invalid-attribute-name.js
+++ b/lib/rules/no-invalid-attribute-name.js
@@ -30,7 +30,7 @@ module.exports = {
     const getName = (key) => (typeof key === 'string' ? key : key.name)
 
     return utils.defineTemplateBodyVisitor(context, {
-      /** @param {VAttribute} node */
+      /** @param {VDirective | VAttribute} node */
       VAttribute(node) {
         const name = getName(node.key.name)
 

From 8850c3837a215871bd6ff2808a07b5d1898d0883 Mon Sep 17 00:00:00 2001
From: Douglas Wade <douglas.b.wade@gmail.com>
Date: Mon, 2 May 2022 20:59:59 -0700
Subject: [PATCH 11/19] Respond to PR feedback

---
 lib/rules/no-invalid-attribute-name.js       |  4 ++
 tests/lib/rules/no-invalid-attribute-name.js | 44 ++++++++++++++++++--
 2 files changed, 45 insertions(+), 3 deletions(-)

diff --git a/lib/rules/no-invalid-attribute-name.js b/lib/rules/no-invalid-attribute-name.js
index e82d7ec84..34ddbbf63 100644
--- a/lib/rules/no-invalid-attribute-name.js
+++ b/lib/rules/no-invalid-attribute-name.js
@@ -32,6 +32,10 @@ module.exports = {
     return utils.defineTemplateBodyVisitor(context, {
       /** @param {VDirective | VAttribute} node */
       VAttribute(node) {
+        if (utils.isCustomComponent(node.parent.parent)) {
+          return
+        }
+
         const name = getName(node.key.name)
 
         if (!xnv.name(name)) {
diff --git a/tests/lib/rules/no-invalid-attribute-name.js b/tests/lib/rules/no-invalid-attribute-name.js
index d742567f5..1359d8d2c 100644
--- a/tests/lib/rules/no-invalid-attribute-name.js
+++ b/tests/lib/rules/no-invalid-attribute-name.js
@@ -44,6 +44,38 @@ tester.run('no-invalid-attribute-name', rule, {
     {
       filename: 'test.vue',
       code: `<template><p quux-.9 /></template>`
+    },
+    {
+      filename: 'test.vue',
+      code: `<template><MyComponent 0abc="foo" /></template>`
+    },
+    {
+      filename: 'test.vue',
+      code: `<template><MyComponent :0abc="foo" /></template>`
+    },
+    {
+      filename: 'test.vue',
+      code: `<template><a :href="url"> ... </a></template>`
+    },
+    {
+      filename: 'test.vue',
+      code: `<template><div v-bind:class="{ active: isActive }"></div></template>`
+    },
+    {
+      filename: 'test.vue',
+      code: `<template><p v-if="seen">Now you see me</p></template>`
+    },
+    {
+      filename: 'test.vue',
+      code: `<a v-on:[eventName]="doSomething"> ... </a>`
+    },
+    {
+      filename: 'test.vue',
+      code: `<form v-on:submit.prevent="onSubmit"> ... </form>`
+    },
+    {
+      filename: 'test.vue',
+      code: `<a @[event]="doSomething"> ... </a>`
     }
   ],
   invalid: [
@@ -52,7 +84,9 @@ tester.run('no-invalid-attribute-name', rule, {
       code: `<template><p 0abc /></template>`,
       errors: [
         {
-          message: 'Attribute name 0abc is not valid.'
+          message: 'Attribute name 0abc is not valid.',
+          line: 1,
+          column: 14
         }
       ]
     },
@@ -61,7 +95,9 @@ tester.run('no-invalid-attribute-name', rule, {
       code: `<template><p -def></template>`,
       errors: [
         {
-          message: 'Attribute name -def is not valid.'
+          message: 'Attribute name -def is not valid.',
+          line: 1,
+          column: 14
         }
       ]
     },
@@ -70,7 +106,9 @@ tester.run('no-invalid-attribute-name', rule, {
       code: `<template><p !ghi /></template>`,
       errors: [
         {
-          message: 'Attribute name !ghi is not valid.'
+          message: 'Attribute name !ghi is not valid.',
+          line: 1,
+          column: 14
         }
       ]
     }

From d31ee8ddbf8ea1810c9ddba5d5f2f9497a1d0a16 Mon Sep 17 00:00:00 2001
From: Douglas Wade <douglas.b.wade@gmail.com>
Date: Mon, 2 May 2022 21:02:14 -0700
Subject: [PATCH 12/19] Include the added types in package.json

---
 lib/rules/no-invalid-attribute-name.js | 2 +-
 package.json                           | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/lib/rules/no-invalid-attribute-name.js b/lib/rules/no-invalid-attribute-name.js
index 34ddbbf63..70cf585b5 100644
--- a/lib/rules/no-invalid-attribute-name.js
+++ b/lib/rules/no-invalid-attribute-name.js
@@ -31,7 +31,7 @@ module.exports = {
 
     return utils.defineTemplateBodyVisitor(context, {
       /** @param {VDirective | VAttribute} node */
-      VAttribute(node) {
+      'VAttribute[directive=false]'(node) {
         if (utils.isCustomComponent(node.parent.parent)) {
           return
         }
diff --git a/package.json b/package.json
index 7e9c1217b..7279cc481 100644
--- a/package.json
+++ b/package.json
@@ -54,6 +54,7 @@
     "eslint": "^6.2.0 || ^7.0.0 || ^8.0.0"
   },
   "dependencies": {
+    "@types/xml-name-validator": "^4.0.0",
     "eslint-utils": "^3.0.0",
     "natural-compare": "^1.4.0",
     "nth-check": "^2.0.1",

From 8e5758a4e050ca663fc703c3557d3df3ebbcec46 Mon Sep 17 00:00:00 2001
From: Douglas Wade <douglas.b.wade@gmail.com>
Date: Thu, 5 May 2022 21:30:57 -0700
Subject: [PATCH 13/19] check v-bind directives

---
 lib/rules/no-invalid-attribute-name.js       | 23 +++++++++++++--
 package.json                                 |  2 +-
 tests/lib/rules/no-invalid-attribute-name.js | 30 ++++++++++++++++++++
 3 files changed, 51 insertions(+), 4 deletions(-)

diff --git a/lib/rules/no-invalid-attribute-name.js b/lib/rules/no-invalid-attribute-name.js
index 70cf585b5..619db178c 100644
--- a/lib/rules/no-invalid-attribute-name.js
+++ b/lib/rules/no-invalid-attribute-name.js
@@ -18,7 +18,8 @@ module.exports = {
     fixable: null,
     schema: [],
     messages: {
-      unexpected: 'Attribute name {{name}} is not valid.'
+      attribute: 'Attribute name {{name}} is not valid.',
+      directive: 'Directive name {{name}} is not valid.'
     }
   },
   /** @param {RuleContext} context */
@@ -31,17 +32,33 @@ module.exports = {
 
     return utils.defineTemplateBodyVisitor(context, {
       /** @param {VDirective | VAttribute} node */
-      'VAttribute[directive=false]'(node) {
+      VAttribute(node) {
         if (utils.isCustomComponent(node.parent.parent)) {
           return
         }
 
         const name = getName(node.key.name)
 
+        if (
+          node.directive &&
+          name === 'bind' &&
+          node.key.argument &&
+          node.key.argument.type === 'VIdentifier' &&
+          !xnv.name(node.key.argument.name)
+        ) {
+          context.report({
+            node,
+            messageId: 'directive',
+            data: {
+              name: node.key.argument.name
+            }
+          })
+        }
+
         if (!xnv.name(name)) {
           context.report({
             node,
-            messageId: 'unexpected',
+            messageId: 'attribute',
             data: {
               name
             }
diff --git a/package.json b/package.json
index ec526ab38..948f48a9f 100644
--- a/package.json
+++ b/package.json
@@ -54,7 +54,6 @@
     "eslint": "^6.2.0 || ^7.0.0 || ^8.0.0"
   },
   "dependencies": {
-    "@types/xml-name-validator": "^4.0.0",
     "eslint-utils": "^3.0.0",
     "natural-compare": "^1.4.0",
     "nth-check": "^2.0.1",
@@ -69,6 +68,7 @@
     "@types/natural-compare": "^1.4.0",
     "@types/node": "^13.13.5",
     "@types/semver": "^7.2.0",
+    "@types/xml-name-validator": "^4.0.0",
     "@typescript-eslint/parser": "^5.5.0",
     "@vuepress/plugin-pwa": "^1.4.1",
     "acorn": "^8.5.0",
diff --git a/tests/lib/rules/no-invalid-attribute-name.js b/tests/lib/rules/no-invalid-attribute-name.js
index 1359d8d2c..340fe6c4e 100644
--- a/tests/lib/rules/no-invalid-attribute-name.js
+++ b/tests/lib/rules/no-invalid-attribute-name.js
@@ -76,6 +76,14 @@ tester.run('no-invalid-attribute-name', rule, {
     {
       filename: 'test.vue',
       code: `<a @[event]="doSomething"> ... </a>`
+    },
+    {
+      filename: 'test.vue',
+      code: `<template><div v-bind:href="..."></div></template>`
+    },
+    {
+      filename: 'test.vue',
+      code: `<template><div :href="..."></div></template>`
     }
   ],
   invalid: [
@@ -111,6 +119,28 @@ tester.run('no-invalid-attribute-name', rule, {
           column: 14
         }
       ]
+    },
+    {
+      filename: 'test.vue',
+      code: `<template><p v-bind:0abc=""></template>`,
+      errors: [
+        {
+          message: 'Directive name 0abc is not valid.',
+          line: 1,
+          column: 14
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `<template><p :0abc="..." /></template>`,
+      errors: [
+        {
+          message: 'Directive name 0abc is not valid.',
+          line: 1,
+          column: 14
+        }
+      ]
     }
   ]
 })

From 5c71916c9c40d9ea2229b10416929f97d8ef0562 Mon Sep 17 00:00:00 2001
From: Douglas Wade <douglas.b.wade@gmail.com>
Date: Sun, 8 May 2022 12:32:46 -0700
Subject: [PATCH 14/19] Update tests/lib/rules/no-invalid-attribute-name.js

Co-authored-by: Flo Edelmann <florian-edelmann@online.de>
---
 tests/lib/rules/no-invalid-attribute-name.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/tests/lib/rules/no-invalid-attribute-name.js b/tests/lib/rules/no-invalid-attribute-name.js
index 340fe6c4e..8ef41a4c8 100644
--- a/tests/lib/rules/no-invalid-attribute-name.js
+++ b/tests/lib/rules/no-invalid-attribute-name.js
@@ -79,11 +79,11 @@ tester.run('no-invalid-attribute-name', rule, {
     },
     {
       filename: 'test.vue',
-      code: `<template><div v-bind:href="..."></div></template>`
+      code: `<template><div v-bind="..."></div></template>`
     },
     {
       filename: 'test.vue',
-      code: `<template><div :href="..."></div></template>`
+      code: `<template><div v-0abc="..."></div></template>`
     }
   ],
   invalid: [

From bed2351c72c25ab1cd620a98e61bdd48aed2fca5 Mon Sep 17 00:00:00 2001
From: Douglas Wade <douglas.b.wade@gmail.com>
Date: Sun, 8 May 2022 12:47:37 -0700
Subject: [PATCH 15/19] Fix failing unit test

---
 lib/rules/no-invalid-attribute-name.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/rules/no-invalid-attribute-name.js b/lib/rules/no-invalid-attribute-name.js
index 619db178c..50a015fe6 100644
--- a/lib/rules/no-invalid-attribute-name.js
+++ b/lib/rules/no-invalid-attribute-name.js
@@ -55,7 +55,7 @@ module.exports = {
           })
         }
 
-        if (!xnv.name(name)) {
+        if (!node.directive && !xnv.name(name)) {
           context.report({
             node,
             messageId: 'attribute',

From 70ef9ed58d00cabd5e6256f26252ab4e9b0bad5e Mon Sep 17 00:00:00 2001
From: Yosuke Ota <otameshiyo23@gmail.com>
Date: Tue, 17 May 2022 19:25:50 +0900
Subject: [PATCH 16/19] Update lib/rules/no-invalid-attribute-name.js

---
 lib/rules/no-invalid-attribute-name.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/lib/rules/no-invalid-attribute-name.js b/lib/rules/no-invalid-attribute-name.js
index 50a015fe6..f4f18ffbd 100644
--- a/lib/rules/no-invalid-attribute-name.js
+++ b/lib/rules/no-invalid-attribute-name.js
@@ -18,8 +18,7 @@ module.exports = {
     fixable: null,
     schema: [],
     messages: {
-      attribute: 'Attribute name {{name}} is not valid.',
-      directive: 'Directive name {{name}} is not valid.'
+      attribute: 'Attribute name {{name}} is not valid.'
     }
   },
   /** @param {RuleContext} context */

From c91073f7e2de73b0decafd26fd6fd8e7e4f6824d Mon Sep 17 00:00:00 2001
From: Yosuke Ota <otameshiyo23@gmail.com>
Date: Tue, 17 May 2022 19:25:56 +0900
Subject: [PATCH 17/19] Update lib/rules/no-invalid-attribute-name.js

---
 lib/rules/no-invalid-attribute-name.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/rules/no-invalid-attribute-name.js b/lib/rules/no-invalid-attribute-name.js
index f4f18ffbd..8fd3c713a 100644
--- a/lib/rules/no-invalid-attribute-name.js
+++ b/lib/rules/no-invalid-attribute-name.js
@@ -47,7 +47,7 @@ module.exports = {
         ) {
           context.report({
             node,
-            messageId: 'directive',
+            messageId: 'attribute',
             data: {
               name: node.key.argument.name
             }

From c610a5f67a9facfc3a5770214706f97e3c15712a Mon Sep 17 00:00:00 2001
From: Yosuke Ota <otameshiyo23@gmail.com>
Date: Tue, 17 May 2022 19:26:04 +0900
Subject: [PATCH 18/19] Update tests/lib/rules/no-invalid-attribute-name.js

---
 tests/lib/rules/no-invalid-attribute-name.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/tests/lib/rules/no-invalid-attribute-name.js b/tests/lib/rules/no-invalid-attribute-name.js
index 8ef41a4c8..06ec8a3ce 100644
--- a/tests/lib/rules/no-invalid-attribute-name.js
+++ b/tests/lib/rules/no-invalid-attribute-name.js
@@ -125,7 +125,7 @@ tester.run('no-invalid-attribute-name', rule, {
       code: `<template><p v-bind:0abc=""></template>`,
       errors: [
         {
-          message: 'Directive name 0abc is not valid.',
+          message: 'Attribute name 0abc is not valid.',
           line: 1,
           column: 14
         }

From 1a0834bf691d715e2272612ba59f6efc3ac2b62d Mon Sep 17 00:00:00 2001
From: Yosuke Ota <otameshiyo23@gmail.com>
Date: Tue, 17 May 2022 19:26:10 +0900
Subject: [PATCH 19/19] Update tests/lib/rules/no-invalid-attribute-name.js

---
 tests/lib/rules/no-invalid-attribute-name.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/tests/lib/rules/no-invalid-attribute-name.js b/tests/lib/rules/no-invalid-attribute-name.js
index 06ec8a3ce..09c07cc23 100644
--- a/tests/lib/rules/no-invalid-attribute-name.js
+++ b/tests/lib/rules/no-invalid-attribute-name.js
@@ -136,7 +136,7 @@ tester.run('no-invalid-attribute-name', rule, {
       code: `<template><p :0abc="..." /></template>`,
       errors: [
         {
-          message: 'Directive name 0abc is not valid.',
+          message: 'Attribute name 0abc is not valid.',
           line: 1,
           column: 14
         }