feat: add support for Angular 21

[AtofStryker]

• Closes N/A

Additional details

Adds support for Angular 21 within Cypress Component testing. Right now the Angular 21 projects needs zone.js as a devDependency as cypress/angular currently only supports zone.js. I will have a follow up PR that adds a zoneless mount handler and defaults the scaffolding to cypress/angular-zoneless for Angular 21 applications

As Angular 21's change detection is a bit different from the legacy implementations, I refactored some of the angular fixtures to use signals instead of observables as signals are fully supported as of angular 18+

Steps to test

use the prepublished binaries to make sure scaffolding works on a new angular 21 project

How has the user experience changed?

Users will now be able to use Angular 21 without Cypress scaffolding warnings. NOTE: this currently still requires the zone.js devDependency until the zoneless mount handler is merged down. The intent is for both of these two be shipped at the same time but the work is considered separate.

PR Tasks

• Have tests been added/updated?
• Has a PR for user-facing changes been opened in cypress-documentation? chore: add angular 21 documentation cypress-documentation#6326
• Have API changes been updated in the type definitions?

---

Note

Adds Angular 21 component testing support, updates scaffolding/deps and tests, introduces an Angular 21 system-test fixture, and updates CI filters.

• Features
  • Add Angular 21 support for component testing.
  • Changelog entry announcing Angular 21 support.
• System Tests
  • New system-tests/projects/angular-21 fixture (with angular.json, cypress.config.ts, package.json, tsconfig.json).
  • Include Angular 21 in component_testing_spec.ts matrix and WDS e2e (angular.cy.ts).
  • Update reporter CT test to use angular-21.
• Angular Fixtures & Specs
  • Refactor sample components/services to Angular signals/model API and async fetch; remove HttpClient/service where unnecessary.
  • Update specs to use componentRef.setInput and drop HttpClientModule imports; remove counter.service.
• Webpack Dev Server
  • Adjust angularHandler tests for Angular 20/21 config shapes and tsconfig generation flag.
• Scaffolding & Detection
  • Allow Angular 21 across wizard deps (@angular/* and DevKit) and detection tests.
  • Update supported frameworks table to list Angular 18–21.
  • Schematic tests now target angular-20 and angular-21.
• CI
  • CircleCI workflow/filters updated to use branch feat/support_angular_21 and artifact persistence conditions.

^{Written by Cursor Bugbot for commit 5d5b79a. This will update automatically on new commits. Configure here.}

[cypress]

cypress    Run #67601

Run Properties:   Passed #67601  •  5d5b79a095: fix issue with incorrect placement of tsconfig in angular config

Project	cypress
Branch Review	feat/support_angular_21
Run status	Passed #67601
Run duration	19m 15s
Commit	5d5b79a095: fix issue with incorrect placement of tsconfig in angular config
Committer	Bill Glesias
View all properties for this run ↗︎

---

Test results
Failures	0
Flaky	2
Pending	27
Skipped	0
Passing	798
View all changes introduced in this branch ↗︎

UI Coverage  62.34%
Untested elements	27
Tested elements	48

Accessibility  99.03%
Failed rules	0 critical   3 serious   1 moderate   0 minor
Failed elements	19

[cursor]

Bug: Incorrect use of model signal for internal state

The model() function is used for count, but model() is specifically for two-way binding with parent components (input/output), not for internal component state. For internal state management, signal() should be used instead. This will cause the component to not work correctly as model() expects to be bound to a parent component property.