Vitest support
I was hoping to migrate my TypeScript and SolidJS project template from using Jest to Vitest for a nice little speed boost and to reduce my number of dependencies, but I'm encountering some errors. I'm trying to find out what I'm doing wrong, or if Vitest support just isn't fully baked yet.
I've got this on a GitHub branch here: https://github.com/mikefarquhar/typescript-solid-application/tree/vitest_testing
I'm using Node v20 and NPM v10.4.0
My package versions are up-to-date in the lockfile as of the time of writing so I don't believe I'm seeing issues with out-of-date package versions.
The errors I've been seeing are:
1. "You appear to have multiple instances of Solid. This can lead to unexpected behavior."
I've seen this pop up in a number of GitHub issues posts, but they look to have been resolved. None of the solutions in said posts are working for me though.
I've made sure that there is only one copy of SolidJS in my project, so I assume something between vite, vitest and vite-plugin-solid is somehow making Solid load twice.
2. "computations created outside a
createRoot or render will never be disposed"
This shows up once per test unless I add
This error shows up regardless of whether I'm using any reactive signals or effects. Adding the above to the test config however causes the next problem.
3. Signals will update values in the browser, but fail to do so within the Vitest environment.
This is as it sounds. I've effectively followed the basic example from the docs and the count never updates if the config above is set.
Any help or guidance would be appreciated, even if the advice is to just continue using Jest for now.GitHub
GitHub - mikefarquhar/typescript-solid-application at vitest_testing
Template for SolidJS applications using TypeScript - GitHub - mikefarquhar/typescript-solid-application at vitest_testing
SolidJS
Solid is a purely reactive library. It was designed from the ground up with a reactive core. It's influenced by reactive principles developed by previous libraries.
10 Replies
here is a working example of vitest support:
https://github.com/solidjs/templates/tree/main/ts-vitest
GitHub
templates/ts-vitest at main · solidjs/templates
Vite + solid templates. Contribute to solidjs/templates development by creating an account on GitHub.
I needed to add this to the vite config, because I used other packages with solid that start with „@solid“. Hope this helps
…
test: {
environment: 'jsdom',
globals: true,
testTransformMode: {web: ['/.[jt]sx?$/']},
deps: {
inline: [/solid-js/, /@solid/],
},
},
…
With the new version of the vite plugin, you shouldn't need extra configurations anymore.
sometimes I think solids templates and examples are to simply and when added other library it doesnt works as on the example>
I have tried many configurations on example and get all the time
"You appear to have multiple instances of Solid. This can lead to unexpected behavior.
computations created outside a
createRoot or render will never be disposed"
some imports on vitest are ___vite_ssr_importxxx. so not sure if some kind of ssr issue, I also dont ahve error when I inlcude <Suspense on my code, it seems like Effects is nulljust to clarify, when you say vite plugin are we talking about
vite-plugin-solid, or the @solidjs/start/config - and since neither have updated changelogs, can you specify which version?It doesn't really matter, as solid start uses a minimal vitest.config for testing, since vinxi does not yet support testing.
ah okay, so we're awaiting that.
I've already opened an issue with vinxi and asked Nikhil about it, but it's not at the top of his list apparently.
I don't have PNPM to ensure I get the exact same dependency versions, but with getting the latest versions I get the exact same error messages printed to the console.
deps.inline is deprecated and the replacement breaks the tests completely. Either way it still produces the error messages.I still don't know what to about You appear to have multiple instances of Solid. This can lead to unexpected behavior."
also, is supposed to run test on ssr when I am developing on web only? why imports are mentioning __vite_ssr_import_xxx
I think is missing something or a bug on vitest related with environment imports