From d339e2ecab1ab3c9099bdb773524587a880f3d35 Mon Sep 17 00:00:00 2001
From: James Garbutt <43081j@users.noreply.github.com>
Date: Sat, 7 Jan 2023 14:12:08 +0000
Subject: [PATCH] fix (vue/component-api-style): add spacing around comma in
 report message (#2070)

---
 lib/rules/component-api-style.js       |  2 +-
 tests/lib/rules/component-api-style.js | 25 +++++++++++++++++++++++++
 2 files changed, 26 insertions(+), 1 deletion(-)

diff --git a/lib/rules/component-api-style.js b/lib/rules/component-api-style.js
index 12ad52e2d..550eebfed 100644
--- a/lib/rules/component-api-style.js
+++ b/lib/rules/component-api-style.js
@@ -162,7 +162,7 @@ function buildAllowedPhrase(allowsOpt) {
     phrases.push('Options API')
   }
   return phrases.length > 2
-    ? `${phrases.slice(0, -1).join(',')} or ${phrases.slice(-1)[0]}`
+    ? `${phrases.slice(0, -1).join(', ')} or ${phrases.slice(-1)[0]}`
     : phrases.join(' or ')
 }
 
diff --git a/tests/lib/rules/component-api-style.js b/tests/lib/rules/component-api-style.js
index 534751254..a33321251 100644
--- a/tests/lib/rules/component-api-style.js
+++ b/tests/lib/rules/component-api-style.js
@@ -817,6 +817,31 @@ tester.run('component-api-style', rule, {
           column: 9
         }
       ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+      export default {
+        data () {
+          return {
+            msg: 'Hello World!',
+            // ...
+          }
+        },
+        // ...
+      }
+      </script>
+      `,
+      options: [['script-setup', 'composition', 'composition-vue2']],
+      errors: [
+        {
+          message:
+            'Options API is not allowed in your project. `data` option is part of the Options API. Use `<script setup>`, Composition API or Composition API (Vue 2) instead.',
+          line: 4,
+          column: 9
+        }
+      ]
     }
   ]
 })