feat!: upgrade to Angular 21 by griest024 · Pull Request #4442 · graycoreio/daffodil

griest024 · 2026-04-16T19:34:06Z

PR Checklist

Commit message follows our contributing guidelines
Tests added/updated (for bug fixes/features)
Documentation added/updated (for bug fixes/features)

PR Type

Current behavior

Fixes: #4294 fixes: #4292
Part of: #

New behavior

Breaking change?

Yes
No

Additional context

damienwebdev · 2026-04-20T15:50:25Z

@griest024 your build is now running against Angular 21.

@latest

BREAKING CHANGE: Angular 20 support has been dropped. Upgrade to Angular 21. `npx ng update @angular/{core,cli,pwa,cdk} @angular-eslint/schematics @angular-devkit/core typescript-eslint @typescript-eslint/{parser,eslint-plugin,utils,types}@latest @ngrx/schematics @fort awesome/{angular-fontawesome,fontawesome-svg-core,free-brands-svg-icons,free-regular-svg-icons,free-solid-svg-icons} angular-in-memory-web-api apollo-angular @schematics/angular` The installed Angular CLI version is outdated. Installing a temporary Angular CLI versioned 21.1.0 to perform the update. Using package manager: npm Collecting installed dependencies... Found 128 dependencies. Fetching dependency metadata from registry... Updating package.json with dependency @angular-devkit/architect @ "0.2101.0" (was "0.2003.2")... Updating package.json with dependency @angular-devkit/build-angular @ "21.1.0" (was "20.3.2")... Updating package.json with dependency @angular-devkit/core @ "21.1.0" (was "20.3.2")... Updating package.json with dependency @angular-devkit/schematics @ "21.1.0" (was "20.3.2")... Updating package.json with dependency @angular-eslint/builder @ "21.1.0" (was "20.3.0")... Updating package.json with dependency @angular-eslint/eslint-plugin @ "21.1.0" (was "20.3.0")... Updating package.json with dependency @angular-eslint/eslint-plugin-template @ "21.1.0" (was "20.3.0")... Updating package.json with dependency @angular-eslint/schematics @ "21.1.0" (was "20.3.0")... Updating package.json with dependency @angular-eslint/template-parser @ "21.1.0" (was "20.3.0")... Updating package.json with dependency @angular/build @ "21.1.0" (was "20.3.2")... Updating package.json with dependency @angular/cli @ "21.1.0" (was "20.3.2")... Updating package.json with dependency @angular/compiler-cli @ "21.1.0" (was "20.3.1")... Updating package.json with dependency @angular/language-service @ "21.1.0" (was "20.3.1")... Updating package.json with dependency @ngrx/schematics @ "21.0.1" (was "20.0.1")... Updating package.json with dependency @ngrx/store-devtools @ "21.0.1" (was "20.0.1")... Updating package.json with dependency @schematics/angular @ "21.1.0" (was "20.3.2")... Updating package.json with dependency @typescript-eslint/eslint-plugin @ "8.53.0" (was "8.44.0")... Updating package.json with dependency @typescript-eslint/parser @ "8.53.0" (was "8.44.0")... Updating package.json with dependency @typescript-eslint/types @ "8.53.0" (was "8.44.0")... Updating package.json with dependency @typescript-eslint/utils @ "8.53.0" (was "8.44.0")... Updating package.json with dependency angular-eslint @ "21.1.0" (was "20.3.0")... Updating package.json with dependency ng-packagr @ "21.1.0" (was "20.3.0")... Updating package.json with dependency typescript-eslint @ "8.53.0" (was "8.44.0")... Updating package.json with dependency @angular/animations @ "21.1.0" (was "20.3.1")... Updating package.json with dependency @angular/cdk @ "21.1.0" (was "20.2.4")... Updating package.json with dependency @angular/common @ "21.1.0" (was "20.3.1")... Updating package.json with dependency @angular/compiler @ "21.1.0" (was "20.3.1")... Updating package.json with dependency @angular/core @ "21.1.0" (was "20.3.1")... Updating package.json with dependency @angular/elements @ "21.1.0" (was "20.3.1")... Updating package.json with dependency @angular/forms @ "21.1.0" (was "20.3.1")... Updating package.json with dependency @angular/platform-browser @ "21.1.0" (was "20.3.1")... Updating package.json with dependency @angular/platform-browser-dynamic @ "21.1.0" (was "20.3.1")... Updating package.json with dependency @angular/platform-server @ "21.1.0" (was "20.3.1")... Updating package.json with dependency @angular/pwa @ "21.1.0" (was "20.3.2")... Updating package.json with dependency @angular/router @ "21.1.0" (was "20.3.1")... Updating package.json with dependency @angular/service-worker @ "21.1.0" (was "20.3.1")... Updating package.json with dependency @angular/ssr @ "21.1.0" (was "20.3.2")... Updating package.json with dependency @apollo/client @ "4.0.13" (was "3.13.8")... Updating package.json with dependency @fortawesome/angular-fontawesome @ "4.0.0" (was "3.0.0")... Updating package.json with dependency @fortawesome/fontawesome-svg-core @ "7.1.0" (was "7.0.1")... Updating package.json with dependency @fortawesome/free-brands-svg-icons @ "7.1.0" (was "7.0.1")... Updating package.json with dependency @fortawesome/free-regular-svg-icons @ "7.1.0" (was "7.0.1")... Updating package.json with dependency @fortawesome/free-solid-svg-icons @ "7.1.0" (was "7.0.1")... Updating package.json with dependency @ngrx/component @ "21.0.1" (was "20.0.1")... Updating package.json with dependency @ngrx/effects @ "21.0.1" (was "20.0.1")... Updating package.json with dependency @ngrx/entity @ "21.0.1" (was "20.0.1")... Updating package.json with dependency @ngrx/operators @ "21.0.1" (was "20.0.1")... Updating package.json with dependency @ngrx/router-store @ "21.0.1" (was "20.0.1")... Updating package.json with dependency @ngrx/store @ "21.0.1" (was "20.0.1")... Updating package.json with dependency angular-in-memory-web-api @ "0.21.0" (was "0.20.0")... Updating package.json with dependency apollo-angular @ "13.0.0" (was "11.0.0")... UPDATE package.json (5354 bytes) ✔ Cleaning node modules directory ✔ Installing packages ** Executing migrations of package '@angular/cli' ** ❯ Remove any karma configuration files that only contain the default content. The default configuration is automatically available without a specific project file. Migration completed (No changes made). ❯ Update 'moduleResolution' to 'bundler' in TypeScript configurations. You can read more about this, here: https://www.typescriptlang.org/tsconfig/#moduleResolution Migration completed (No changes made). ❯ Updates the 'lib' property in tsconfig files to use 'es2022' or a more modern version. UPDATE tsconfig.json (552 bytes) Migration completed (1 file modified). ** Optional migrations of package '@angular/cli' ** This package has 1 optional migration that can be executed. Optional migrations may be skipped and executed after the update process, if preferred. Select the migrations that you'd like to run [use-application-builder] Migrate application projects to the new build system. (https://angular.dev/tools/cli/build-system-migration) ❯ Migrate application projects to the new build system. Application projects that are using the '@angular-devkit/build-angular' package's 'browser' and/or 'browser-esbuild' builders will be migrated to use the new 'application' builder. You can read more about this, including known issues and limitations, here: https://angular.dev/tools/cli/build-system-migration Cannot update project "@daffodil/tools-sassdoc" to use the application builder. Only "@angular-devkit/build-angular:browser-esbuild" and "@angular-devkit/build-angular:browser" can be automatically migrated. Migration completed (No changes made). ** Executing migrations of package '@angular/cdk' ** ❯ Updates the Angular CDK to v21. Skipping migration for project @daffodil/tools-sassdoc. Unable to determine 'tsconfig.json' file in workspace config. Skipping migration for project storefront-examples. Unable to determine 'tsconfig.json' file in workspace config. ✓ Updated Angular CDK to version 21 Migration completed (No changes made). ** Executing migrations of package '@angular/core' ** ❯ Adds `BootstrapContext` to `bootstrapApplication` calls in `main.server.ts` to support server rendering. Migration completed (No changes made). ❯ Moves imports of `ApplicationConfig` from `@angular/platform-browser` to `@angular/core`. Migration completed (No changes made). ❯ Migrates deprecated bootstrap options to providers. UPDATE apps/demo/src/main.ts (464 bytes) UPDATE apps/daffio/src/main.server.ts (465 bytes) UPDATE apps/design-land/src/main.ts (459 bytes) Migration completed (3 files modified). ❯ Converts the entire application to block control flow syntax. Migration completed (No changes made). ❯ Ensures that the Router.lastSuccessfulNavigation signal is now invoked. Migration completed (No changes made). ** Optional migrations of package '@angular/core' ** This package has 1 optional migration that can be executed. Optional migrations may be skipped and executed after the update process, if preferred. Select the migrations that you'd like to run [router-current-navigation] Replaces usages of the deprecated Router.getCurrentNavigation method with the Router.currentNavigation signal. ❯ Replaces usages of the deprecated Router.getCurrentNavigation method with the Router.currentNavigation signal. Migration completed (No changes made).

primarily from apollo changes but also includes removing `--no-strip-types` from our cjs test commands and some minor linting changes

griest024 requested review from a team as code owners April 16, 2026 19:34

griest024 force-pushed the feat/all/upgrade/angular/21 branch from 5f72ad8 to 4c0f937 Compare April 16, 2026 20:20

griest024 added 6 commits April 21, 2026 14:05

fix(karma): breaking change from webpack interceptor

1f2726a

fix breaking changes

d53861a

primarily from apollo changes but also includes removing `--no-strip-types` from our cjs test commands and some minor linting changes

bump commerce schematic angular version

d113f7d

don't strip types from commerce unit test

2681c13

fix test

db7248f

griest024 force-pushed the feat/all/upgrade/angular/21 branch from d343777 to db7248f Compare April 21, 2026 15:20

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

feat!: upgrade to Angular 21#4442

feat!: upgrade to Angular 21#4442
griest024 wants to merge 6 commits intograycoreio:developfrom
griest024:feat/all/upgrade/angular/21

griest024 commented Apr 16, 2026

Uh oh!

damienwebdev commented Apr 20, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Conversation

griest024 commented Apr 16, 2026

PR Checklist

PR Type

Current behavior

New behavior

Breaking change?

Additional context

Uh oh!

damienwebdev commented Apr 20, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants