From b5dee40822d8a3225864962c4e6a1b6d0bc98939 Mon Sep 17 00:00:00 2001
From: yosuke ota <otameshiyo23@gmail.com>
Date: Sat, 3 Jul 2021 18:30:03 +0900
Subject: [PATCH 1/2] Update `vue/prop-name-casing` rule to support `<script
 setup>`

---
 lib/rules/prop-name-casing.js       | 25 +++++++-
 tests/lib/rules/prop-name-casing.js | 94 +++++++++++++++++++++++++++++
 2 files changed, 116 insertions(+), 3 deletions(-)

diff --git a/lib/rules/prop-name-casing.js b/lib/rules/prop-name-casing.js
index 5ee9b78f1..b21147957 100644
--- a/lib/rules/prop-name-casing.js
+++ b/lib/rules/prop-name-casing.js
@@ -8,6 +8,12 @@ const utils = require('../utils')
 const casing = require('../utils/casing')
 const allowedCaseOptions = ['camelCase', 'snake_case']
 
+/**
+ * @typedef {import('../utils').ComponentArrayProp} ComponentArrayProp
+ * @typedef {import('../utils').ComponentObjectProp} ComponentObjectProp
+ * @typedef {import('../utils').ComponentTypeProp} ComponentTypeProp
+ */
+
 // ------------------------------------------------------------------------------
 // Rule Definition
 // ------------------------------------------------------------------------------
@@ -22,8 +28,11 @@ function create(context) {
   // Public
   // ----------------------------------------------------------------------
 
-  return utils.executeOnVue(context, (obj) => {
-    for (const item of utils.getComponentProps(obj)) {
+  /**
+   * @param {(ComponentArrayProp | ComponentObjectProp | ComponentTypeProp)[]} props
+   */
+  function processProps(props) {
+    for (const item of props) {
       const propName = item.propName
       if (propName == null) {
         continue
@@ -39,7 +48,17 @@ function create(context) {
         })
       }
     }
-  })
+  }
+  return utils.compositingVisitors(
+    utils.defineScriptSetupVisitor(context, {
+      onDefinePropsEnter(_node, props) {
+        processProps(props)
+      }
+    }),
+    utils.executeOnVue(context, (obj) => {
+      processProps(utils.getComponentProps(obj))
+    })
+  )
 }
 
 // ------------------------------------------------------------------------------
diff --git a/tests/lib/rules/prop-name-casing.js b/tests/lib/rules/prop-name-casing.js
index 4815c4ebf..15151ad2a 100644
--- a/tests/lib/rules/prop-name-casing.js
+++ b/tests/lib/rules/prop-name-casing.js
@@ -322,6 +322,44 @@ ruleTester.run('prop-name-casing', rule, {
       `,
       options: ['snake_case'],
       parserOptions
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup>
+      defineProps({
+        greetingText: String
+      })
+      </script>
+      `,
+      parser: require.resolve('vue-eslint-parser'),
+      parserOptions
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup>
+      defineProps(['greetingText'])
+      </script>
+      `,
+      parser: require.resolve('vue-eslint-parser'),
+      parserOptions
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup lang="ts">
+      interface Props {
+        greetingText: number
+      }
+      defineProps<Props>()
+      </script>
+      `,
+      parser: require.resolve('vue-eslint-parser'),
+      parserOptions: {
+        ...parserOptions,
+        parser: require.resolve('@typescript-eslint/parser')
+      }
     }
   ],
 
@@ -580,6 +618,62 @@ ruleTester.run('prop-name-casing', rule, {
       `,
       parserOptions,
       errors: ['Prop "/greeting-text/" is not in camelCase.']
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup>
+      defineProps({
+        greeting_text: String
+      })
+      </script>
+      `,
+      parser: require.resolve('vue-eslint-parser'),
+      parserOptions,
+      errors: [
+        {
+          message: 'Prop "greeting_text" is not in camelCase.',
+          line: 4
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup>
+      defineProps(['greeting_text'])
+      </script>
+      `,
+      parser: require.resolve('vue-eslint-parser'),
+      parserOptions,
+      errors: [
+        {
+          message: 'Prop "greeting_text" is not in camelCase.',
+          line: 3
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup lang="ts">
+      interface Props {
+        greeting_text: number
+      }
+      defineProps<Props>()
+      </script>
+      `,
+      parser: require.resolve('vue-eslint-parser'),
+      parserOptions: {
+        ...parserOptions,
+        parser: require.resolve('@typescript-eslint/parser')
+      },
+      errors: [
+        {
+          message: 'Prop "greeting_text" is not in camelCase.',
+          line: 4
+        }
+      ]
     }
   ]
 })

From 0be4ded0e0b6031a89761677b31957402902e539 Mon Sep 17 00:00:00 2001
From: yosuke ota <otameshiyo23@gmail.com>
Date: Sat, 3 Jul 2021 19:05:01 +0900
Subject: [PATCH 2/2] fix for test on node v8

---
 tests/lib/rules/prop-name-casing.js | 52 +++++++++++++++++------------
 1 file changed, 30 insertions(+), 22 deletions(-)

diff --git a/tests/lib/rules/prop-name-casing.js b/tests/lib/rules/prop-name-casing.js
index 15151ad2a..4226e2dc8 100644
--- a/tests/lib/rules/prop-name-casing.js
+++ b/tests/lib/rules/prop-name-casing.js
@@ -8,6 +8,7 @@
 // Requirements
 // ------------------------------------------------------------------------------
 
+const semver = require('semver')
 const rule = require('../../../lib/rules/prop-name-casing')
 const RuleTester = require('eslint').RuleTester
 
@@ -653,27 +654,34 @@ ruleTester.run('prop-name-casing', rule, {
         }
       ]
     },
-    {
-      filename: 'test.vue',
-      code: `
-      <script setup lang="ts">
-      interface Props {
-        greeting_text: number
-      }
-      defineProps<Props>()
-      </script>
-      `,
-      parser: require.resolve('vue-eslint-parser'),
-      parserOptions: {
-        ...parserOptions,
-        parser: require.resolve('@typescript-eslint/parser')
-      },
-      errors: [
-        {
-          message: 'Prop "greeting_text" is not in camelCase.',
-          line: 4
-        }
-      ]
-    }
+    ...(semver.lt(
+      require('@typescript-eslint/parser/package.json').version,
+      '4.0.0'
+    )
+      ? []
+      : [
+          {
+            filename: 'test.vue',
+            code: `
+            <script setup lang="ts">
+            interface Props {
+              greeting_text: number
+            }
+            defineProps<Props>()
+            </script>
+            `,
+            parser: require.resolve('vue-eslint-parser'),
+            parserOptions: {
+              ...parserOptions,
+              parser: require.resolve('@typescript-eslint/parser')
+            },
+            errors: [
+              {
+                message: 'Prop "greeting_text" is not in camelCase.',
+                line: 4
+              }
+            ]
+          }
+        ])
   ]
 })