vitest-dev / vitest-dev/vitest
Error when using @vue/compat.
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 17.1k
- Forks
- 2k
- Avg merge
- 1d 22h
- Merged PRs (30d)
- 94
Description
Describe the bug
When using the build @vue/compat and installing it according to the migration guide (ie: using alias in vite), the tests fail with the following message:
TypeError: Cannot read properties of null (reading 'isCE')
This happens when you try to render a component with a slot.
Looking around, I have found this is a very similar issue than: https://github.com/vitest-dev/vitest/issues/1886. Following the instructions here, I have managed to add @vue/test-utils to the inlined dependencies (as you can see in the reproduction).
The issue happens whenever adding @testing-library/vue. The tests using testing-library now also fail due to the same reason. At this point I have tried multiple combinations of inlining dependencies without much luck.
If I manually edit the node_modules/@vue/test-utils/dist/vue-test-utils.cjs.js file and change the vue import to @vue/compat, both of the tests work.
I suspect the solution might be simpler and would also happily contribute in case its needed.
Thank you!
Reproduction
https://github.com/bernardocorbella/vue-compat-vite-slot-error
You can see the test file in which one test passes and one fails.
System Info
System:
OS: macOS 14.1.1
CPU: (8) arm64 Apple M1
Memory: 75.09 MB / 16.00 GB
Shell: 5.9 - /bin/zsh
Binaries:
Node: 18.18.2 - ~/.volta/tools/image/node/18.18.2/bin/node
Yarn: 1.22.19 - ~/.volta/tools/image/yarn/1.22.19/bin/yarn
npm: 9.4.0 - ~/.volta/tools/image/npm/9.4.0/bin/npm
pnpm: 8.11.0 - ~/.volta/bin/pnpm
Browsers:
Chrome: 119.0.6045.159
Safari: 17.1
npmPackages:
@vitejs/plugin-vue: ^4.4.0 => 4.5.0
vite: ^4.4.11 => 4.5.0
vitest: ^0.34.6 => 0.34.6
Used Package Manager
pnpm
Validations
- Follow our Code of Conduct
- Read the Contributing Guidelines.
- Read the docs.
- Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
- Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
- The provided reproduction is a minimal reproducible example of the bug.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the linked reproduction and its src/components/tests/HelloWorld.spec.ts test file, then run the failing slot test with the reported @vue/compat, Vite, Vitest, and testing-library setup. Compare the passing and failing cases while checking dependency inlining and the import behavior described in the issue; done means both tests pass without manually editing node_modules.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript, vite
- Domain
- testing, tooling
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100