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"
  ]

[wolfeidau]

I fixed this by adding the following fragment to jest.config.js as per https://github.com/kidd3/SL/pull/4.

  "transformIgnorePatterns": [
    "node_modules/(?!jest-test)" + "node_modules/(?!(jest-test))"
  ],

Would it be worth doing a PR for this?

[wolfeidau]

@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.