[Bug]: Unexpected value 'Module' imported by the module 'DynamicTestModule'. Please add an @NgModule annotation - while Module from library present in transformIgnorePatterns about jest-preset-angular

[polonmedia]

I tried this config

with this package.json ("@angular/core": "^13.0.0")

and still i have this shit

bro wtf, there is no winning, whatever I use in whatever sense - always an issue

[ahnpnl]

Did you check https://thymikee.github.io/jest-preset-angular/docs/guides/angular-13+?

[polonmedia]

@ahnpnl yes, I did, I started with it, but there are always the same or similiar issues, mainly comming from node_modules

[ahnpnl]

The error I can see coming from a library you are using angular-support-bot, this would mean you need to tell Jest to transform the library files via transformIgnoredPatterns. That library has a folder node_modules which Jest complains about.

[polonmedia]

No, this isnt a library, its an app that I try to use the jest in

[polonmedia]

It isnt even clear from the link u sent - should I use the jest.config.ts from here

or from example?

[ahnpnl]

It isnt even clear from the link u sent - should I use the jest.config.ts from here or from example?

This is the part if you want to use ESM mode (The title "Use ES modules" seems to be not clear enough)

In your case, js or ts config file isn't related. The problem is about Jest can't transform files from your node_modules for some reasons. The only way to fix is modifying transformIgnorePatterns.

If your project doesn't have any custom config on transforming files, perhaps you can compare your project config with example project https://github.com/thymikee/jest-preset-angular/blob/main/examples/example-app-v13/jest.config.js?

Another way is configuring moduleNameMapper to tell Jest where to load things.

[polonmedia]

I also noticed that u enable this - skipNgcc: false,
but whenever I dont turn it to true, the following happens:

can it be somehow related?

I follow the exact config as u have in example for esm modules (npm run test-esm)

[polonmedia]

If i skip it, following happens:

am i mentally challanged? something seems off whatever i try to do

[ahnpnl]

I'd recommend to keep skipNgcc: false, this ensures you are compatible with future Angular versions, in v16 they removed View Engine.

It's hard to check about this without a repo. Maybe you can somehow replicate the issue in the example-app-v13?

[polonmedia]

@ahnpnl brother, i added this to the mjs config

but i get those errors now:


could u advise me to what direction should i look for?

[ahnpnl]

I can see that you are running Jest in ESM mode. The 2nd screenshot has a lib called cytiva-cui-design-ng and the js of this lib is loaded with umd. Maybe you can use moduleNameMapper to instruct Jest to load mjs file instead?

Moving to ESM mode is a very big thing btw. Normally I make CJS mode work first before trying out ESM mode.

[polonmedia]

@ahnpnl thank u for your patience and responding to me, I managed to get past the config with your guidance and tests are almost working, I have one issue left to which I cannot comprehend and to which I cannot find a clear answer

I get this error while trying to use modules from my components library

This is how my library is in dist folder:

(I think it may be related) As I mentioned before, I have issue with running ngcc which produces following error

Could you perhaps point me to direction I should take to resolve this?

[polonmedia]

I managed to tell ngcc to ignore the lib via this config:

But didnt resolve my issue

[polonmedia]

Bumping to angular ver 14 didnt resolve nothing also