@transifex/cli Detect Vue script setup

Author: Nikos Vasileiou

packages/cli/src/api/parsers/vue.js

@@ -125,12 +125,19 @@ function vueElementVisitor(HASHES, relativeFile, options) {
 function extractVuePhrases(HASHES, source, relativeFile, options) {
   // Use the vue-template-compiler API to parse content
   const vueContent = vueTemplateCompiler.parse(source);
+
   // Get the JS Content from the file and extract hashes/phrases with Babel
   if (vueContent.descriptor.script && vueContent.descriptor.script.content) {
     const script = vueContent.descriptor.script.content;
     babelExtractPhrases(HASHES, script, relativeFile, options);
   }
 
+  // Also detect Vue3 script setup
+  if (vueContent.descriptor.scriptSetup && vueContent.descriptor.scriptSetup.content) {
+    const script = vueContent.descriptor.scriptSetup.content;
+    babelExtractPhrases(HASHES, script, relativeFile, options);
+  }
+
   // Get the template content from the file and extract hashes/phrases with
   // custom traverse function
   if (vueContent.descriptor.template && vueContent.descriptor.template.content) {

packages/cli/test/api/extract.hashedkeys.test.js

@@ -543,8 +543,12 @@ describe('extractPhrases with hashed keys', () => {
           string: 'Text 5',
           meta: { context: [], tags: [], occurrences: ['vuejs.vue'] },
         },
-        '39bcf931264f8a4de0d4c993ba8e7094': {
-          string: 'Text 6',
+        d42dd30c271a7dc6ecfaddd2cee7e457: {
+          string: 'Text in script',
+          meta: { context: [], tags: [], occurrences: ['vuejs.vue'] },
+        },
+        '2d97d5484416727f585501ee9f842ab1': {
+          string: 'Text in script setup',
           meta: { context: [], tags: [], occurrences: ['vuejs.vue'] },
         },
       });

packages/cli/test/api/extract.sourcekeys.test.js

@@ -484,10 +484,6 @@ describe('extractPhrases with source keys', () => {
           string: 'Text 5',
           meta: { context: [], tags: [], occurrences: ['vuejs.vue'] },
         },
-        'Text 6': {
-          string: 'Text 6',
-          meta: { context: [], tags: [], occurrences: ['vuejs.vue'] },
-        },
         'Text 7': {
           meta: {
             context: [],
@@ -528,6 +524,14 @@ describe('extractPhrases with source keys', () => {
           },
           string: 'Text 9 with siblings',
         },
+        'Text in script': {
+          string: 'Text in script',
+          meta: { context: [], tags: [], occurrences: ['vuejs.vue'] },
+        },
+        'Text in script setup': {
+          string: 'Text in script setup',
+          meta: { context: [], tags: [], occurrences: ['vuejs.vue'] },
+        },
       });
   });
 });

packages/cli/test/fixtures/vuejs.vue

@@ -35,12 +35,23 @@
       />
   </div>
 </template>
+
 <script>
 import { defineComponent } from '@vue/composition-api'
 
 export default defineComponent({
     setup() {
-        t('Text 6')
+        t('Text in script')
+    },
+})
+</script>
+
+<script setup>
+import { defineComponent } from '@vue/composition-api'
+
+export default defineComponent({
+    setup() {
+        t('Text in script setup')
     },
 })
 </script>