Open JamesCoyle opened 5 years ago
I have a similar problem with vscode-jest and vue-jest. The configuration seems right because the tests are being found and run however they all fail on import Vue from 'vue'
.
FAIL src/XXX.Web/ClientApp/components/auth/__tests__/login.spec.js
● Test suite failed to run
Jest encountered an unexpected token
This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.
By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".
Here's what you can do:
• To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
• If you need a custom transformation specify a "transform" option in your config.
• If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.
You'll find more details and examples of these config options in the docs:
https://jestjs.io/docs/en/configuration.html
Details:
F:\dev\win\Workspaces\trunk\src\XXX.Web\test-setup.js:1
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import Vue from 'vue';
^^^^^^
SyntaxError: Unexpected token import
at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/ScriptTransformer.js:440:17)
I tried providing a babel config directly in vue-jest config babel section but it is not run prior to the tests executing, or it if is the debug option isnt printing anything. The verbose flag also seems to be ignored.
module.exports = {
verbose: true,
modulePaths: ['<rootdir>/ClientApp'],
moduleFileExtensions: ['js', 'json', 'vue'],
moduleNameMapper: {
'\\.(css|styl|less|sass|scss|jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$': '<rootDir>/JestConfig/assetTransformer.js'
},
modulePathIgnorePatterns: ['bin/*', 'coverage/*', 'logs/*', 'obj/*', 'wwwroot/*'],
globals: {
NODE_ENV: 'test',
'vue-jest': {
babelConfig: {
presets: [
[
'@babel/env',
{
targets: 'current node',
useBuiltIns: 'usage',
modules: 'commonjs',
debug: true
}
]
],
plugins: ['transform-es2015-modules-commonjs', 'babel-plugin-dynamic-import-node']
}
}
},
transform: {
'^.+\\.js$': 'babel-jest',
'^.+\\.vue$': 'vue-jest'
},
setupFiles: ['./test-setup.js'],
transformIgnorePatterns: ['node_modules/(?!(vue-full-calendar)/)']
}
In my case my src files are several directories under the opened workspace folder in vs code. This is because its an enterprise application with multiple project modules. I am providing absolute paths to both jest.pathToConfig
and jest.pathToJest
. These paths are on a different partition (F:)/dual boot shared drive then the installed vs code (C:). I dont think this should have an impact though.
"jest.autoEnable": true,
"jest.debugMode": true,
"jest.pathToConfig": "F:/dev/win/Workspaces/trunk/src/DCATS.Web/jest.config.js",
"jest.pathToJest": "F:/dev/win/Workspaces/trunk/src/DCATS.Web/node_modules/.bin/jest"
Interesting that after the --watch fails to start manually starting the jest runner clicking debug on an individual test breaks inside my custom babel config.js even with the above vue-jest babel config.
Related Jest issue: facebook/jest#9430
Environment
node -v
: [v10.13.0]npm -v
: [6.4.1]npm ls jest
: [23.6.0]your vscode-jest settings if customized:
Operating system: [Windows 7]
Prerequisite
Steps to Reproduce
Run tests in console -> tests pass correctly
View autorun result in output -> test fails as babel not run for some reason
Relevant Debug Info
package.json details
I doubt this is a configuration issue as there are several other issues open with very similar issues. #395 #408 #415
I did have issues getting the new babel version working from
@babel/core
rather thanbabel-core
which is why I'm also usingbabel-core@7.0.0-bridge.0
. Not sure if this is related and perhaps we need to wait for Jest to support@babel/core
natively without needing the bridge.