Angular-builders: Global $localize() function is not loaded in tests context

[pkaufi]

Describe the Bug

After running ngcc as proposed in the angular update guide (https://update.angular.io/#8.2:9.0), tests are failing with the error message

It looks like your application or one of its dependencies is using i18n.
Angular 9 introduced a global `$localize()` function that needs to be loaded.
Please run `ng add @angular/localize` from the Angular CLI.
(For non-CLI projects, add `import '@angular/localize/init';` to your `polyfills.ts` file.
For server-side rendering applications add the import to your `main.server.ts` file.)

I added a small reproduction below (updated and adapted the example app in this repository), where I installed @angular/localized with the help of the cli (ng add @angular/localized). It then added an import to the polyfills.ts files automatically (polyfills.ts).
It looks like polyfills.ts is not properly picked up during the test run, as ng serve still works after running ngcc.
When you add a minimal jest.config.js inside the root directory looking like

module.exports = {
  setupFilesAfterEnv: '<rootDir>/setupJest.ts',
};

and the corresponding setupJest.ts file

import '@angular/localize/init';

the tests are green again. In my production app, this still breaks some other tests, but at least the majority of them runs.
However, I don't think that's the proper solution for it.

Minimal Reproduction

https://github.com/pkaufi/ngcc-i18n-jest

Expected Behavior

Tests should run successfully after running ngcc

Environment

see reproduction repository

[just-jeb]

I guess the solution is to add the import you specified in the default setupJest file provided by the builder. Would you like to make a PR?

[just-jeb]

Gave it another look and it appears that it's relevant only if you depend on i18n. It also assumes that you have @angular/localize installed which is not true for all the apps.
Therefore it cannot be included by default in the builder setup file. However we can add it as a global mock, similarly to other functions.
Mind checking if it works (adding it as a global mock instead of importing in setup file)?

[pkaufi]

Thank you for your response. I'll have a closer look and check if it can be solved with the global mock you mentioned. I also found that it might be related to the following issue in @angular/cli
https://github.com/angular/angular-cli/issues/16890

[pkaufi]

Alright, I gave it another try and found out, that the polyfills.tsis never taken into consideration. So whatever you put there is not doing anything at all.
I'm not sure if this is done intentionally or not.
I think I'll open a github issue over at https://github.com/thymikee/jest-preset-angular, WDYT?

[just-jeb]

That would be the right place to open an issue, however I'm not sure it's a bug. Maybe they are not importing the polyfills intentionally.

[pkaufi]

I opened an issue (https://github.com/thymikee/jest-preset-angular/issues/347) with an updated repro, let's see what they think :)

[just-jeb]

@pkaufi Have you tried by any chance adding a global mock for $localize function?

[pkaufi]

Unfortunately, I did not have time for this, I'm sorry. I'm also not sure when I can start with it, as I'm quite busy right now

[jarodsmk]

The issue was resolved within https://github.com/thymikee/jest-preset-angular/issues/347 -

Simply add the following to your setup-jest.ts:

import '@angular/localize/init';

And make sure it's imported into your jest.config.js:

module.exports = {
    name: 'module-report',
    ...
    setupFiles: ['./setup-jest.ts']
};