Vue test coverage with Jest only checks imports

Viewed 211

I'm testing my vue.js 2 project with jest and vue-test-utils, the test works fine, but I've a problem when I try to measure the coverage of .vue files.

The problem is that when I execute jest --coverage I obtain 100% of coverage in those files, but if i enter to inspect which lines are coverage I see only the imports have been checked for Jest coverage and the rest of the code No (You can see that in the second picture.)

enter image description here

enter image description here

If you need more info please leave me a commend. Thanks

This is my package.json (only relevant info):

"scripts": {
  "test": "jest --coverage",
 },
"dependencies": {
    "core-js": "3.20.3",
    "single-spa-vue": "2.5.0",
    "systemjs-webpack-interop": "2.3.7",
    "vue": "2.6.14",
    "vue-i18n": "8",
    "vue-router": "3.5.2"
  },
"devDependencies": {
    "@vue/cli-plugin-unit-jest": "~4.5.19",
    "@vue/cli-service": "~4.5.19",
    "@vue/test-utils": "^1.3.0",
    "babel-jest": "^26.6.3",
    "jest": "^26.6.3",
    "jest-junit": "^13.0.0",
    "jest-transform-stub": "^2.0.0"
}

And my `jest.config.js`:


    ```
const alias = require("./aliases.config");

module.exports = {
  moduleFileExtensions: ["js", "vue", "json"],
  transform: {
    "^.+\\.js$": "babel-jest",
    "^.+\\.vue$": "vue-jest",
    ".+\\.(css|styl|less|sass|scss|jpg|jpeg|png|svg|gif|eot|otf|webp|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga|avif)$":
      "jest-transform-stub",
  },
  preset: "@vue/cli-plugin-unit-jest",
  testPathIgnorePatterns: ["/node_modules/"],
  modulePathIgnorePatterns: ["/node_modules/"],
  testMatch: ["**/tests/unit/**/*.(unit|test|spec).js"],
  collectCoverage: false,
  collectCoverageFrom: [
    "<rootDir>/src/**/*.{vue,js}",
    "!<rootDir>/src/main.js",
    "!<rootDir>/src/set-public-path.js",
    "!<rootDir>/src/router/index.js",
  ],
  coverageDirectory: "reports/unit-reports/coverage",
  coverageReporters: ["text-summary", "html", "cobertura"],
  moduleNameMapper: {
    ...alias.forJest,
    "@divilo/styleguide-base-front":
      "<rootDir>/tests/mocks/styleguide-base-front.js",
    "@divilo/api-mfes-front": "<rootDir>/tests/mocks/api-mfes-front.js",
  },
  coverageProvider: "babel",
  coverageThreshold: {
    global: {
      branches: 80,
      functions: 80,
      lines: 80,
      statements: -10,
    },
  },
  reporters: [
    "default",
    [
      "jest-junit",
      {
        outputDirectory: "reports/unit-reports/tests",
        outputName: "junit.xml",
      },
    ],
  ],
};
0 Answers
Related