Jest coverage showing 1/1 statements for .vue file when file has import

Version

5.0.1

Environment info

System:
  OS: Linux 5.4 Ubuntu 20.04.4 LTS (Focal Fossa)
  CPU: (8) x64 Intel(R) Core(TM) i5-10210U CPU @ 1.60GHz
Binaries:
  Node: 14.19.0 - /usr/local/bin/node
  Yarn: Not Found
  npm: 6.14.16 - /usr/local/bin/npm
Browsers:
  Chrome: 99.0.4844.51
  Firefox: 97.0.2
npmPackages:
  @vue/babel-helper-vue-jsx-merge-props:  1.2.1 
  @vue/babel-helper-vue-transform-on:  1.0.2 
  @vue/babel-plugin-jsx:  1.1.1 
  @vue/babel-plugin-transform-vue-jsx:  1.2.1 
  @vue/babel-preset-app:  5.0.1 
  @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:  5.0.1 
  @vue/cli-plugin-babel: ~5.0.0 => 5.0.1 
  @vue/cli-plugin-router:  5.0.1 
  @vue/cli-plugin-unit-jest: ~5.0.0 => 5.0.1 
  @vue/cli-plugin-vuex:  5.0.1 
  @vue/cli-service: ~5.0.0 => 5.0.1 
  @vue/cli-shared-utils:  5.0.1 
  @vue/component-compiler-utils:  3.3.0 
  @vue/test-utils: ^1.1.3 => 1.3.0 
  @vue/vue2-jest: ^27.0.0-alpha.2 => 27.0.0-alpha.4 
  @vue/web-component-wrapper:  1.3.0 
  jest-serializer-vue:  2.0.2 
  vue: ^2.6.14 => 2.6.14 
  vue-hot-reload-api:  2.3.4 
  vue-loader:  17.0.0 (15.9.8)
  vue-style-loader:  4.1.3 
  vue-template-compiler: ^2.6.14 => 2.6.14 
  vue-template-es2015-compiler:  1.9.1 
npmGlobalPackages:
  @vue/cli: 5.0.1

Steps to reproduce

Create project using vue create (manually, make sure to select Babel and Unit Testing as options, select Vue 2, select Jest as unit testing solution). Add collectCoverage: true to jest.config.js/package.json. Make random component and import it inside HelloWorld.vue, also add random method inside HelloWorld.vue.

What is expected?

After running npm run test:unit coverage should report that HelloWorld.vue has lines that are not covered

What is actually happening?

Coverage reports that HelloWorld.vue has 100% coverage and that it has 1/1 statements

[websmurf]

I’ve narrowed it down to the period where we switched from Node 14 to 16 and vue-jest to newer versions. The node 16 upgrade itself didn’t break coverage, but this change did:

Difference in coverage:

[iamface]

Try making sure all of the vue-cli stuff you can is version 4.5.17. I found that ultimately that was my problem and I was able to fix the issue by making sure my versions matched across those particular packages.

I have one project using ~4.5.0 and everything works fine. A newer project with ~5.0.0 is where I have this problem but am unable to downgrade.

One workaround I have found is to asynchronously load imported components (does not work with other imports such as mixins or common js)

// bad
import Component from '@/Component`
components: { Component }

// good
components: {
  Component: () => import('@/Component')
}