Support for Angular 19

[laurentgrangier]

Is your feature request related to a problem? Please describe.

Angular 19 will be published in the "Week of 2024-11-19" according to release plans of Angular's team (https://angular.dev/reference/releases).

JsonForms should support Angular 19 "quickly" after the release of Angular 19.

Describe the solution you'd like

Support for Angular 19.
Drop support for Angular 17 and 18.
Actually I think JsonForms should not have support for two different major versions of Angular, since that could come with problems.

Describe alternatives you've considered

Not relevant.

Package

Angular Bindings, Angular Material Renderers

Additional context

No response

[laurentgrangier]

Results of first attempt with 19.0.0-rc.0 (support for 17 & 18 dropped):

• Components, Directives and Pipes must be marked as "standalone: false" since the new default is "true". https://blog.angular.dev/the-future-is-standalone-475d7edbc706
• Typescript must be updated from 5.2.2 to 5.5.0. No change needed in code.

Only with these 2 changes, "pnpm run build" and "pnpm run test" are successful on my local machine (Windows).

Not related to Angular:

• package.json in vue-vutify: the target "build-only" must be adapted with "cross-env". I assume this works without problem on Linux but not on Windows.
  "build-only": "cross-env NODE_OPTIONS="--max-old-space-size=4096" vite build",

[lucas-koehler]

Hi @laurentgrangier , thank your for the issue and information.
What exactly do you mean with "support for 17 & 18 dropped"?

If possible, we would like to keep at least support for Angular 18 to not force adopters to immediately migrate to Angular 19 to consume the latest JSON Forms version.
However, if that causes significant effort, we can consider dropping it.

According to Angular's official version compatibility table, Angular >= 18.1 is compatible with Typescript 5.5.x.

Also, would you like to contribute this update?

package.json in vue-vutify: the target "build-only" must be adapted with "cross-env". I assume this works without problem on Linux but not on Windows.
"build-only": "cross-env NODE_OPTIONS="--max-old-space-size=4096" vite build",

Thanks for the hint :) Would you like to contribute this? Otherwise, I'll do this small fix.

[laurentgrangier]

Hi @lucas-koehler

It should be possible to keep support for 18 and 19 if the code stays on Typescript 5.5 which is compatible with Angular 18 and 19 (https://angular.dev/reference/versions).
Most of libraries only supports one Angular version at a time (or have different releases). I don't consider myself as an expert with Angular and I must say I don't know it it could have problems supporting both versions. I will try to let supports for both versions in the package.json.

Angular 19 was released on 19.11.2024. I will come with a Pull Request soon.

It is OK for me if you fix the small "cross-env" problems.

Thank you
Laurent

[laurentgrangier]

I had to drop the support for Angular 18. There was problems I couldn't solve. With Angular 19 they added "incremental hydration" (see https://angular.dev/guide/incremental-hydration). That leads to changes in angular/core. As I tested the support for both Angular 18 and 19, I got the following error in the angular-material/example app:

../../node_modules/.pnpm/@angular+platform-browser@19.0.0_@angular+animations@19.0.0_@angular+core@18.2.12_rxjs@6.6.7__p5bg3whqizntzzj7ixiqpz7scu/node_modules/@angular/platform-brows
er/fesm2022/platform-browser.mjs:2112:69-94 - Error: export 'ɵwithIncrementalHydration' (imported as 'ɵwithIncrementalHydration') was not found in '@angular/core'

The error log itself shows some attempt to use both angular 18 and 19 at the same time.

I also added an angular workspace in angular-material package to be able to use Angular CLI (ng build, ng test). I couldn't bring the test to run with the current build system. Using Angular CLI it avoids some strange problems because the current scripts do not initialize everything the same as Angular CLI or are missing some dependencies we don't know.

[lucas-koehler]

Hi @laurentgrangier , thanks for the update. However, as we do not explicitly use incremental hydration, why would its addition be a problem? It seems that the problem stems from mixed usage of Angular 18 and 19, i.e. the platform v19 code trying it to import it from core v18. Concretely, it looks like angular core 18 got drawn in while some other dependencies are used as version 19.

Thus, I think we should see if we can still support Angular 18 as along as all angular dependencies are resolved in the same version. If that still breaks then, we can still remove the Angular 18 support. However, I would like to avoid it because of a potential configuration error.

[laurentgrangier]

Hi @lucas-koehle
I tried again. I think this time I could fix the problems and have support for Angular 18 & 19 at the same time.
I had to fix some problems:

• There was a mismatch with the version with @ngtools/webpack (19) and angular (18). When using the same, I could run the test.
• The tests were all failing. I had to remove the hack (initTestEnvironment) I had to introduce for the upgrade on Angular 18 the last time because of the test-runner.js file. Instead I added a standard Angular test.ts file included in the tsconfig.spec.json file. Now I think the angular-material packages is quite close to the Angular standard. I think it should makes the next Angular upgrade easier.

All the build workflow are green now: #2395
Could you please take a look / review? Thank you.

[SimonRingeisen]

@lucas-koehler do you know, when JSON Forms 3.5 with Angular 19 compatibility will be released?

[lucas-koehler]

@SimonRingeisen You could not have timed your question more perfectly 💯 It was just released a few minutes ago: https://www.npmjs.com/package/@jsonforms/angular/v/3.5.0