Fails to run tests with federated module
Describe the bug
Hey folks, I found a problem that I don't know how to solve. I'm using module federation (@originjs/vite-plugin-federation) to get a remote module and since I've added config my tests are failing,
Here is my config:
export default defineConfig(() => ({
plugins: [
ElementPlus(),
vue(),
federation({
name: 'team-red',
remotes: {
"team-blue": "http://localhost:5002/assets/remoteEntry.js",
"team-green": "http://localhost:5001/assets/remoteEntry.js",
},
shared: ['vue','pinia']
})
],
build:{
minify: false,
target: ["chrome89", "edge89", "firefox89", "safari15"],
},
test: {
globals: true,
environment: "happy-dom",
include: ["./src/**/*.{test,spec}.?(c|m)[jt]s?(x)"],
},
}))
I have just tried to mount the component that uses remote components and it gives the following error:
So is there any way to work around it and get my test working?
Reproduction
I have reproduced the error on an example given be vite-plugin-federation https://github.com/adarshdeep-ld/vite-plugin-federation You can clone the above repository and follow steps mention in the following Readme https://github.com/adarshdeep-ld/vite-plugin-federation/blob/main/packages/examples/vue3-advanced-demo/README.md
System Info
Node Version: v20.11.1
pnpm Version: v9.1.0
Used Package Manager
pnpm
Validations
- [X] Follow our Code of Conduct
- [X] Read the Contributing Guidelines.
- [X] Read the docs.
- [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
- [X] Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
- [X] The provided reproduction is a minimal reproducible example of the bug.
Not familiar with module federation ideas, but I'm guessing the whole point of module federation is to not have to unit test entire modules.
If that's the case, they might simply recommend skipping their plugin during unit test by:
plugins: [
...,
!process.env.VITEST && federation({ ... }),
]
Probably, it's better to ask on their end about what's the recommendation.
Any solution for this? Trying to make some unit tests in child components that have a hook imported from Host and getting the same error...
Error: Failed to load url https://.../assets/remoteEntry.js (resolved id: https://.../assets/remoteEntry.js). Does the file exist?
Vitest doesn't support module federation. But even if we did support http imports, this wouldn't work because you need a running server on the localhost:5002 host, and starting a server is out of scope of Vitest.
If you want to test your code that relies on module federation, disable the plugin.