vue-cli: Jest HelloWorld Test Fails Out of the Box
Version
3.0.0-beta.9
Reproduction link
https://github.com/rgant/vue-helloworld-test-fails
Steps to reproduce
Create new Vue project with Jest unit tests. Run jest.
What is expected?
Initial HelloWorld component test pass
What is actually happening?
Test fails
euphorbus:~/Programming/vue (master)$ vue create tmp2
Vue CLI v3.0.0-beta.9
? Please pick a preset: Manually select features
? Check the features needed for your project: Unit
? Pick a unit testing solution: Jest
? Where do you prefer placing config for Babel, PostCSS, ESLint, etc.? In dedicated config files
? Save this as a preset for future projects? No
Vue CLI v3.0.0-beta.9
✨ Creating project in /Users/rgant/Programming/vue/tmp2.
⚙ Installing CLI plugins. This might take a while...
yarn install v1.6.0
(node:9224) [DEP0005] DeprecationWarning: Buffer() is deprecated due to security and usability issues. Please use the Buffer.alloc(), Buffer.allocUnsafe(), or Buffer.from() methods instead.
info No lockfile found.
[1/4] 🔍 Resolving packages...
[2/4] 🚚 Fetching packages...
[3/4] 🔗 Linking dependencies...
[4/4] 📃 Building fresh packages...
success Saved lockfile.
✨ Done in 19.86s.
🚀 Invoking generators...
📦 Installing additional dependencies...
yarn install v1.6.0
(node:9230) [DEP0005] DeprecationWarning: Buffer() is deprecated due to security and usability issues. Please use the Buffer.alloc(), Buffer.allocUnsafe(), or Buffer.from() methods instead.
[1/4] 🔍 Resolving packages...
[2/4] 🚚 Fetching packages...
[3/4] 🔗 Linking dependencies...
success Saved lockfile.
✨ Done in 4.39s.
⚓ Running completion hooks...
⠁
🎉 Successfully created project tmp2.
👉 Get started with the following commands:
$ cd tmp2
$ yarn serve
euphorbus:~/Programming/vue (master)$ cd tm
tmp/ tmp2/
euphorbus:~/Programming/vue (master)$ cd tmp2
euphorbus:~/Programming/vue/tmp2 (master)$ ls
jest.config.js node_modules package.json public src tests yarn.lock
euphorbus:~/Programming/vue/tmp2 (master)$ ls tests/unit/HelloWorld.spec.js
tests/unit/HelloWorld.spec.js
euphorbus:~/Programming/vue/tmp2 (master)$ cat tests/unit/HelloWorld.spec.js
import { shallow } from '@vue/test-utils'
import HelloWorld from '@/components/HelloWorld.vue'
describe('HelloWorld.vue', () => {
it('renders props.msg when passed', () => {
const msg = 'new message'
const wrapper = shallow(HelloWorld, {
propsData: { msg }
})
expect(wrapper.text()).toMatch(msg)
})
})
euphorbus:~/Programming/vue/tmp2 (master)$ which jest
node_modules/.bin/jest
euphorbus:~/Programming/vue/tmp2 (master)$ jest
FAIL tests/unit/HelloWorld.spec.js
● Test suite failed to run
/Users/rgant/Programming/vue/tmp2/tests/unit/HelloWorld.spec.js:1
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import { shallow } from '@vue/test-utils';
^
SyntaxError: Unexpected token {
at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/script_transformer.js:316:17)
Test Suites: 1 failed, 1 total
Tests: 0 total
Snapshots: 0 total
Time: 1.783s
Ran all test suites.
euphorbus:~/Programming/vue/tmp2 (master)$ cat package.json
{
"name": "tmp2",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve --open",
"build": "vue-cli-service build",
"test": "vue-cli-service test"
},
"dependencies": {
"vue": "^2.5.16"
},
"devDependencies": {
"@vue/cli-plugin-babel": "^3.0.0-beta.9",
"@vue/cli-plugin-unit-jest": "^3.0.0-beta.9",
"@vue/cli-service": "^3.0.0-beta.9",
"@vue/test-utils": "^1.0.0-beta.10",
"babel-core": "^7.0.0-0",
"babel-jest": "^22.0.4",
"vue-template-compiler": "^2.5.13"
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
]
About this issue
- Original URL
- State: closed
- Created 6 years ago
- Comments: 17 (7 by maintainers)
I fixed this by adding the following fragment to
jest.config.js
as per https://github.com/kidd3/SL/pull/4.Would it be worth doing a PR for this?
@LinusBorg totally, would need some investigation. My initial understanding is that it is associated with how jest and babel work together. https://github.com/thymikee/jest-preset-angular/issues/66#issuecomment-323696947 has a note on this.