-
Notifications
You must be signed in to change notification settings - Fork 2.4k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
How to set transformIgnorePatterns to fix "Jest encountered an unexpected token" #812
Comments
Nevermind, obviously it's However, the problem is still there even when adding that config 🤔 |
I had to remove the const esModules = ['@agm', 'ngx-bootstrap'].join('|');
// ...
module.exports = {
//...
transformIgnorePatterns: [`/node_modules/(?!${esModules})`],
// ...
}; |
Yes, that confirms what I just discovered while debugging Jest. The `/absolute/path/to/project/libs/libname/node_modules//(?!lodash-es/.*) |
I've been debugging this for the last hour. |
I finally fixed the issue by adding |
One other option is to pull in From the jest-preset-angular docs:
We took that and tweaked it to only pass the js files needed through: const esModules = ['@agm', 'ngx-bootstrap', 'lodash-es'].join('|');
module.exports = {
// ...
transform: {
[`(${esModules}).+\\.js$`]: 'babel-jest',
'^.+\\.(ts|js|html)$': 'jest-preset-angular/preprocessor.js',
// ...
},
transformIgnorePatterns: [`/node_modules/(?!${esModules})`],
// ...
}; |
I have the similar problem when trying to debug jest tests in VS Code:
It is a Debugger works, the breakpoint is hit. But got the error from above.
Any idea what might be wrong? Thank you. |
@skorunka have a look at https://github.com/nrwl/nx/blob/master/packages/builders/src/jest/jest.builder.ts When you run your tests via |
@luchsamapparat Hi, could you please share your modified |
I have added
and now there is no problem with HTML. But the easy test for checking that the components can be created fails. It works from command line.
The breakpoint is hit, but the Command line works es expected: Any idea what I'm still missing in here? This drives me crazy. I love jest, but making it work/debug in Angular + VS Code is painful. |
Solved this without
Where ng2-tel-input was the problematic module, getting it for the following environment: Jest 23.6.0, @nrwl/builders 7.5.1, @nrwl/nx 7.5.1, @nrwl/schematics 7.5.1. jest-preset-angular 6.0.1. |
Update: apologizes for the mistake, you have to include |
@llwt Where can I find the |
8.0.0 no longer has preprocessor.js in source . It is now delegated fully to ts-jest. Jest-preset-angular only applies custom ast transformers to ts-jest to alter the compiled output. |
Still same issue with anagular, jest-babel does not work and I actually do not want to meess both of them just because of this lodash-es stuff... |
the only thing that worked for me was to add this to the main
make sure you have |
Hi @danieldanielecki thank you so much for your answer. I'm wondering how did you find out which module was the problematic module? Thanks~ |
Sorry, but don't remember now... For sure it was one of those which caused errors on Server-Side Rendering (SSR)/Angular Universal. |
I am using deepdash in place of loadash added below in jest.preset.js
and created a new file babel.config.json and added
and inside individual lib jest.config.js added
in tsconfig.spec.json added "allowJs": true, nothing is working, still the issue persists, could you please help on this. |
This is what worked for me. We were having issues consuming Thanks @llwt 🙂
|
Keywords: monorepo jest typescript create-react-app Works: Error:
Workaround:
|
Actually this one is better
Because mapping to |
for next release of nx(11.5.2) you can do this to fix the issue. create babel.config,js in the root of the workspace and add this then in your jest,config.js add this |
I was not able to get this solution to work.
Instead I wrote it like this and it worked:
|
For anyone that is still running into this issue in the context of a monorepo (yarn workspace in my case), make sure that you are not hoisting the package that needs to be transpiled. The solution that worked for me:
module.exports = {
presets: [['@babel/preset-env']],
} Jest config: const esModules = ['ipld-hashmap'].join('|') // can add other packages here
module.exports = {
...
transform: {
'^.+\\.ts$': 'ts-jest',
"^.+\\.js?$": "babel-jest"
},
transformIgnorePatterns: [`<rootDir>/node_modules/(?!${esModules})`],
...
} Root "workspaces": {
"packages": ["packages/*"],
"nohoist": ["**/ipld-hashmap", "**/ipld-hashmap/**"]
} Any one of those four things (nohoist, transform, transformIgnorePatterns, and babel config) missing & it won't work. |
I had this issue with Swiper and was able to get it to work by using the following in the app's transformIgnorePatterns: ['node_modules/(?!(.*\\.mjs$|swiper|ssr-window|dom7))'],
modulePaths: ['<rootDir>/../../node_modules/swiper/angular/'], Swiper depends on Note that |
I had this issue with react-merge-refs while using The problem? If you're setting this up for an error coming from a
This is in addition to the transformIgnorePatterns. |
In case it helps anyone - in my case, using a monorepo with transform: {
'\\.[tj]sx?$': ['babel-jest', { rootMode: 'upward' }]``
} without the |
asztal solution works for me with Nx 15.x, Angular 15.x and Jest 28.x |
This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context. |
First of all, thanks for bringing Jest to Angular!
I previously had configured Jest in my Angular project by myself. In order to use
lodash-es
, I had to settransformIgnorePatterns
to inlude the path tolodash-es
:Now, after migrating to the Jest config provided by Nx, I don't know where I can set this option. My tests currently fail with this error:
Thanks for your help
The text was updated successfully, but these errors were encountered: