jest-vue-preprocessor
jest-vue-preprocessor copied to clipboard
Tests fail when Code splitting components
I'm submitting a ... (check one with "x")
[ ] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[x] support request
Current behavior Testing vue components with code splitting is throwing on the import
Minimal reproduction of the problem with instructions Create a component that async loads other components:
<script>
const Modal = () => import(/* webpackChunkName: "Modal" */ "@/pages/common/Modal.vue");
export default {
name: "TileEditModal",
components: {
Modal
},
data() {
return
},
methods: {
test() {
return true;
}
}
}
</script>
Create a tests, upon running jest it throws an exception on the import
same problem here;
@LanFeusT23 did you come up with a solution for this?
Nope, we decided not to code split down to components. We code split on routes only so we don't have this issue. It was ok with us because our modals were really small and code splitting was not gaining much.
@LanFeusT23 here is what you need to do:
yarn add --dev babel-plugin-dynamic-import-node
Then in the .babelrc
-file
"presets" [
// ...
],
// add env specific configuration
"env": {
"test": {
"plugins": [
"transform-runtime",
"dynamic-import-node" // <-- this is the important line
]
}
}
This is still a problem for me. The solution posted by @rudionrails does not work.