Jest fails because of Bloomreach ng-sdk

[TimoPot]

I've upgrade the Bloomreach dependencies to "version": "19.0.2",

Now when running Jest tests I get the error below. This does not happen when I downgrade to v18 of the ng-sdk.

FAIL src/app/app.component.spec.ts ● Test suite failed to run

Jest encountered an unexpected token

Jest failed to parse a file. This happens e.g. when your code or its dependencies use non-standard JavaScript syntax, or when Jest is not configured to support such syntax.

Out of the box Jest supports Babel, which will be used to transform your files into valid JS based on your Babel configuration.

By default "node_modules" folder is ignored by transformers.

Here's what you can do:
 • If you are trying to use ECMAScript Modules, see https://jestjs.io/docs/ecmascript-modules for how to enable it.
 • If you are trying to use TypeScript, see https://jestjs.io/docs/getting-started#using-typescript
 • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
 • If you need a custom transformation specify a "transform" option in your config.
 • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

You'll find more details and examples of these config options in the docs:
https://jestjs.io/docs/configuration
For information about custom transformations, see:
https://jestjs.io/docs/code-transformation

Details:

C:/Projecten/Rechtspraak.Frontend/node_modules/@bloomreach/ng-sdk/dist/index.d.ts:5
export * from './public-api';
^^^^^^

SyntaxError: Unexpected token 'export'

  2 | import { AppComponent, endPoint } from './app.component';
  3 | import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
> 4 | import { BrSdkModule } from '@bloomreach/ng-sdk';
    | ^
  5 | import { ComponentsLibModule } from '@rechtspraak.frontend/components-lib';
  6 | import { HttpClientModule } from '@angular/common/http';
  7 | import { REQUEST } from '@nguniversal/express-engine/tokens';

  at Runtime.createScriptFromCode (../../node_modules/jest-runtime/build/index.js:1796:14)
  at Object.<anonymous> (src/app/app.component.spec.ts:4:1)

[beetlerom]

Thanks for reporting this issue @TimoPot. What version of Jest are you using in your app?

[beetlerom]

This is strange, the BrSdkModule is exported the same way in both 18 & 19.

Depending on which version of angular you are using Jest needs a different way of using ES Modules,have you taken this into account in your test setup?

[antoniodesousa]

Hi @TimoPot, the ng-sdk v18 is compiled using Angular 11 and v19 is compiled using Angular 15. If your project is running Angular 14+ then you will need the v19 version of the SDK. I don't know your jest setup, but if you are using @angular-builders/jest (which I highly recommend), make sure you have the correct version installed:

• Angular 14 -> @angular-builders/jest@14.1.0
• Angular 15 -> @angular-builders/jest@15.0.0

If you don't use that package, you must run ngcc before the tests.

[TimoPot]

Thanks guys. I will look into it.

[beetlerom]

@TimoPot Hey, Timo! Any update on this, curious if you had a chance to figure out what is causing the issue? Thanks!

[TimoPot]

I forgot to tell that it is in a NX monorepo. I have updated all jest related packages without any luck.

Then I created an new empty nx project v14 and copied all this settings and package versions.

Still getting errors.

For now its on hold until I recover from the flu.

[TimoPot]

I forgot to tell that it is in a NX monorepo. I have updated all jest related packages without any luck.

Then I created an new empty nx project v14 and copied all this settings and package versions.

Still getting errors.

For now its on hold until I recover from the flu.

[antoniodesousa]

Hi @TimoPot, I tried to reproduce the error in an empty NX project v14 and I got the same error. The problem is that Angular 13+ doesn't create commonjs bundles anymore, only ESM bundles. Sadly, I don't have much experience using NX so I'm not sure what's the best way to fix it.

Anyways, the error doesn't seem related to the library itself but rather how NX + Jest handles ESM libraries.

[beetlerom]

@TimoPot I believe this issue is at cause here: https://github.com/nrwl/nx/issues/12046

[TimoPot]

Issues is resolved. I'm not sure what the issue was. I updated Jest and everything related to Jest and I updated the jest config files.

To make sure I got a clean install of npm I removed the node_modules, the npm cache and the package-lock.json

[antoniodesousa]

Good to hear that you managed to fix the issue in the end, @TimoPot. Thanks for let us know.