Skip to content

Commit

Permalink
feat: support TS in templates for @vue/vue3-jest (#394)
Browse files Browse the repository at this point in the history
Vue 3.2.13 introduced the support of TS expressions in templates, with a new `isTs` option of the compiler.
(See [the relevant commit](vuejs/core@0dc521b))

vue-loader and vite chose to enable this by default if the script uses TS:
- [vue-loader](vuejs/vue-loader@7613534)
- [vite](vitejs/vite@01fa2ab)

This commit enables the same behavior in vue-jest: if the script is using TS, then the `isTs` option is passed to the compiler.
TS developers won't have to worry about setting the options themselves, making it coherent with what vue-loader and vite do.
  • Loading branch information
cexbrayat authored Oct 7, 2021
1 parent a59135a commit 04a3233
Show file tree
Hide file tree
Showing 2 changed files with 11 additions and 1 deletion.
4 changes: 3 additions & 1 deletion e2e/3.x/typescript/src/components/Basic.vue
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
<template>
<div class="hello">
<h1 :class="headingClasses">{{ msg }}</h1>
<!-- Vue 3.2.13 supports TS in templates -->
<!-- hence the `!` after `msg` to check if vue-jest supports it as well -->
<h1 :class="headingClasses">{{ msg! }}</h1>
</div>
</template>

Expand Down
8 changes: 8 additions & 0 deletions packages/vue3-jest/lib/process.js
Original file line number Diff line number Diff line change
Expand Up @@ -91,6 +91,13 @@ function processTemplate(descriptor, filename, config) {
bindings = scriptSetupResult.bindings
}

// Since Vue 3.2.13, it's possible to use TypeScript in templates,
// but this needs the `isTS` option of the compiler.
// We could let users set it themselves, but vue-loader and vite automatically add it
// if the script is in TypeScript, so let's do the same for a seamless experience.
const isTS =
descriptor.script && /^typescript$|tsx?$/.test(descriptor.script.lang)

const result = compileTemplate({
id: filename,
source: template.content,
Expand All @@ -100,6 +107,7 @@ function processTemplate(descriptor, filename, config) {
compilerOptions: {
bindingMetadata: bindings,
mode: 'module',
isTS,
...vueJestConfig.compilerOptions
}
})
Expand Down

0 comments on commit 04a3233

Please sign in to comment.