vuejs / vue-cli

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

migrating towards v5.0.0 of the @vue/cli-plugin-unit-jest is incomplete for vue2 applications #6782

Open stefanlivens opened 2 years ago

stefanlivens commented 2 years ago

Version

5.0.0-beta.6

Environment info

Environment Info:

  System:
    OS: macOS 11.6
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
  Binaries:
    Node: 14.17.0 - /usr/local/bin/node
    Yarn: Not Found
    npm: 6.14.13 - /usr/local/bin/npm
  Browsers:
    Chrome: 94.0.4606.81
    Edge: 95.0.1020.30
    Firefox: 93.0
    Safari: 15.0
  npmPackages:
    @aab/vue-cli-plugin-ibrebuild: ~1.15.1 => 1.15.1 
    @vue/babel-helper-vue-jsx-merge-props:  1.2.1 
    @vue/babel-helper-vue-transform-on:  1.0.2 
    @vue/babel-plugin-jsx:  1.0.7 
    @vue/babel-plugin-transform-vue-jsx:  1.2.1 
    @vue/babel-preset-app:  4.5.13 
    @vue/babel-preset-jsx:  1.2.4 
    @vue/babel-sugar-composition-api-inject-h:  1.2.1 
    @vue/babel-sugar-composition-api-render-instance:  1.2.4 
    @vue/babel-sugar-functional-vue:  1.2.2 
    @vue/babel-sugar-inject-h:  1.2.2 
    @vue/babel-sugar-v-model:  1.2.3 
    @vue/babel-sugar-v-on:  1.2.3 
    @vue/cli-overlay:  4.5.13 
    @vue/cli-plugin-babel: ^4.5.13 => 4.5.13 
    @vue/cli-plugin-eslint: ^4.5.13 => 4.5.13 
    @vue/cli-plugin-router: ^4.5.13 => 4.5.13 
    @vue/cli-plugin-unit-jest: ^4.5.13 => 4.5.13 
    @vue/cli-plugin-vuex: ^4.5.13 => 4.5.13 
    @vue/cli-service: ^4.5.13 => 4.5.13 
    @vue/cli-shared-utils:  4.5.13 
    @vue/component-compiler-utils:  3.2.2 
    @vue/eslint-config-airbnb: ^5.0.2 => 5.3.0 
    @vue/preload-webpack-plugin:  1.1.2 
    @vue/test-utils: ^1.2.2 => 1.2.2 (2.0.0-rc.14)
    @vue/web-component-wrapper:  1.3.0 
    eslint-plugin-vue: ^7.17.0 => 7.17.0 
    jest-serializer-vue:  2.0.2 
    typescript:  3.9.10 
    vue: ^2.6.14 => 2.6.14 (2.6.12)
    vue-cli-plugin-i18n: ^2.1.3 => 2.1.3 
    vue-eslint-parser:  7.11.0 
    vue-hot-reload-api:  2.3.4 
    vue-i18n: ^8.25.0 => 8.25.0 (8.22.2)
    vue-i18n-extract:  1.0.2 
    vue-jest:  3.0.7 
    vue-loader:  15.9.8 (16.5.0)
    vue-meta: ^2.4.0 => 2.4.0 
    vue-router: ^3.5.2 => 3.5.2 
    vue-style-loader:  4.1.3 
    vue-template-compiler: ^2.6.14 => 2.6.14 
    vue-template-es2015-compiler:  1.9.1 
    vuex: ^3.4.0 => 3.6.2 
    vuex-persist:  3.1.3 
  npmGlobalPackages:
    @vue/cli: 4.5.13

Steps to reproduce

vue upgrade --next in a vue2 application with vue-cli@4

this will install the latest versions of the cli-plugins, and will run the migrator script of them. for Vue2 applications, this will result in installing @vue/vue3-jest instead of the vue2 variant. So running the unit-tests will fail. (because jest expects this for the .vue files)

What is expected?

When I have a vue2 application, and 'upgrade' to the latest versions, the correct packages are installed.

What is actually happening?

Even with a vue2 application, I get the @vue/vue3-jest :'^27.0.0-alpha.1' package, so I have to manually install the right one (@vue/vue2-jest@27.0.0-alpha.2)


My feeling is the migrator/index.js is not 'complete' enough. Right now it only contains a check like this:

if (!allDeps['vue-jest']) { // Likely a Vue 2 project, and uses the builtin preset. newDevDeps['@vue/vue3-jest'] = '^27.0.0.alpha.1' }

I think this needs to be corrected or expanded to make the distinction between vue2 and vue3. Maybe like this (pseudocode):

if (!allDeps['vue-jest']) { // Likely a vue-cli@4 application, and uses the builtin preset. if (vue2) { newDevDeps['@vue/vue2-jest'] = '^27.0.0-alpha.2' } if (vue3) { newDevDeps['@vue/vue3-jest'] = '^27.0.0-alpha.1' } }

I'm happy to create a PR for it, but I want first to hear your opinion, because i'm not 100% clear about the "!allDeps['vue-jest'] => Likely a Vue 2 project, and uses the builtin preset."

Thanks in advance.

cexbrayat commented 2 years ago

Hi @stefanlivens and thank you for opening this issue. I'm the one who introduced this regression in #6627 , my bad. I just changed the existing code without thinking too much about it (I was focused on Vue 3 support).

Please open a PR and I'll gladly review it 👍. Maybe we should even have a test for this migration (I assumed there was one, but obviously there is none otherwise we would have caught this).

stefanlivens commented 2 years ago

Here you go: very very basic: https://github.com/vuejs/vue-cli/pull/6794