When I run jest --coverage
jest only collects coverage from JavaScript files, but not my vue files. The folder structure is correct. jest.config.js
is in the root folder, just like /components
and /lib
. For me, there is no logical explanation why coverage is collected from JavaScript files but not from vue files.
Here is my jest.config.js
module.exports = {
verbose: true,
setupFilesAfterEnv: ['<rootDir>/test-framework-scripts.js'],
moduleFileExtensions: [
'js',
'jsx',
'json',
'vue',
'node',
],
moduleNameMapper: {
'^@/(.*)$': '<rootDir>/$1',
},
moduleDirectories: [
'node_modules',
'bower_components',
'shared',
'test/tmp',
],
transform: {
'^.+\\.vue$': 'vue-jest',
'.+\\.(css|styl|less|sass|scss|png|jpe?g|ttf|woff|woff2)$': 'jest-transform-stub',
'^.+\\.js$': 'babel-jest',
'^.+\\.svg$': '<rootDir>/jest-svg-transform.js',
'\\.(gql|graphql)$': 'jest-transform-graphql',
},
transformIgnorePatterns: [
'<rootDir>/node_modules/(!gsap)',
],
snapshotSerializers: [
'jest-serializer-vue',
],
testMatch: [
'<rootDir>/test/**/*.spec.(js|jsx|ts|tsx)',
],
testPathIgnorePatterns: [
'<rootDir>/test/client/shared-examples/',
],
testURL: 'http://localhost/',
watchPlugins: [
'jest-watch-typeahead/filename',
'jest-watch-typeahead/testname',
],
collectCoverageFrom: [
'components/**/*.{js,vue}',
'layouts/**/*.{js,vue}',
'lib/**/*.{js,vue}',
'middleware/**/*.{js,vue}',
'mixins/**/*.{js,vue}',
'pages/**/*.{js,vue}',
'store/**/*.{js,vue}',
'!<rootDir>/node_modules/**',
'!<rootDir>/test/**',
],
coverageReporters: ['text', 'html'],
};
package.json
{
"name": "stockpicker",
"version": "1.0.0",
"description": "a stockpicker",
"author": "Nico Meyer",
"private": true,
"scripts": {
"dev": "nuxt",
"build": "nuxt build",
"start": "nuxt start",
"generate": "nuxt generate",
"lint": "eslint --ext .js,.vue --ignore-path .gitignore .",
"precommit": "npm run lint",
"test": "jest",
"test.watch": "jest --watch"
},
"dependencies": {
"@fortawesome/fontawesome-svg-core": "^1.2.26",
"@fortawesome/free-solid-svg-icons": "^5.12.0",
"@fortawesome/vue-fontawesome": "^0.1.9",
"@nuxtjs/axios": "^5.3.6",
"axios": "^0.19.2",
"bootstrap-vue": "^2.3.0",
"chai": "^4.2.0",
"core-js": "^2.6.11",
"cross-env": "^5.2.0",
"firebase": "^7.8.0",
"js-cookie": "^2.2.1",
"moment": "^2.24.0",
"nuxt": "^2.11.0",
"vue": "^2.6.11",
"vue-async-computed": "^3.6.1",
"vue-clickaway2": "^2.3.1",
"vue2-touch-events": "^2.1.0",
"vuex": "^3.1.2"
},
"devDependencies": {
"@babel/core": "^7.8.4",
"@babel/preset-env": "^7.8.4",
"@nuxtjs/eslint-config": "^0.0.1",
"@vue/test-utils": "^1.0.0-beta.31",
"babel-core": "^7.0.0-bridge.0",
"babel-eslint": "^10.0.1",
"babel-jest": "^25.1.0",
"eslint": "^5.3.0",
"eslint-config-airbnb-base": "^13.1.0",
"eslint-config-standard": ">=12.0.0",
"eslint-import-resolver-webpack": "^0.11.1",
"eslint-loader": "^2.1.2",
"eslint-plugin-import": "^2.17.2",
"eslint-plugin-jest": ">=22.3.0",
"eslint-plugin-node": ">=8.0.1",
"eslint-plugin-nuxt": ">=0.4.2",
"eslint-plugin-promise": ">=4.0.1",
"eslint-plugin-standard": ">=4.0.0",
"eslint-plugin-vue": "^5.2.2",
"jest": "^25.1.0",
"jest-expect-message": "^1.0.2",
"jest-extended": "^0.11.5",
"jest-serializer-vue": "^2.0.2",
"jest-transform-graphql": "^2.1.0",
"jest-transform-stub": "^2.0.0",
"jest-watch-typeahead": "^0.4.2",
"jsdom": "^15.1.0",
"jsdom-global": "^3.0.2",
"node-sass": "^4.13.1",
"nodemon": "^1.18.9",
"resolve-url-loader": "^3.1.0",
"sass-loader": "^7.1.0",
"vue-jest": "^3.0.5",
"webpack": "^4.32.0"
}
}
Can you tell me what's wrong here?
Its a regression in jest v25. Nothing can be done at the moment. The issue opened in jest repo https://github.com/facebook/jest/issues/9490
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With