tsconfig target=ES2022 appears to cause Breeze client to enter infinite loop when saveChanges() is used

[EchoFoxxtrot]

In response to the following TypeScript warning received when compiling my Angular/Breeze SPA

TypeScript compiler options "target" and "useDefineForClassFields" are set to "ES2022" and "false" respectively by the Angular CLI. To control ECMA version and features use the Browerslist configuration. For more information, see https://angular.io/guide/build#configuring-browser-compatibility NOTE: You can set the "target" to "ES2022" in the project's tsconfig to remove this warning.

I updated the target property in my tsconfig.base.json file and the warning went away. Breeze seemed to be functioning normally for retrieving data so I assumed all was well, until I tried to save something and what used to take a second or less suddenly started hanging. With my developer console in Edge open, I paused JavaScript execution and examined the call stack and found an infinite call loop was occurring:

toJSONSafe (breeze-client.js:362) (anonymous) (breeze-client.js:354) toJSONSafe (breeze-client.js:353) toJSONSafe (breeze-client.js:371) toJSONSafe (breeze-client.js:371) toJSONSafe (breeze-client.js:371) (anonymous) (breeze-client.js:354) toJSONSafe (breeze-client.js:353) toJSONSafe (breeze-client.js:371) toJSONSafe (breeze-client.js:371) (anonymous) (breeze-client.js:354)
When I switch my target back to ES2018, which is what I was using previously, the problem totally goes away and saveChanges() works perfectly.

My complete tsconfig.base.ts file contains the following:
{ "compileOnSave": false, "compilerOptions": { "baseUrl": "./", "outDir": "./dist/out-tsc", "sourceMap": true, "declaration": false, "downlevelIteration": true, "experimentalDecorators": true, "module": "esnext", "moduleResolution": "node", "importHelpers": true, "target": "ES2022", "typeRoots": [ "node_modules/@types" ], "lib": [ "ES2022", "dom" ] }, "angularCompilerOptions": { "fullTemplateTypeCheck": false, "strictInjectionParameters": true } }

Are there any other settings that should be adjusted to make the infinite recursive looping go away when targeting ES2022 or is this a real breeze-client issue?

I am using "breeze-client": "^2.1.5" loaded by npm from my package.json file.

[steveschmitt]

Fascinating. I have no idea why toJSONSafe would to behave differently based on the ES target level. I'll have to try it.

Thanks for the excellent description of the issue.

[steveschmitt]

@EchoFoxxtrot could you please try using the 2.1.5-mjs version?

npm install breeze-client@mjs

The breeze code is the same, but the mjs version is built to the esm2020 module specification.

[steveschmitt]

@EchoFoxxtrot I can't reproduce the problem. I've got an Angular 15 project and changed the tsconfig.base.json to match what you said above:

    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "importHelpers": true,
    "noImplicitAny": false,
    "downlevelIteration": true,
    "target": "ES2022",
    "module": "esnext",
    "lib": ["es2022", "dom"],

I've tried both development and production builds, and still can't reproduce it.

Any other clues? Is it only certain entities that cause the problem?

[EchoFoxxtrot]

@steveschmitt I did update to breeze-client@mjs already. Same behavior in both mjs and non-mjs. My entity does have custom code, which I may be able to privately share with you if my company approves it. I am using Angular 16, however....

[steveschmitt]

If you could create a minimal reproduction, that would be ideal, but I understand that can be difficult.

You could start with the northwind-demo, but you would need to bring it up to Angular 16.

[EchoFoxxtrot]

I can upgrade the demo to .NET 7 and Angular 16, no problem and create a minimal example to simulate all that's in my entity class. It may be a few days with Memorial Day coming up....

[steveschmitt]

@EchoFoxxtrot Any luck?

[EchoFoxxtrot]

@steveschmitt been busy with other tasks the last few days, but I can work on the example now. Let's see how far I get....

[steveschmitt]

Now (as of breeze-client 2.2.0) the Ivy mjs version is the default.

breeze-client@2.2.0 is the mjs version and is tagged mjs and latest.
breeze-client@2.2.0-cjs is built with the older packager and is tagged cjs and umd.