diff --git a/README.md b/README.md index a2cd571e..573c5bb9 100644 --- a/README.md +++ b/README.md @@ -68,6 +68,34 @@ vue-jest compiles ` diff --git a/e2e/3.x/typescript-with-compiler-options/src/shims-vue.d.ts b/e2e/3.x/typescript-with-compiler-options/src/shims-vue.d.ts new file mode 100644 index 00000000..64c3fd9e --- /dev/null +++ b/e2e/3.x/typescript-with-compiler-options/src/shims-vue.d.ts @@ -0,0 +1,5 @@ +declare module '*.vue' { + import type { DefineComponent } from 'vue'; + const component: DefineComponent<{}, {}, any>; + export default component; +} diff --git a/e2e/3.x/typescript-with-compiler-options/src/test.ts b/e2e/3.x/typescript-with-compiler-options/src/test.ts new file mode 100644 index 00000000..5dbd868f --- /dev/null +++ b/e2e/3.x/typescript-with-compiler-options/src/test.ts @@ -0,0 +1,25 @@ +import { createApp, h } from 'vue' + +import PropsDestructureTransform from '@/components/PropsDestructureTransform.vue' + +function mount(Component: any) { + document.getElementsByTagName('html')[0].innerHTML = '' + const el = document.createElement('div') + el.id = 'app' + document.body.appendChild(el) + const Parent = { + render() { + return h(Component) + } + } + createApp(Parent).mount(el) +} + +test('support additional compiler options like `propsDestructureTransform`', () => { + // `propsDestructureTransform` is a new compiler option in v3.2.20 + // that allows to destructure props with default values and retain reactivity + // The option is passed to the compiler via `globals.vue-jest.compilerOptions` of the Jest config in the package.json + mount(PropsDestructureTransform) + // if the option is properly passed, then the default value of the props is used + expect(document.querySelector('h1')!.textContent).toBe('name') +}) diff --git a/e2e/3.x/typescript-with-compiler-options/tsconfig.json b/e2e/3.x/typescript-with-compiler-options/tsconfig.json new file mode 100644 index 00000000..2ae52c99 --- /dev/null +++ b/e2e/3.x/typescript-with-compiler-options/tsconfig.json @@ -0,0 +1,24 @@ +{ + "compilerOptions": { + "target": "es5", + "module": "esnext", + "strict": true, + "jsx": "preserve", + "importHelpers": true, + "moduleResolution": "node", + "skipLibCheck": true, + "esModuleInterop": true, + "allowSyntheticDefaultImports": true, + "forceConsistentCasingInFileNames": true, + "useDefineForClassFields": true, + "sourceMap": true, + "baseUrl": ".", + "types": ["webpack-env", "jest"], + "paths": { + "@/*": ["src/*"] + }, + "lib": ["esnext", "dom", "dom.iterable", "scripthost"] + }, + "include": ["src/**/*.ts", "src/**/*.vue"], + "exclude": ["node_modules"] +} diff --git a/packages/vue3-jest/lib/process.js b/packages/vue3-jest/lib/process.js index 16908429..9442a441 100644 --- a/packages/vue3-jest/lib/process.js +++ b/packages/vue3-jest/lib/process.js @@ -51,13 +51,14 @@ function processScriptSetup(descriptor, filePath, config) { if (!descriptor.scriptSetup) { return null } + const vueJestConfig = getVueJestConfig(config) const content = compileScript(descriptor, { id: filePath, - refTransform: true + refTransform: true, + ...vueJestConfig.compilerOptions }) const contentMap = mapLines(descriptor.scriptSetup.map, content.map) - const vueJestConfig = getVueJestConfig(config) const transformer = resolveTransformer( descriptor.scriptSetup.lang, vueJestConfig @@ -77,7 +78,6 @@ function processTemplate(descriptor, filename, config) { } const vueJestConfig = getVueJestConfig(config) - if (template.src) { template.content = loadSrc(template.src, filename) } @@ -86,7 +86,8 @@ function processTemplate(descriptor, filename, config) { if (scriptSetup) { const scriptSetupResult = compileScript(descriptor, { id: filename, - refTransform: true + refTransform: true, + ...vueJestConfig.compilerOptions }) bindings = scriptSetupResult.bindings }