jest-preset-angular: After upgrade Angular to v8: Can't resolve all parameters for Component: (?).

Hi folks,

I recently upgraded my application to Angular 8 and couldn’t get the tests to run successfully with Jest-Preset-Angular resulting in the error below telling me it cannot resolve the constructor dependencies although it works fine using Karma and was working with Angular 7.

Can't resolve all parameters for AppComponent: (?).

I’ve created a newly generated Angular 8 application to see if it has something to do with my migration and I ended up having the same issue.

Here is the reproduction repository (Jest configuration is in package.json): https://github.com/jfcere/jest-preset-angular-issue

Thanks in advance!

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Reactions: 8
  • Comments: 28

Commits related to this issue

Most upvoted comments

TL;DR

tsconfig.spec.json

   "compilerOptions": {
+    "emitDecoratorMetadata": true,
     "outDir": "./out-tsc/spec",

Issue

The Angular CLI takes over some of the TS -> JS transpilation using transformers, especially when it’s about the decorators and reflection. We were not aware of this change, but it appearently came in in Angular v8.1.

Here the full PR: https://github.com/angular/angular-cli/pull/14473

We can try to reuse their transformer (https://github.com/angular/angular-cli/blob/master/packages/ngtools/webpack/src/transformers/ctor-parameters.ts), as @angular/cli is anyway a dependency in every Angular project.

I will try to experiment with the transformer, we can track the progress in this issue till then.

Workaround

To make ts-jest not lose the parameter information upon compilation without the AST transformation, you can set "emitDecoratorMetadata": true in your tsconfig.spec.json for now. The PR mentions issues with AOT compilation, which is usually not used in testing, so this setting should not create any problems. If you use karma as well and this leads to issues, try to use a separate tsconfig.spec.json.

I created a project with 8.0.0 once and there emitDecoratorMetadata was still set

Oh alright, that could be it, I’ve only downgraded the angular dependencies manually in package.json, I didn’t regenerate a new project with @angular/cli v8.0.x … sorry!

This is a weird one. I’m also getting this error, however, I do have emitDecoratorMetadata: true in my tsconfig.spec.json. But the problem only seems to appear with a specific provider that doesn’t want to work unless I reference it in the file outside of type definitions.

Edit: seems like adding isolatedModules: true to ts-jest config makes everything work. 🤷‍♂️

@wtho I did not found those references mentioned when I wrote this comment. This was just to help the ones that need to “fix” this error until we don’t have the solution.

@norato this workaround was mentioned several times before in this thread, but is just a workaround and not more, not a fix for the preset.

If you wonder why this is not closed: The fix in this preset would not require any changes in the tsconfig, as this preset in a perfect world would already include all required settings.

The only thing that worked for me, after trying all the other options here,was to enable the following in the compilerOptions in the tsconfig.json file: “emitDecoratorMetadata”: true, This option should be enabled if the “experimentalDecorators”: true. I had to enable both in order to make my app work. Hope that helps someone.