From e5e0ab29c77ab07447e249ae8b2d2901a1371b0b Mon Sep 17 00:00:00 2001
From: yosuke ota <otameshiyo23@gmail.com>
Date: Wed, 27 Oct 2021 21:17:46 +0900
Subject: [PATCH 1/2] Add  `vue/no-reserved-props` rule

---
 docs/rules/README.md                          |   2 +
 docs/rules/no-reserved-props.md               |  52 ++
 lib/configs/essential.js                      |   6 +
 lib/configs/vue3-essential.js                 |   1 +
 lib/index.js                                  |   1 +
 lib/rules/no-reserved-props.js                |  97 ++++
 lib/utils/ts-ast-utils.js                     |   6 +-
 tests/lib/rules/no-reserved-props.js          | 523 ++++++++++++++++++
 tools/update-lib-configs.js                   |  14 +-
 typings/eslint-plugin-vue/util-types/utils.ts |   2 +-
 10 files changed, 697 insertions(+), 7 deletions(-)
 create mode 100644 docs/rules/no-reserved-props.md
 create mode 100644 lib/rules/no-reserved-props.js
 create mode 100644 tests/lib/rules/no-reserved-props.js

diff --git a/docs/rules/README.md b/docs/rules/README.md
index 04d9046c1..7762e48eb 100644
--- a/docs/rules/README.md
+++ b/docs/rules/README.md
@@ -71,6 +71,7 @@ Enforce all the rules in this category, as well as all higher priority rules, wi
 | [vue/no-parsing-error](./no-parsing-error.md) | disallow parsing errors in `<template>` |  |
 | [vue/no-ref-as-operand](./no-ref-as-operand.md) | disallow use of value wrapped by `ref()` (Composition API) as an operand | :wrench: |
 | [vue/no-reserved-keys](./no-reserved-keys.md) | disallow overwriting reserved keys |  |
+| [vue/no-reserved-props](./no-reserved-props.md) | disallow reserved names in props |  |
 | [vue/no-setup-props-destructure](./no-setup-props-destructure.md) | disallow destructuring of `props` passed to `setup` |  |
 | [vue/no-shared-component-data](./no-shared-component-data.md) | enforce component's data property to be a function | :wrench: |
 | [vue/no-side-effects-in-computed-properties](./no-side-effects-in-computed-properties.md) | disallow side effects in computed properties |  |
@@ -195,6 +196,7 @@ Enforce all the rules in this category, as well as all higher priority rules, wi
 | [vue/no-mutating-props](./no-mutating-props.md) | disallow mutation of component props |  |
 | [vue/no-parsing-error](./no-parsing-error.md) | disallow parsing errors in `<template>` |  |
 | [vue/no-reserved-keys](./no-reserved-keys.md) | disallow overwriting reserved keys |  |
+| [vue/no-reserved-props](./no-reserved-props.md) | disallow reserved names in props |  |
 | [vue/no-shared-component-data](./no-shared-component-data.md) | enforce component's data property to be a function | :wrench: |
 | [vue/no-side-effects-in-computed-properties](./no-side-effects-in-computed-properties.md) | disallow side effects in computed properties |  |
 | [vue/no-template-key](./no-template-key.md) | disallow `key` attribute on `<template>` |  |
diff --git a/docs/rules/no-reserved-props.md b/docs/rules/no-reserved-props.md
new file mode 100644
index 000000000..9cec8c445
--- /dev/null
+++ b/docs/rules/no-reserved-props.md
@@ -0,0 +1,52 @@
+---
+pageClass: rule-details
+sidebarDepth: 0
+title: vue/no-reserved-props
+description: disallow reserved names in props
+---
+# vue/no-reserved-props
+
+> disallow reserved names in props
+
+- :exclamation: <badge text="This rule has not been released yet." vertical="middle" type="error"> ***This rule has not been released yet.*** </badge>
+- :gear: This rule is included in all of `"plugin:vue/vue3-essential"`, `"plugin:vue/essential"`, `"plugin:vue/vue3-strongly-recommended"`, `"plugin:vue/strongly-recommended"`, `"plugin:vue/vue3-recommended"` and `"plugin:vue/recommended"`.
+
+## :book: Rule Details
+
+This rule disallow reserved names to be used in props.
+
+<eslint-code-block :rules="{'vue/no-reserved-props': ['error']}">
+
+```vue
+<script>
+export default {
+  props: {
+    /* ✗ BAD */
+    ref: String,
+    key: String,
+    /* ✓ GOOD */
+    foo: String,
+    bar: String,
+  }
+}
+</script>
+```
+
+</eslint-code-block>
+
+## :wrench: Options
+
+```json
+{
+  "vue/no-reserved-props": ["error", {
+    "vueVersion": 3, // or 2
+  }]
+}
+```
+
+- `vueVersion` (`2 | 3`) ... Specify the version of Vue you are using. Default is `3`.
+
+## :mag: Implementation
+
+- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/no-reserved-props.js)
+- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/no-reserved-props.js)
diff --git a/lib/configs/essential.js b/lib/configs/essential.js
index 57768ae1e..ca2cd2c8b 100644
--- a/lib/configs/essential.js
+++ b/lib/configs/essential.js
@@ -18,6 +18,12 @@ module.exports = {
     'vue/no-mutating-props': 'error',
     'vue/no-parsing-error': 'error',
     'vue/no-reserved-keys': 'error',
+    'vue/no-reserved-props': [
+      'error',
+      {
+        vueVersion: 2
+      }
+    ],
     'vue/no-shared-component-data': 'error',
     'vue/no-side-effects-in-computed-properties': 'error',
     'vue/no-template-key': 'error',
diff --git a/lib/configs/vue3-essential.js b/lib/configs/vue3-essential.js
index 43e8b9253..cb0fe4529 100644
--- a/lib/configs/vue3-essential.js
+++ b/lib/configs/vue3-essential.js
@@ -38,6 +38,7 @@ module.exports = {
     'vue/no-parsing-error': 'error',
     'vue/no-ref-as-operand': 'error',
     'vue/no-reserved-keys': 'error',
+    'vue/no-reserved-props': 'error',
     'vue/no-setup-props-destructure': 'error',
     'vue/no-shared-component-data': 'error',
     'vue/no-side-effects-in-computed-properties': 'error',
diff --git a/lib/index.js b/lib/index.js
index ba2185a91..9fddaf094 100644
--- a/lib/index.js
+++ b/lib/index.js
@@ -103,6 +103,7 @@ module.exports = {
     'no-ref-as-operand': require('./rules/no-ref-as-operand'),
     'no-reserved-component-names': require('./rules/no-reserved-component-names'),
     'no-reserved-keys': require('./rules/no-reserved-keys'),
+    'no-reserved-props': require('./rules/no-reserved-props'),
     'no-restricted-block': require('./rules/no-restricted-block'),
     'no-restricted-call-after-await': require('./rules/no-restricted-call-after-await'),
     'no-restricted-class': require('./rules/no-restricted-class'),
diff --git a/lib/rules/no-reserved-props.js b/lib/rules/no-reserved-props.js
new file mode 100644
index 000000000..e7e6aa5d5
--- /dev/null
+++ b/lib/rules/no-reserved-props.js
@@ -0,0 +1,97 @@
+/**
+ * @author Yosuke Ota
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+const utils = require('../utils')
+const casing = require('../utils/casing')
+
+/**
+ * @typedef {import('../utils').ComponentArrayProp} ComponentArrayProp
+ * @typedef {import('../utils').ComponentObjectProp} ComponentObjectProp
+ * @typedef {import('../utils').ComponentTypeProp} ComponentTypeProp
+ */
+
+// ------------------------------------------------------------------------------
+// Helpers
+// ------------------------------------------------------------------------------
+
+const RESERVED = {
+  3: ['key', 'ref'],
+  2: ['key', 'ref', 'is', 'slot', 'slot-scope', 'slotScope']
+}
+
+// ------------------------------------------------------------------------------
+// Rule Definition
+// ------------------------------------------------------------------------------
+
+module.exports = {
+  meta: {
+    type: 'problem',
+    docs: {
+      description: 'disallow reserved names in props',
+      categories: ['vue3-essential', 'essential'],
+      url: 'https://eslint.vuejs.org/rules/no-reserved-props.html',
+      defaultOptions: {
+        vue2: [{ vueVersion: 2 }]
+      }
+    },
+    fixable: null,
+    schema: [
+      {
+        type: 'object',
+        properties: {
+          vueVersion: {
+            enum: [2, 3]
+          }
+        },
+        additionalProperties: false
+      }
+    ],
+    messages: {
+      reserved:
+        "'{{propName}}' is a reserved attribute and cannot be used as props."
+    }
+  },
+  /** @param {RuleContext} context */
+  create(context) {
+    const options = context.options[0] || {}
+    /** @type {2|3} */
+    const vueVersion = options.vueVersion || 3
+
+    const reserved = new Set(RESERVED[vueVersion])
+
+    /**
+     * @param {(ComponentArrayProp | ComponentObjectProp | ComponentTypeProp)[]} props
+     */
+    function processProps(props) {
+      for (const prop of props) {
+        if (prop.propName != null && reserved.has(prop.propName)) {
+          context.report({
+            node: prop.node,
+            messageId: `reserved`,
+            data: {
+              propName: casing.kebabCase(prop.propName)
+            }
+          })
+        }
+      }
+    }
+
+    return utils.compositingVisitors(
+      utils.defineScriptSetupVisitor(context, {
+        onDefinePropsEnter(_node, props) {
+          processProps(props)
+        }
+      }),
+      utils.executeOnVue(context, (obj) => {
+        processProps(utils.getComponentProps(obj))
+      })
+    )
+  }
+}
diff --git a/lib/utils/ts-ast-utils.js b/lib/utils/ts-ast-utils.js
index 6777859b8..dcc6c7cf5 100644
--- a/lib/utils/ts-ast-utils.js
+++ b/lib/utils/ts-ast-utils.js
@@ -122,7 +122,7 @@ function* extractRuntimeProps(context, node) {
   for (const m of members) {
     if (
       (m.type === 'TSPropertySignature' || m.type === 'TSMethodSignature') &&
-      m.key.type === 'Identifier'
+      (m.key.type === 'Identifier' || m.key.type === 'Literal')
     ) {
       let type
       if (m.type === 'TSMethodSignature') {
@@ -132,8 +132,8 @@ function* extractRuntimeProps(context, node) {
       }
       yield {
         type: 'type',
-        key: /** @type {Identifier} */ (m.key),
-        propName: m.key.name,
+        key: /** @type {Identifier | Literal} */ (m.key),
+        propName: m.key.type === 'Identifier' ? m.key.name : `${m.key.value}`,
         value: null,
         node: /** @type {TSPropertySignature | TSMethodSignature} */ (m),
 
diff --git a/tests/lib/rules/no-reserved-props.js b/tests/lib/rules/no-reserved-props.js
new file mode 100644
index 000000000..add04f018
--- /dev/null
+++ b/tests/lib/rules/no-reserved-props.js
@@ -0,0 +1,523 @@
+/**
+ * @author Yosuke Ota
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+const RuleTester = require('eslint').RuleTester
+const rule = require('../../../lib/rules/no-reserved-props')
+
+const tester = new RuleTester({
+  parser: require.resolve('vue-eslint-parser'),
+  parserOptions: {
+    ecmaVersion: 2020,
+    sourceType: 'module'
+  }
+})
+
+tester.run('no-reserved-props', rule, {
+  valid: [
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+      export default {
+        props: {
+          foo: String
+        }
+      }
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+      export default {
+        props: ['foo']
+      }
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup>
+      defineProps({ foo: String })
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup>
+      defineProps(['foo'])
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup lang="ts">
+      interface Props {
+        foo: String
+      }
+      defineProps<Props>()
+      </script>
+      `,
+      parser: require.resolve('vue-eslint-parser'),
+      parserOptions: {
+        parser: require.resolve('@typescript-eslint/parser')
+      }
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+      export default {
+        data() {
+          return {
+            ref: ''
+          }
+        }
+      }
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup lang="ts">
+      interface Props {
+        is: string,
+        slot: string,
+        "slot-scope": string,
+      }
+      defineProps<Props>()
+      </script>
+      `,
+      parser: require.resolve('vue-eslint-parser'),
+      parserOptions: {
+        parser: require.resolve('@typescript-eslint/parser')
+      }
+    }
+  ],
+  invalid: [
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+      export default {
+        props: {
+          ref: String,
+          key: String,
+          is: String,
+          slot: String,
+          "slot-scope": String,
+        }
+      }
+      </script>
+      `,
+      errors: [
+        {
+          message: "'ref' is a reserved attribute and cannot be used as props.",
+          line: 5,
+          column: 11
+        },
+        {
+          message: "'key' is a reserved attribute and cannot be used as props.",
+          line: 6,
+          column: 11
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+      export default {
+        props: {
+          ref: String,
+          key: String,
+          is: String,
+          slot: String,
+          "slot-scope": String,
+        }
+      }
+      </script>
+      `,
+      options: [{ vueVersion: 3 }],
+      errors: [
+        {
+          message: "'ref' is a reserved attribute and cannot be used as props.",
+          line: 5,
+          column: 11
+        },
+        {
+          message: "'key' is a reserved attribute and cannot be used as props.",
+          line: 6,
+          column: 11
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+      export default {
+        props: [
+          'ref',
+          'key',
+          'is',
+          'slot',
+          "slot-scope",
+        ]
+      }
+      </script>
+      `,
+      errors: [
+        {
+          message: "'ref' is a reserved attribute and cannot be used as props.",
+          line: 5,
+          column: 11
+        },
+        {
+          message: "'key' is a reserved attribute and cannot be used as props.",
+          line: 6,
+          column: 11
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup>
+      defineProps({
+        ref: String,
+        key: String,
+        is: String,
+        slot: String,
+        "slot-scope": String,
+      })
+      </script>
+      `,
+      errors: [
+        {
+          message: "'ref' is a reserved attribute and cannot be used as props.",
+          line: 4,
+          column: 9
+        },
+        {
+          message: "'key' is a reserved attribute and cannot be used as props.",
+          line: 5,
+          column: 9
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup>
+      defineProps([
+        'ref',
+        'key',
+        'is',
+        'slot',
+        "slot-scope",
+      ])
+      </script>
+      `,
+      errors: [
+        {
+          message: "'ref' is a reserved attribute and cannot be used as props.",
+          line: 4,
+          column: 9
+        },
+        {
+          message: "'key' is a reserved attribute and cannot be used as props.",
+          line: 5,
+          column: 9
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup lang="ts">
+      interface Props {
+        ref: string,
+        key: string,
+        is: string,
+        slot: string,
+        "slot-scope": string,
+      }
+      defineProps<Props>()
+      </script>
+      `,
+      parser: require.resolve('vue-eslint-parser'),
+      parserOptions: {
+        parser: require.resolve('@typescript-eslint/parser')
+      },
+      errors: [
+        {
+          message: "'ref' is a reserved attribute and cannot be used as props.",
+          line: 4,
+          column: 9
+        },
+        {
+          message: "'key' is a reserved attribute and cannot be used as props.",
+          line: 5,
+          column: 9
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+      export default {
+        props: {
+          ref: String,
+          key: String,
+          is: String,
+          slot: String,
+          "slot-scope": String,
+        }
+      }
+      </script>
+      `,
+      options: [{ vueVersion: 2 }],
+      errors: [
+        {
+          message: "'ref' is a reserved attribute and cannot be used as props.",
+          line: 5,
+          column: 11
+        },
+        {
+          message: "'key' is a reserved attribute and cannot be used as props.",
+          line: 6,
+          column: 11
+        },
+        {
+          message: "'is' is a reserved attribute and cannot be used as props.",
+          line: 7,
+          column: 11
+        },
+        {
+          message:
+            "'slot' is a reserved attribute and cannot be used as props.",
+          line: 8,
+          column: 11
+        },
+        {
+          message:
+            "'slot-scope' is a reserved attribute and cannot be used as props.",
+          line: 9,
+          column: 11
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+      export default {
+        props: [
+          'ref',
+          'key',
+          'is',
+          'slot',
+          "slot-scope",
+        ]
+      }
+      </script>
+      `,
+      options: [{ vueVersion: 2 }],
+      errors: [
+        {
+          message: "'ref' is a reserved attribute and cannot be used as props.",
+          line: 5,
+          column: 11
+        },
+        {
+          message: "'key' is a reserved attribute and cannot be used as props.",
+          line: 6,
+          column: 11
+        },
+        {
+          message: "'is' is a reserved attribute and cannot be used as props.",
+          line: 7,
+          column: 11
+        },
+        {
+          message:
+            "'slot' is a reserved attribute and cannot be used as props.",
+          line: 8,
+          column: 11
+        },
+        {
+          message:
+            "'slot-scope' is a reserved attribute and cannot be used as props.",
+          line: 9,
+          column: 11
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup>
+      defineProps({
+        ref: String,
+        key: String,
+        is: String,
+        slot: String,
+        "slot-scope": String,
+      })
+      </script>
+      `,
+      options: [{ vueVersion: 2 }],
+      errors: [
+        {
+          message: "'ref' is a reserved attribute and cannot be used as props.",
+          line: 4,
+          column: 9
+        },
+        {
+          message: "'key' is a reserved attribute and cannot be used as props.",
+          line: 5,
+          column: 9
+        },
+        {
+          message: "'is' is a reserved attribute and cannot be used as props.",
+          line: 6,
+          column: 9
+        },
+        {
+          message:
+            "'slot' is a reserved attribute and cannot be used as props.",
+          line: 7,
+          column: 9
+        },
+        {
+          message:
+            "'slot-scope' is a reserved attribute and cannot be used as props.",
+          line: 8,
+          column: 9
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup>
+      defineProps([
+        'ref',
+        'key',
+        'is',
+        'slot',
+        "slot-scope",
+      ])
+      </script>
+      `,
+      options: [{ vueVersion: 2 }],
+      errors: [
+        {
+          message: "'ref' is a reserved attribute and cannot be used as props.",
+          line: 4,
+          column: 9
+        },
+        {
+          message: "'key' is a reserved attribute and cannot be used as props.",
+          line: 5,
+          column: 9
+        },
+        {
+          message: "'is' is a reserved attribute and cannot be used as props.",
+          line: 6,
+          column: 9
+        },
+        {
+          message:
+            "'slot' is a reserved attribute and cannot be used as props.",
+          line: 7,
+          column: 9
+        },
+        {
+          message:
+            "'slot-scope' is a reserved attribute and cannot be used as props.",
+          line: 8,
+          column: 9
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup lang="ts">
+      interface Props {
+        ref: string,
+        key: string,
+        is: string,
+        slot: string,
+        "slot-scope": string,
+      }
+      defineProps<Props>()
+      </script>
+      `,
+      options: [{ vueVersion: 2 }],
+      parser: require.resolve('vue-eslint-parser'),
+      parserOptions: {
+        parser: require.resolve('@typescript-eslint/parser')
+      },
+      errors: [
+        {
+          message: "'ref' is a reserved attribute and cannot be used as props.",
+          line: 4,
+          column: 9
+        },
+        {
+          message: "'key' is a reserved attribute and cannot be used as props.",
+          line: 5,
+          column: 9
+        },
+        {
+          message: "'is' is a reserved attribute and cannot be used as props.",
+          line: 6,
+          column: 9
+        },
+        {
+          message:
+            "'slot' is a reserved attribute and cannot be used as props.",
+          line: 7,
+          column: 9
+        },
+        {
+          message:
+            "'slot-scope' is a reserved attribute and cannot be used as props.",
+          line: 8,
+          column: 9
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup>
+      defineProps([
+        "slotScope",
+      ])
+      </script>
+      `,
+      options: [{ vueVersion: 2 }],
+      errors: [
+        {
+          message:
+            "'slot-scope' is a reserved attribute and cannot be used as props.",
+          line: 4,
+          column: 9
+        }
+      ]
+    }
+  ]
+})
diff --git a/tools/update-lib-configs.js b/tools/update-lib-configs.js
index b5b2488ca..8667f1e6c 100644
--- a/tools/update-lib-configs.js
+++ b/tools/update-lib-configs.js
@@ -30,9 +30,17 @@ const extendsCategories = {
 
 function formatRules(rules, categoryId) {
   const obj = rules.reduce((setting, rule) => {
-    setting[rule.ruleId] = errorCategories.includes(categoryId)
-      ? 'error'
-      : 'warn'
+    let options = errorCategories.includes(categoryId) ? 'error' : 'warn'
+    const defaultOptions =
+      rule.meta && rule.meta.docs && rule.meta.docs.defaultOptions
+    if (defaultOptions) {
+      const v = categoryId.startsWith('vue3') ? 3 : 2
+      const defaultOption = defaultOptions[`vue${v}`]
+      if (defaultOption) {
+        options = [options, ...defaultOption]
+      }
+    }
+    setting[rule.ruleId] = options
     return setting
   }, {})
   return JSON.stringify(obj, null, 2)
diff --git a/typings/eslint-plugin-vue/util-types/utils.ts b/typings/eslint-plugin-vue/util-types/utils.ts
index 7258cb673..73b9e81c7 100644
--- a/typings/eslint-plugin-vue/util-types/utils.ts
+++ b/typings/eslint-plugin-vue/util-types/utils.ts
@@ -103,7 +103,7 @@ export type ComponentObjectProp =
 
 export type ComponentTypeProp = {
   type: 'type'
-  key: Identifier
+  key: Identifier | Literal
   propName: string
   value: null
   node: TSPropertySignature | TSMethodSignature

From 18ed85239d2d70f5c91ad02225d3697b9b52c338 Mon Sep 17 00:00:00 2001
From: yosuke ota <otameshiyo23@gmail.com>
Date: Fri, 29 Oct 2021 09:37:13 +0900
Subject: [PATCH 2/2] add 'class' and 'style'

---
 lib/rules/no-reserved-props.js       |   2 +-
 tests/lib/rules/no-reserved-props.js | 153 +++------------------------
 2 files changed, 17 insertions(+), 138 deletions(-)

diff --git a/lib/rules/no-reserved-props.js b/lib/rules/no-reserved-props.js
index e7e6aa5d5..8694d58b5 100644
--- a/lib/rules/no-reserved-props.js
+++ b/lib/rules/no-reserved-props.js
@@ -23,7 +23,7 @@ const casing = require('../utils/casing')
 
 const RESERVED = {
   3: ['key', 'ref'],
-  2: ['key', 'ref', 'is', 'slot', 'slot-scope', 'slotScope']
+  2: ['key', 'ref', 'is', 'slot', 'slot-scope', 'slotScope', 'class', 'style']
 }
 
 // ------------------------------------------------------------------------------
diff --git a/tests/lib/rules/no-reserved-props.js b/tests/lib/rules/no-reserved-props.js
index add04f018..595ac9409 100644
--- a/tests/lib/rules/no-reserved-props.js
+++ b/tests/lib/rules/no-reserved-props.js
@@ -171,6 +171,9 @@ tester.run('no-reserved-props', rule, {
           'is',
           'slot',
           "slot-scope",
+          "slotScope",
+          'class',
+          \`style\`
         ]
       }
       </script>
@@ -366,156 +369,32 @@ tester.run('no-reserved-props', rule, {
     {
       filename: 'test.vue',
       code: `
-      <script setup>
-      defineProps({
-        ref: String,
-        key: String,
-        is: String,
-        slot: String,
-        "slot-scope": String,
-      })
+      <script>
+      export default {
+        props: [
+          "slotScope",
+          'class',
+          \`style\`
+        ]
+      }
       </script>
       `,
       options: [{ vueVersion: 2 }],
       errors: [
-        {
-          message: "'ref' is a reserved attribute and cannot be used as props.",
-          line: 4,
-          column: 9
-        },
-        {
-          message: "'key' is a reserved attribute and cannot be used as props.",
-          line: 5,
-          column: 9
-        },
-        {
-          message: "'is' is a reserved attribute and cannot be used as props.",
-          line: 6,
-          column: 9
-        },
-        {
-          message:
-            "'slot' is a reserved attribute and cannot be used as props.",
-          line: 7,
-          column: 9
-        },
         {
           message:
             "'slot-scope' is a reserved attribute and cannot be used as props.",
-          line: 8,
-          column: 9
-        }
-      ]
-    },
-    {
-      filename: 'test.vue',
-      code: `
-      <script setup>
-      defineProps([
-        'ref',
-        'key',
-        'is',
-        'slot',
-        "slot-scope",
-      ])
-      </script>
-      `,
-      options: [{ vueVersion: 2 }],
-      errors: [
-        {
-          message: "'ref' is a reserved attribute and cannot be used as props.",
-          line: 4,
-          column: 9
-        },
-        {
-          message: "'key' is a reserved attribute and cannot be used as props.",
-          line: 5,
-          column: 9
-        },
-        {
-          message: "'is' is a reserved attribute and cannot be used as props.",
-          line: 6,
-          column: 9
+          line: 5
         },
         {
           message:
-            "'slot' is a reserved attribute and cannot be used as props.",
-          line: 7,
-          column: 9
+            "'class' is a reserved attribute and cannot be used as props.",
+          line: 6
         },
         {
           message:
-            "'slot-scope' is a reserved attribute and cannot be used as props.",
-          line: 8,
-          column: 9
-        }
-      ]
-    },
-    {
-      filename: 'test.vue',
-      code: `
-      <script setup lang="ts">
-      interface Props {
-        ref: string,
-        key: string,
-        is: string,
-        slot: string,
-        "slot-scope": string,
-      }
-      defineProps<Props>()
-      </script>
-      `,
-      options: [{ vueVersion: 2 }],
-      parser: require.resolve('vue-eslint-parser'),
-      parserOptions: {
-        parser: require.resolve('@typescript-eslint/parser')
-      },
-      errors: [
-        {
-          message: "'ref' is a reserved attribute and cannot be used as props.",
-          line: 4,
-          column: 9
-        },
-        {
-          message: "'key' is a reserved attribute and cannot be used as props.",
-          line: 5,
-          column: 9
-        },
-        {
-          message: "'is' is a reserved attribute and cannot be used as props.",
-          line: 6,
-          column: 9
-        },
-        {
-          message:
-            "'slot' is a reserved attribute and cannot be used as props.",
-          line: 7,
-          column: 9
-        },
-        {
-          message:
-            "'slot-scope' is a reserved attribute and cannot be used as props.",
-          line: 8,
-          column: 9
-        }
-      ]
-    },
-    {
-      filename: 'test.vue',
-      code: `
-      <script setup>
-      defineProps([
-        "slotScope",
-      ])
-      </script>
-      `,
-      options: [{ vueVersion: 2 }],
-      errors: [
-        {
-          message:
-            "'slot-scope' is a reserved attribute and cannot be used as props.",
-          line: 4,
-          column: 9
+            "'style' is a reserved attribute and cannot be used as props.",
+          line: 7
         }
       ]
     }