Skip to content

chore(dependencies): update Node.js version and Angular v22, TS 6 #36623

Open
nicobytes wants to merge 9 commits into
mainfrom
35930-migrate-angular-21-angular-22-typescript-6-across-the-core-web-nx-workspace
Open

chore(dependencies): update Node.js version and Angular v22, TS 6 #36623
nicobytes wants to merge 9 commits into
mainfrom
35930-migrate-angular-21-angular-22-typescript-6-across-the-core-web-nx-workspace

Conversation

@nicobytes

@nicobytes nicobytes commented Jul 17, 2026 •
edited by github-actions Bot
Loading

Copy link
Copy Markdown
Member

This pull request updates Node.js to version 22.22.3 across the project and refactors Angular ESLint configurations for better maintainability and clarity. It also relaxes Angular template strictness in several tsconfig files, simplifies test and story file exclusions, and makes a small adjustment to URL sanitization in the block editor utility.

Node.js version update:

  • Updated .nvmrc, core-web/.nvmrc, and documentation references to require Node.js v22.22.3 instead of v22.15.0. (.nvmrc, core-web/.nvmrc, CLAUDE.md, ONBOARDING.md) [1] [2] [3]

ESLint configuration refactoring:

  • Replaced use of FlatCompat for Angular template processing with direct rule configuration in all Angular ESLint configs, simplifying the setup and making rule overrides explicit. (core-web/apps/dotcdn/eslint.config.mjs, core-web/apps/dotcms-block-editor/eslint.config.mjs, core-web/apps/dotcms-ui/eslint.config.mjs, core-web/libs/block-editor/eslint.config.mjs, core-web/libs/data-access/eslint.config.mjs, core-web/libs/dot-layout-grid/eslint.config.mjs, core-web/libs/dot-rules/eslint.config.mjs, core-web/libs/dotcms-js/eslint.config.mjs) [1] [2] [3] [4] [5] [6] [7] [8] [9] [10] [11] [12] [13]

  • Disabled @angular-eslint/prefer-on-push-component-change-detection in several configs for migration compatibility. [1] [2] [3] [4]

TypeScript and Angular compiler options:

  • Set "strictTemplates": false in angularCompilerOptions for multiple tsconfig.app.json files to relax Angular template strictness for migration. (core-web/apps/dotcdn/tsconfig.app.json, core-web/apps/dotcms-binary-field-builder/tsconfig.app.json, core-web/apps/dotcms-block-editor/tsconfig.app.json, core-web/apps/dotcms-ui/tsconfig.app.json) [1] [2] [3]

  • Cleaned up exclude arrays in tsconfig files and removed story file exclusions from test coverage collection. (core-web/libs/block-editor/tsconfig.lib.json, core-web/jest.preset.js) [1] [2]

Block editor utility adjustment:

  • Removed direct use of Angular's internal DomSanitizer for icon data URLs and now casts trusted URLs directly to SafeUrl for simplicity and compatibility. (core-web/libs/block-editor/src/lib/shared/utils/suggestion.utils.ts) [1] [2] [3]

This PR fixes: #35930

Copilot AI review requested due to automatic review settings July 17, 2026 16:19
@github-actions github-actions Bot mentioned this pull request Jul 17, 2026
Open
13 tasks
@github-actions github-actions Bot added Area : Documentation PR changes documentation files Area : Frontend PR changes Angular/TypeScript frontend code labels Jul 17, 2026
@claude

claude Bot commented Jul 17, 2026 •
edited
Loading

Copy link
Copy Markdown
Contributor

Claude finished @nicobytes's task in 2m 10s —— View job

PR Review — Angular 22 / TS 6 migration (#36623)

  • Analyze diff & key changed files
  • Review block-editor URL sanitization change
  • Review ESLint config refactors (dead code)
  • Review timeline key / other logic changes
  • Review dependency & config changes
  • Post review

This is a large but mostly mechanical migration PR. I focused on the non-mechanical logic changes and re-checked the earlier Copilot findings.

New Issues

  • 🟡 Medium: core-web/package.json:54 — @angular/cdk is pinned to 22.0.5 while all other @angular/* framework packages are 22.0.7. Keep them on the same patch version unless there's a known reason, to avoid peer-dependency skew. Fix this →
  • 🟡 Medium: core-web/jest.preset.js:7 — story file exclusions were removed from collectCoverageFrom. *.stories.ts files are now counted in coverage, which dilutes real coverage numbers. If this was intentional for the migration, fine; otherwise consider restoring '!src/**/*.stories.ts'.
  • 🟡 Medium: core-web/tsconfig.base.json:18 — ignoreDeprecations: "6.0" is a transitional TS6 flag with no in-repo tracking for removal. Worth a follow-up issue / note in docs/frontend/ANGULAR_STANDARDS.md so it doesn't become permanent tech debt. Same applies to the strictTemplates: false / strict: false relaxations across the tsconfig.app.json files — they widen the type-safety gap and should have a re-tightening plan.

Resolved

  • ✅ core-web/libs/block-editor/src/lib/shared/utils/suggestion.utils.ts — the raw url as SafeUrl cast was replaced. Sanitization now lives in an injection context: SuggestionsListItemComponent.safeUrl (line 51) calls sanitizer.bypassSecurityTrustUrl() only for data: URLs and returns the plain string otherwise. Icon rendering via <img [src]="safeUrl"> is correct.
  • ✅ core-web/apps/dotcms-ui/eslint.config.mjs (and the other ~20 configs) — FlatCompat/compat dead code is gone; configs now use nx.configs['flat/angular'] + nx.configs['flat/angular-template'] directly. The a11y-rule disables are documented with a "pre-migration parity" comment, which is a reasonable behavior-neutral choice.
  • ✅ .../dot-history-timeline-list.component.ts:17 — $timelineKey no longer keys off a non-existent id. getTimelineItemKey now checks inode → bundleId → id, matching the actual item shapes ($historyItems uses inode, $pushPublishHistoryItems uses bundleId, confirmed in dot-edit-content-sidebar-history.component.html). The forced <p-timeline> recreation via @for (…; track timelineKey) will now work.

Notes (non-blocking)

  • core-web/libs/.../suggestions-list-item.component.ts:51 — safeUrl is a getter bound in the template, so it re-invokes bypassSecurityTrustUrl on each change-detection pass. Harmless here (icons are static, component is a menu item), but a computed/memoized value would avoid the repeated allocation.
  • Copilot's suggestion to restrict data: to data:image/... is low-risk in practice — these values come from the hardcoded internal suggestion-icons set, not user input — but tightening the guard is cheap defense-in-depth if you want it.

No blocking issues found. The previously-flagged Critical/High items are resolved; remaining items are all non-blocking.

@nicobytes
chore(dependencies): update Node.js version to 22.22.3 and streamline…
fd14137 
… ESLint configurations

- Updated Node.js version from 22.15.0 to 22.22.3 in multiple configuration files, including `.github/copilot-instructions.md` and `pom.xml`.
- Consolidated ESLint configuration rules across various applications and libraries for consistency and clarity, ensuring all relevant files adhere to the same standards.
- Removed unnecessary imports and streamlined coverage collection settings in Jest configuration files.

This update enhances compatibility and maintains code quality across the project.
@nicobytes
nicobytes requested a review from a team as a code owner July 17, 2026 16:25
Copilot AI reviewed Jul 17, 2026
View reviewed changes

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This pull request upgrades the core-web workspace to Angular 22 / TypeScript 6, bumps the required Node.js version to v22.22.3, and refactors multiple ESLint flat-config files to simplify Angular lint rule overrides during migration.

Changes:

  • Updated Node.js version requirements and docs (.nvmrc, core-web/.nvmrc, onboarding docs).
  • Upgraded Angular/Nx/TypeScript dependencies and introduced TypeScript 6 migration flags (ignoreDeprecations: "6.0", relaxed strictTemplates).
  • Refactored Angular ESLint flat configs (removing FlatCompat template processing blocks) and adjusted a block-editor URL “sanitization” helper.

Reviewed changes

Copilot reviewed 41 out of 42 changed files in this pull request and generated 3 comments.

Show a summary per file
File Description
ONBOARDING.md Updates Node version requirement text.
dotFrontendOnboarding.md Updates Node version requirement text (but leaves other stack versions stale).
docs/frontend/ANGULAR_STANDARDS.md Updates frontend standards doc to Angular 22 / TS 6 / Nx 23 era.
core-web/tsconfig.base.json Adds TS6 migration flags (ignoreDeprecations) and explicit strict: false.
core-web/package.json Upgrades Angular/Nx/TypeScript and adds pnpm peer dependency rules.
core-web/libs/utils/eslint.config.mjs Refactors Angular ESLint flat config away from compat inline-template processing block.
core-web/libs/utils-testing/eslint.config.mjs Same ESLint refactor + disables OnPush preference rule for migration.
core-web/libs/ui/src/lib/components/dot-severity-icon/dot-severity-icon.component.spec.ts Updates tests to assert PrimeIcons classes instead of icon components.
core-web/libs/ui/src/lib/components/dot-severity-icon/dot-severity-icon.component.html Switches icon rendering to PrimeIcons <i class="pi ...">.
core-web/libs/ui/eslint.config.mjs Refactors Angular ESLint flat config + disables OnPush preference rule for migration.
core-web/libs/template-builder/tsconfig.lib.json Simplifies exclude list.
core-web/libs/template-builder/eslint.config.mjs Refactors Angular ESLint flat config + disables OnPush preference rule for migration.
core-web/libs/portlets/edit-ema/ui/eslint.config.mjs Refactors Angular ESLint flat config + disables OnPush preference rule for migration.
core-web/libs/portlets/edit-ema/portlet/eslint.config.mjs Refactors Angular ESLint flat config + disables OnPush preference rule for migration.
core-web/libs/portlets/dot-experiments/portlet/eslint.config.mjs Refactors Angular ESLint flat config away from compat inline-template processing block.
core-web/libs/portlets/dot-experiments/data-access/eslint.config.mjs Refactors Angular ESLint flat config away from compat inline-template processing block.
core-web/libs/new-block-editor/eslint.config.mjs Refactors Angular ESLint flat config + disables OnPush preference rule for migration.
core-web/libs/edit-content/eslint.config.mjs Refactors Angular ESLint flat config + disables OnPush preference rule for migration.
core-web/libs/edit-content-bridge/tsconfig.lib.json Simplifies exclude list.
core-web/libs/dotcms-js/eslint.config.mjs Refactors Angular ESLint flat config away from compat inline-template processing block.
core-web/libs/dot-rules/eslint.config.mjs Refactors Angular ESLint flat config + disables OnPush preference rule for migration.
core-web/libs/dot-layout-grid/eslint.config.mjs Refactors Angular ESLint flat config away from compat inline-template processing block.
core-web/libs/data-access/eslint.config.mjs Refactors Angular ESLint flat config away from compat inline-template processing block.
core-web/libs/block-editor/tsconfig.lib.json Simplifies exclude list.
core-web/libs/block-editor/src/lib/shared/utils/suggestion.utils.ts Changes URL “sanitization” implementation for suggestion icon data URLs.
core-web/libs/block-editor/eslint.config.mjs Refactors Angular ESLint flat config + disables OnPush preference rule for migration.
core-web/jest.preset.js Removes story exclusion from coverage collection.
core-web/apps/dotcms-ui/tsconfig.app.json Disables Angular strictTemplates for migration.
core-web/apps/dotcms-ui/eslint.config.mjs Refactors Angular ESLint flat config + disables OnPush preference rule for migration.
core-web/apps/dotcms-block-editor/tsconfig.app.json Disables Angular strictTemplates for migration.
core-web/apps/dotcms-block-editor/eslint.config.mjs Refactors Angular ESLint flat config away from compat inline-template processing block.
core-web/apps/dotcms-binary-field-builder/tsconfig.app.json Disables Angular strictTemplates for migration.
core-web/apps/dotcms-binary-field-builder/eslint.config.mjs Refactors Angular ESLint flat config + disables OnPush preference rule for migration.
core-web/apps/dotcdn/tsconfig.app.json Disables Angular strictTemplates for migration.
core-web/apps/dotcdn/eslint.config.mjs Refactors Angular ESLint flat config away from compat inline-template processing block.
core-web/.nvmrc Pins Node to v22.22.3.
CLAUDE.md Updates Node version requirement text.
.nvmrc Pins Node to v22.22.3.

Comment thread core-web/libs/block-editor/src/lib/shared/utils/suggestion.utils.ts Outdated
Comment thread dotFrontendOnboarding.md Outdated
Comment thread core-web/apps/dotcms-ui/eslint.config.mjs Outdated
@nicobytes
chore(dependencies): update Angular and Nx versions, enhance ESLint c…
8695e1e 
…onfig, and improve frontend onboarding documentation
@nicobytes
nicobytes requested a review from Copilot July 17, 2026 16:37
Copilot AI reviewed Jul 17, 2026
View reviewed changes

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Copilot reviewed 53 out of 54 changed files in this pull request and generated 19 comments.

Comment thread core-web/libs/utils-testing/eslint.config.mjs
Comment thread core-web/libs/template-builder/eslint.config.mjs
Comment thread core-web/libs/edit-content/eslint.config.mjs
Comment thread core-web/apps/dotcms-block-editor/eslint.config.mjs
Comment thread core-web/apps/dotcms-binary-field-builder/eslint.config.mjs
Comment thread ...-sidebar-history/components/dot-history-timeline-list/dot-history-timeline-list.component.ts
Comment thread ...mponents/suggestion-list/components/suggestions-list-item/suggestions-list-item.component.ts
Comment thread core-web/package.json
Comment thread core-web/package.json
Comment thread core-web/tsconfig.base.json
@nicobytes
refactor(eslint): remove unused FlatCompat imports from ESLint config…
c318982 
…urations

- Cleaned up ESLint configuration files across multiple applications and libraries by removing unnecessary imports related to FlatCompat.
- This change streamlines the ESLint setup and enhances consistency across the project.
nicobytes added 3 commits July 17, 2026 13:06
@nicobytes
refactor(content-types): migrate add-to-menu logic to signals and upd…
3d5b9dc 
…ate tests

- Refactored the `ContentTypesLayoutComponent` to use signals for managing the add-to-menu state, replacing the previous boolean flag.
- Updated the HTML template to reflect the new signal-based logic for displaying the add-to-menu component.
- Adjusted unit tests in `content-types-layout.component.spec.ts` to accommodate the changes in state management and component interactions.
- Modified the `DotAddToMenuComponent` to emit events correctly, ensuring proper functionality in the updated context.
- Enhanced the `dot-content-types.component.html` to align with the new event handling for the add-to-menu feature.
@nicobytes
test(dot-history-timeline-list): enhance unit tests for timeline key …
f1676de 
…functionality

- Added tests to verify that timeline items are correctly keyed by inode and bundleId.
- Implemented checks to ensure the timeline key updates appropriately when version lists are swapped.
- Introduced mock data for DotCMSContentletVersion and DotPushPublishHistoryItem to facilitate testing.
- Enhanced the DotHistoryTimelineListComponent to utilize a stable identity function for timeline items, improving key generation logic.
@nicobytes
refactor(content-types-layout): improve HTML structure and clean up u…
d1061cf 
…nit tests

- Adjusted the HTML structure in `content-types-layout.component.html` for better readability and consistency.
- Updated the unit tests in `content-types-layout.component.spec.ts` to streamline component overrides and enhance clarity.
- Made minor formatting changes in `dot-history-timeline-list.component.spec.ts` to improve code organization and maintainability.
@nicobytes nicobytes changed the title chore(dependencies): update Node.js version and Angular packages chore(dependencies): update Node.js version and Angular v22, TS 6 Jul 17, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

Copilot code review Copilot Copilot left review comments

At least 1 approving review is required to merge this pull request.

Assignees

No one assigned

Labels

AI: Safe To Rollback Area : Documentation PR changes documentation files Area : Frontend PR changes Angular/TypeScript frontend code

Projects

dotCMS - Product Planning
Status: No status

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

Migrate Angular 21 → Angular 22 (TypeScript 6) across the core-web Nx workspace

2 participants

@nicobytes