When trying to run jest tests for a simple vue.js-view I get an error about "Jest encounter[ing] an unexpected token". It seems like babel is not correctly transpiling the ScaleLoader, although it should?!
Without the ScaleLoader the tests run successfully. I am using vue-spinner in version 1.0.4.
=> How can I run these tests successfully without errors?
// inventory_taking.spec.js
import InventoryTaking from "../InventoryTaking.vue";
import {shallowMount} from "@vue/test-utils";
describe("InventoryTaking", () => {
const wrapper = shallowMount(InventoryTaking);
it("renders correctly", () => {
expect(wrapper).toBeTruthy();
});
});
// InventoryTaking.vue
<template>
</template>
<script>
import ScaleLoader from "vue-spinner/src/ScaleLoader";
export default {
name: "InventoryTaking",
components: {
ScaleLoader,
},
};
</script>
// Error message
● Test suite failed to run
Jest encountered an unexpected token
This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.
By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".
Here's what you can do:
• To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
• If you need a custom transformation specify a "transform" option in your config.
• If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.
You'll find more details and examples of these config options in the docs:
https://jestjs.io/docs/en/configuration.html
Details:
.../node_modules/vue-spinner/src/ScaleLoader.vue:1
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){<template>
^
SyntaxError: Unexpected token <
3 |
4 | <script>
> 5 | import ScaleLoader from "vue-spinner/src/ScaleLoader";
| ^
6 |
7 | export default {
8 | name: "InventoryTaking",
at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/script_transformer.js:403:17)
at src/views/InventoryTaking.vue:5:1
at Object.<anonymous> (src/views/InventoryTaking.vue:29:3)
//jest.config.js
module.exports = {
moduleFileExtensions: [
'js',
'jsx',
'json',
'vue'
],
transform: {
'^.+\\.vue$': 'vue-jest',
'^.+\\.jsx?$': 'babel-jest'
},
moduleNameMapper: {
'^@/(.*)$': '<rootDir>/src/$1'
},
snapshotSerializers: [
'jest-serializer-vue'
],
setupFiles: [
"<rootDir>/src/utils/browser_mocks.js"
]
}
Aucun commentaire:
Enregistrer un commentaire