vuejs / vue-cli

🛠️ webpack-based tooling for Vue.js Development
https://cli.vuejs.org/
MIT License
29.75k stars 6.33k forks source link

Tests fails immediately after bootstrap #2347

Closed pomle closed 6 years ago

pomle commented 6 years ago

Version

3.0.1

Reproduction link

https://github.com/pomle/vue-test-fail-bug

Node and OS info

Node 10.2.1, Yarn 1.7.0

Steps to reproduce

  1. Run vue create [app].
  2. Run yarn run test:unit

Full cli output presented below.

➜ Development vue create amuse-alfre6

Vue CLI v3.0.1 ? Please pick a preset: Manually select features ? Check the features needed for your project: Babel, TS, Router, CSS Pre-processors, Linter, Unit, E2E ? Use class-style component syntax? Yes ? Use Babel alongside TypeScript for auto-detected polyfills? Yes ? Use history mode for router? (Requires proper server setup for index fallback in production) Yes ? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by default): SCSS/SASS ? Pick a linter / formatter config: TSLint ? Pick additional lint features: Lint on save ? Pick a unit testing solution: Jest ? Pick a E2E testing solution: Cypress ? Where do you prefer placing config for Babel, PostCSS, ESLint, etc.? In package.json ? Save this as a preset for future projects? Yes ? Save preset as: pontus-first-vue-test

Vue CLI v3.0.1 ✨ Creating project in /Users/pom/Development/amuse-alfre6. 🗃 Initializing git repository... ⚙ Installing CLI plugins. This might take a while...

yarn install v1.7.0 info No lockfile found. [1/4] 🔍 Resolving packages... ⠁ (node:78925) [DEP0005] DeprecationWarning: Buffer() is deprecated due to security and usability issues. Please use the Buffer.alloc(), Buffer.allocUnsafe(), or Buffer.from() methods instead. [2/4] 🚚 Fetching packages... [3/4] 🔗 Linking dependencies... [4/4] 📃 Building fresh packages... success Saved lockfile. ✨ Done in 164.43s. 🚀 Invoking generators... 📦 Installing additional dependencies...

yarn install v1.7.0 [1/4] 🔍 Resolving packages... ⠁ (node:78974) [DEP0005] DeprecationWarning: Buffer() is deprecated due to security and usability issues. Please use the Buffer.alloc(), Buffer.allocUnsafe(), or Buffer.from() methods instead. [2/4] 🚚 Fetching packages... [3/4] 🔗 Linking dependencies... [4/4] 📃 Building fresh packages... success Saved lockfile. ✨ Done in 25.88s. ⚓ Running completion hooks...

📄 Generating README.md...

🎉 Successfully created project amuse-alfre6. 👉 Get started with the following commands:

$ cd amuse-alfre6 $ yarn serve

➜ Development cd amuse-alfre6 ➜ amuse-alfre6 git:(master) yarn run test:unit yarn run v1.7.0 $ vue-cli-service test:unit FAIL tests/unit/HelloWorld.spec.ts ● Test suite failed to run

/Users/pom/Development/amuse-alfre6/tests/unit/HelloWorld.spec.ts:3
import "core-js/modules/es6.array.iterator";
       ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

SyntaxError: Unexpected string

  at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/script_transformer.js:403:17)

Test Suites: 1 failed, 1 total Tests: 0 total Snapshots: 0 total Time: 1.4s Ran all test suites. error Command failed with exit code 1. info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

What is expected?

Test should succeed.

What is actually happening?

Tests fail.

awulkan commented 6 years ago

I have a related problem. I tried installing the standard ESLint config along with Cypress. During the installation the ESLinter tried to lint Cypress, causing a failure with exit code 1.

https://pastebin.com/3pK7uNsM

Using the latest Node and NPM version on Windows 10.

alexbruno commented 6 years ago

I have no problem here, and I chose similar configs to Typescript. But I chose: Use class-style component syntax? No After project bootstrap first thing I did was runing unit test and it works.

AlexandreBonaventure commented 6 years ago

Don't know if it's related but with the new cypress 3.1.0 I get this error 'import' and 'export' may appear only with 'sourceType: module' inside the cypress UI. Works again when I downgrade the resolution to be @3.0.3

Kocal commented 6 years ago

Got the same issue when running Jest on TypeScript tests (importing TypeScripts files). Running jest with --no-cache seems to works.

Akryum commented 6 years ago

Try to clear Jest cache. You can find the cache location by running jest --showConfig. Look for cacheDirectory key. Its value is the name of the folder you'll need to remove.

Kocal commented 6 years ago

Deleted everything in my Jest cache folder (/tmp/jest_rs) as @Akryum suggested, it's now working perfectly :+1: (no need to manually pass --no-cache flag).

Maybe the cache was corrupted? :thinking:

fourcube commented 6 years ago

I'm using a TypeScript + Babel + Jest Config. Unfortunately clearing the cache did not solve the problem for me:

$ node_modules/.bin/jest --showConfig | jq .configs[0].cacheDirectory                                   
"/var/folders/hw/j2k3lbr954bfvmh7dcngxdqh0000gn/T/jest_dx"
$ rm -r /var/folders/hw/j2k3lbr954bfvmh7dcngxdqh0000gn/T/jest_dx
$ yarn test:unit
 FAIL  tests/unit/HelloWorld.spec.ts
  ● Test suite failed to run

    /Users/chris.grieger/Projects/unittest/tests/unit/HelloWorld.spec.ts:3
    import "core-js/modules/es6.array.iterator";
           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

    SyntaxError: Unexpected string

      at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/script_transformer.js:403:17)
coun7zero commented 6 years ago

I had a similar problem with TypeSript + Jest when spec files were JS or spec files were TS and tested files were JS. Now I use configuration without TS support - as I assume for correctly work I should rewrite all related files to TypeScript.

Interesting fact is that before I updated babel-jest to 23.4.2 I also had similar symptoms with Babel + Jest.

I came across situation with newest Cypress described by @AlexandreBonaventure. Probably it's connected with Babel 7. The problem is when you trying to use import inside spec files:

/home/xxx/projects/yyy/node_modules/@babel/runtime/helpers/builtin/es6/interopRequireDefault.js:1
export default function _interopRequireDefault(obj) {
^
ParseError: 'import' and 'export' may appear only with 'sourceType: module'

As mentioned above, the simplest way to fix that is downgrade Cypress to 3.0.1.

haoqunjiang commented 6 years ago

Closing in favor of https://github.com/vuejs/vue-cli/issues/1879

If you are still experiencing this bug, try also to clear node_modules and remove package-lock.json and rerun npm install .