[vue-jest] Error: Vue template compilation failed

[likui628]

Hi,i got this error on "vue3-jest": "^27.0.0-alpha.1"

SyntaxError: Error parsing JavaScript expression: This experimental syntax requires enabling one of the following parser plugin(s): 'jsx, flow, typescript' (1:29)

[vue-jest] Error: Vue template compilation failed

      at error (node_modules/vue3-jest/lib/utils.js:131:9)
      at logResultErrors (node_modules/vue3-jest/lib/utils.js:143:5)
      at processTemplate (node_modules/vue3-jest/lib/process.js:100:3)
      at Object.module.exports [as process] (node_modules/vue3-jest/lib/process.js:137:26)
      at ScriptTransformer.transformSource (node_modules/@jest/transform/build/ScriptTransformer.js:612:31)
      at ScriptTransformer._transformAndBuildScript (node_modules/@jest/transform/build/ScriptTransformer.js:758:40)
      at ScriptTransformer.transform (node_modules/@jest/transform/build/ScriptTransformer.js:815:19)

CustomInput.vue

<template>
  <label>
    {{ label }}
    <input
      type="text"
      :value="modelValue"
      @input="$emit('update:modelValue', (<HTMLInputElement>$event.target).value)"
    />
  </label>
</template>

<script lang="ts">
import { defineComponent } from 'vue'

export default defineComponent({
  name: 'CustomInput',
  props: ['modelValue', 'label'],
})
</script>

CustomInput.spec.ts

import { mount } from '@vue/test-utils'
import CustomInput from '../CustomInput.vue'

describe('Form.vue', () => {
  test('mount', () => {
    const wrapper = mount(CustomInput)
  })
})

I need to change @input="$emit('update:modelValue', (<HTMLInputElement>$event.target).value)" to @input="$emit('update:modelValue', $event.target.value)" to avoid this error.

Can vue-jest support typescipt in vue template ?

[likui628]

feat: support TS in templates for @vue/vue3-jest #394