Importing types doesn't work in jest environment
Vue version
3.3.2
Link to minimal reproduction
https://github.com/vojvodics/vue3.3.1-jest-reproduction-example
Steps to reproduce
Clone reproduction repository and run npm run test
What is expected?
Tests should pass
What is actually happening?
Tests are failing with the following error:
[@vue/compiler-sfc] No fs option provided to `compileScript` in non-Node environment. File system access is required for resolving imported types.
System Info
No response
Any additional comments?
A hacky solution is provided in the repo example. It is based on these files: https://github.com/vuejs/core/blob/v3.3.2/packages/vue/compiler-sfc/index.js https://github.com/vuejs/core/blob/v3.3.2/packages/vue/compiler-sfc/register-ts.js
Also related:
*initially it was v3.3.1, but I updated it to v3.3.2 and it is still present
This is something that needs to be fixed in https://github.com/vuejs/vue-jest I believe. /cc @lmiller1990
It seems TypeScript does not populate ts.sys
when loaded in Jest - I'm not sure if passing the Jest-mocked fs into compileScript
would resolve this.
I recently ran into the same issue, although I'm not using jest
. Will put up a simple repro and link here
Discussion on discord
I have the same problem with version 3.2.2 and without jest. Any news?
I think this feature is available only from v3.3.x
See here
I have the same problem with version 3.2.2 and without jest. Any news?
I think this feature is available only from
v3.3.x
See here
My mistake, i'm using version 3.3.1
Hi there! Had anyone of you time to investigate? 🙂 Using the new cool vue 3.3 interface features (that is importing interfaces from elsewhere) our jest suite is now broken too 🥲 Would really like to step forward with vue 3.3 🥳.
@jenshoffmann1331 Did you try the hacky solution? You basically point to a different transformer than vue-jest (https://github.com/vojvodics/vue3.3.1-jest-reproduction-example/blob/main/jest.config.js#L6) and in that file you call registerTs before exporting vue-jest (https://github.com/vojvodics/vue3.3.1-jest-reproduction-example/blob/main/vue3JestHack.js)
I don't think we've tried vue-jest with Vue 3.3 yet. We should add some tests in that code base and see if there's any bugs or issues.
It sounds like this isn't an issue in Vue core, though - perhaps we should move the issue to vue-jest?
Looks like https://github.com/vuejs/core/commit/d2c3d8b70b2df6e16f053a7ac58e6b04e7b2078f broke the hack suggested here. To fix it, instead of passing in require('typescript')
to registerTS()
, you have to pass a function that lazily resolves to require('typescript')
:
require("@vue/compiler-sfc").registerTS(() => require("typescript"));
module.exports = require("@vue/vue3-jest");