While testing with Jest 29, zone.js prints an Unhandled Promise rejection using firstValueFrom

[jordibaliellas]

Which @angular/* package(s) are the source of the bug?

zone.js

Is this a regression?

Yes

Description

I use Jest for the app testing.

After updating Jest 28 to 29 I found this issue:

I have this function on the app component:

public async testFunction() {
    await firstValueFrom(of('').pipe(
      map(() => {
        throw 'error'
      })
    ))
  }

and I have this test on the spec file:

it('should throw an error', async () => {
    const fixture = TestBed.createComponent(AppComponent);
    const app = fixture.componentInstance;
    try {
      await app.testFunction();
    } catch (e) {
      expect(true).toEqual(true);
    }
  });

Using Jest 28 it works perfect, but If I update to Jest 29 Zone.js prints a console.error like the promise was unhandled but as you can see on the test I handle the promise.

The test passes, but the console.error is annoying.

Please, read the anything else part to see my jest configuration. To compare between Jest versions you can execute:

npm uninstall jest jest-preset-angular @types/jest
Jest 29 try: npm install --save-dev jest jest-preset-angular@next @types/jest
Jest 28 try: npm install --save-dev jest jest-preset-angular @types/jest

Thanks!

Please provide a link to a minimal reproduction of the bug

example-project

Please provide the exception or error you saw

console.error
    Unhandled Promise rejection: error ; Zone: ProxyZone ; Task: null ; Value: error undefined

      at Object.api.onUnhandledError (node_modules/zone.js/bundles/zone-testing-bundle.umd.js:1109:29)
      at handleUnhandledRejection (node_modules/zone.js/bundles/zone-testing-bundle.umd.js:1137:17)
      at _loop_2 (node_modules/zone.js/bundles/zone-testing-bundle.umd.js:1128:21)
      at Object.api.microtaskDrainDone (node_modules/zone.js/bundles/zone-testing-bundle.umd.js:1132:17)
      at drainMicroTaskQueue (node_modules/zone.js/bundles/zone-testing-bundle.umd.js:639:22)

Please provide the environment you discovered this bug in (run ng version)

Angular CLI: 14.2.10
Node: 18.13.0 (Unsupported)
Package Manager: npm 8.19.3
OS: darwin arm64

Angular: 14.2.12
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1402.10
@angular-devkit/build-angular   14.2.10
@angular-devkit/core            14.2.10
@angular-devkit/schematics      14.2.10
@angular/cli                    14.2.10
@schematics/angular             14.2.10
rxjs                            7.5.7
typescript                      4.7.4

Anything else?

Using Jest 29 for testing:

"@types/jest": "^29.4.0",
"jest": "^29.4.3",
"jest-preset-angular": "^13.0.0-next.1",

jest.config.ts file:

import type { Config } from '@jest/types'

export default <Config.InitialOptions>{
    preset: 'jest-preset-angular',
    setupFilesAfterEnv: ['<rootDir>/setup-jest.ts'],
}

setup-jest.ts file:

import 'jest-preset-angular/setup-jest';

[dadalxx]

Hi jordibaliellas:
Firstlly, I have tried your issue, i got same warning in both jest 28 and 29.

In my opnion, it is not bug with zone.js. zone.js could only patch the rxjs operators but not the app created by testbed. Basically, firstValueFrom throw a unhandled err which be detected by zone.js, and zone.js could only make warning in rxjs level. But zone.js can not confirm whether it would be caught in outer level.

So i think a unhandled err warning by zone.js at this time is reasonable.

[jordibaliellas]

Hi,

Sorry, I do think this is something on this package: jest-preset-angular.

If I use jest@29 and jest-preset-angular@13 it prints the error, but if you uninstall both packages and install jest@28 and jest-preset-angular@12 It works properly.

I also tried this without angular, only jest and rxjs and works perfectly. It must be the update of jest-preset-angular

Thank you!

[JiaLiPassion]

I created a PR to remove the console.log when uncaught error occurs in jest.

[jordibaliellas]

Hi,

I do not expect that, a console.error / log is okay if the error is uncaught but in my example it is caught on the test.

[JiaLiPassion]

@jordibaliellas , yeah, this is a behavior changes seems to related to the async/await transform, I will try to confirm the details and return to this issue later.

[jordibaliellas]

@JiaLiPassion is definitely that, if I change the target on the tsconfig file to ES2016. This was not happening before because on the jest-preset-angular@12 they had the target harcoded.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}