[swc-angular] Nx Monorepo with Angular app: failed to invoke `@jscutlery/swc-plugin-angular` (RuntimeError: out of bounds memory access)

[felikf]

I have an NX monorepo and I have tried to test swc-angular for one of NX library inside nx-repo/libs/lib-with-slow-tests

I run:

nx run products-ufo-final-variant:test --skipNxCache 

and

node --max_old_space_size=8192 node_modules/.bin/nx run products-ufo-final-variant:test --skipNxCache

Both of them results in:

Error:

 FAIL  src/lib/+state/cons-final-variant.effects.spec.ts
  ● Test suite failed to run

    failed to handle: failed to invoke plugin: failed to invoke plugin on 'Some("/Users/pepa/work/nx-workspace/jest.setup.js")'

    Caused by:
        0: failed to invoke `@jscutlery/swc-plugin-angular` as js transform plugin at @jscutlery/swc-plugin-angular
        1: RuntimeError: out of bounds memory access

      at Compiler.transformSync (../../../../node_modules/@swc/core/index.js:244:29)
      at transformSync (../../../../node_modules/@swc/core/index.js:351:21)
      at Object.process (../../../../node_modules/@swc/jest/index.js:73:45)
      at ScriptTransformer.transformSource (../../../../node_modules/@jest/transform/build/ScriptTransformer.js:545:31)
      at ScriptTransformer._transformAndBuildScript (../../../../node_modules/@jest/transform/build/ScriptTransformer.js:674:40)
      at ScriptTransformer.transform (../../../../node_modules/@jest/transform/build/ScriptTransformer.js:726:19)

What I did:

Install:

npm install -D @jscutlery/swc-angular @jscutlery/swc-angular-plugin @swc/core @swc/jest

Modified one library configuration: nx-repo/libs/lib-with-slow-tests/jest.config.ts inside the project:

/* eslint-disable */
import { swcAngularJestTransformer } from '@jscutlery/swc-angular-preset';

export default {
  displayName: 'products-ufo-final-variant',
  preset: '../../../../jest.preset.js',
  setupFilesAfterEnv: ['<rootDir>/src/test-setup.ts'],
  coverageDirectory: '../../../../coverage/libs/products/ufo/final-variant',
  transform: {
    '^.+\\.(ts|mjs|js)$': swcAngularJestTransformer(),
    '^.+\\.(html)$': [
      'jest-preset-angular',
      {
        tsconfig: '<rootDir>/tsconfig.spec.json',
        stringifyContentPathRegex: '\\.(html|svg)$'
      }
    ]
  },
  snapshotSerializers: [
    'jest-preset-angular/build/serializers/no-ng-attributes',
    'jest-preset-angular/build/serializers/ng-snapshot',
    'jest-preset-angular/build/serializers/html-comment'
  ]
};

Modified test-setup.ts in the library nx-repo/libs/lib-with-slow-tests/src/test-setup.ts:

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

Versions:

    "@angular/core": "17.1.2",
    "@nx/angular": "18.0.4",
    "@jscutlery/swc-angular": "^0.14.2",
    "@jscutlery/swc-angular-plugin": "^0.14.2",
    "@jscutlery/swc-angular-preset": "^0.2.2",
    "@jscutlery/swc-plugin-angular": "^0.11.0",
    "@nx/jest": "18.0.7",
    "@swc/jest": "^0.2.36",

[edbzn]

Hi @felikf, which version of @swc/core are you using?

Also, it seems that you have old versions of our packages, you should only have @jscutlery/swc-angular-plugin and @jscutlery/swc-angular.

[felikf]

Hi @edbzn,

    "@swc/cli": "~0.1.62",
    "@swc/core": "~1.3.85",

I will try to reinstall the required dependencies and let you know if that helped.

[edbzn]

Yeah bump @swc/core to v1.5.x it should fix your issue

[felikf]

OK, I started from scratch:

1.

npm install -D @jscutlery/swc-angular @jscutlery/swc-angular-plugin @swc/core @swc/jest

2.

nx run products-ufo-final-variant:test --skipNxCache

 TSError: ⨯ Unable to compile TypeScript:
   libs/products/ufo/final-variant/jest.config.ts:2:43 - error TS2307: Cannot find module '@jscutlery/swc-angular-preset' or its corresponding type declarations.

   2 import { swcAngularJestTransformer } from '@jscutlery/swc-angular-preset';

3.

npm install -D @jscutlery/swc-angular-preset

4.

nx run products-ufo-final-variant:test --skipNxCache

    @swc/core version 1.5.7 is incompatible with @jscutlery/swc-angular-preset.
    Please use @swc/core version 1.4.x.
    > npm add -D @swc/core@~1.4.0

5. Downgraded @core/swc to 1.4.x

6.

 FAIL  src/lib/+state/cons-final-variant.effects.spec.ts
  ● Test suite failed to run

    failed to get the node_modules path

      at Compiler.transformSync (../../../../node_modules/@swc/core/index.js:244:29)
      at transformSync (../../../../node_modules/@swc/core/index.js:351:21)
      at Object.process (../../../../node_modules/@swc/jest/index.js:73:45)
      at ScriptTransformer.transformSource (../../../../node_modules/@jest/transform/build/ScriptTransformer.js:545:31)
      at ScriptTransformer._transformAndBuildScript (../../../../node_modules/@jest/transform/build/ScriptTransformer.js:674:40)
      at ScriptTransformer.transform (../../../../node_modules/@jest/transform/build/ScriptTransformer.js:726:19)

7. Then i tried copy the dependencies from here

"@jscutlery/swc-angular-preset": "0.2.0",
"@jscutlery/swc-plugin-angular": "0.11.0",

8. now the the test are passing

---

The command from the top of the page installed these (which is kind of strange swc-plugin-angular vs swc-angular-plugin):

npm install -D @jscutlery/swc-angular @jscutlery/swc-angular-plugin @swc/core @swc/jest

"@jscutlery/swc-angular-plugin": "^0.14.5",
"@jscutlery/swc-angular-preset": "^0.3.0",

[felikf]

Is it possible to set up the swcAngularJestTransformer globaly in an NX monorepo (jest.config.ts)? Or do I have to set it up for each app / library?

[edbzn]

We renamed the libs so you should only install:

• @jscutlery/swc-angular
• @jscutlery/swc-angular-plugin

And you can import the configuration like so:

import { swcAngularJestTransformer } from '@jscutlery/swc-angular';

See the install guide for reference.

Is it possible to set up the swcAngularJestTransformer globaly in an NX monorepo (jest.config.ts)? Or do I have to set it up for each app / library?

Not really, Nx works like that, the global config is generic and not tied to a specific framework. However, we planned to create a generator to configure it for you.