Skip to content

Commit c005e01

Browse files
christopherthielenchristopherthielen
authored
Merge pull request #1012 from lindolo25/chore/ng-v21-support
Support for Angular v21 and a bug fix for zoneless!
2 parents 621d55f + 74d7e35 commit c005e01

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

76 files changed

+3177
-2181
lines changed

‎downstream_projects.json‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,9 @@
22
"packageDir": "./dist",
33
"projects": {
44
"sample-app-angular": "https://github.com/ui-router/sample-app-angular.git",
5-
"angular20": "./test-angular-versions/v20",
6-
"angular20standalone": "./test-angular-versions/v20-standalone",
7-
"typescript58": "./test-typescript-versions/typescript5.8"
5+
"angular21": "./test-angular-versions/v21",
6+
"angular21standalone": "./test-angular-versions/v21-standalone",
7+
"angular21zoneless": "./test-angular-versions/v21-zoneless",
8+
"typescript58": "./test-typescript-versions/typescript5.9"
89
}
910
}

‎package.json‎

Lines changed: 25 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,13 @@
88
"build": "ng-packagr -p ng-package.json",
99
"release": "release --deps @uirouter/core @uirouter/rx",
1010
"check-peer-dependencies": "check-peer-dependencies",
11-
"test": "jest --rootDir test",
12-
"test:watch": "jest --rootDir test --watchAll",
11+
"test": "npm run test:zone && npm run test:zoneless",
12+
"test:zone": "jest --rootDir test",
13+
"test:zone:watch": "jest --rootDir test --watchAll",
1314
"test:debug": "node --inspect-brk node_modules/.bin/jest --rootDir test --runInBand",
1415
"test:downstream": "test_downstream_projects",
16+
"test:zoneless": "jest --rootDir test-zoneless",
17+
"test:zoneless:watch": "jest --rootDir test-zoneless --watchAll",
1518
"docs": "generate_docs",
1619
"docs:publish": "generate_docs && publish_docs",
1720
"prepublishOnly": "echo && echo DO NOT RUN npm publish. Instead, run npm run release && echo && echo && false",
@@ -43,43 +46,42 @@
4346
"license": "MIT",
4447
"distDir": "dist",
4548
"peerDependencies": {
46-
"@angular/common": "^20.0.0",
47-
"@angular/core": "^20.0.0",
48-
"@uirouter/core": "^6.1.1",
49+
"@angular/common": "^21.0.0",
50+
"@angular/core": "^21.0.0",
51+
"@uirouter/core": "^6.1.2",
4952
"@uirouter/rx": "^1.0.0"
5053
},
5154
"devDependencies": {
52-
"@angular-devkit/build-angular": "^20.1.5",
53-
"@angular/common": "^20.1.6",
54-
"@angular/compiler": "^20.1.6",
55-
"@angular/compiler-cli": "^20.1.6",
56-
"@angular/core": "^20.1.6",
57-
"@angular/platform-browser": "^20.1.6",
58-
"@angular/platform-browser-dynamic": "^20.1.6",
55+
"@angular-devkit/build-angular": "^21.0.2",
56+
"@angular/common": "^21.0.3",
57+
"@angular/compiler": "^21.0.3",
58+
"@angular/compiler-cli": "^21.0.3",
59+
"@angular/core": "^21.0.3",
60+
"@angular/platform-browser": "^21.0.3",
61+
"@angular/platform-browser-dynamic": "^21.0.3",
5962
"@types/jest": "^30.0.0",
60-
"@types/node": "^24.1.0",
63+
"@types/node": "^24.10.1",
6164
"@uirouter/core": "^6.1.2",
6265
"@uirouter/publish-scripts": "2.6.4",
6366
"@uirouter/rx": "^1.0.0",
6467
"husky": "^7.0.4",
65-
"jest": "^29.7.0",
66-
"jest-environment-jsdom": "^29.7.0",
67-
"jest-preset-angular": "^14.6.1",
68-
"jsdom": "^26.1.0",
69-
"ng-packagr": "^20.1.0",
68+
"jest": "^30.2.0",
69+
"jest-environment-jsdom": "^30.2.0",
70+
"jest-preset-angular": "^16.0.0",
71+
"jsdom": "^27.2.0",
72+
"ng-packagr": "^21.0.0",
7073
"picomatch": "4.0.3",
7174
"postcss": "^8.5.6",
7275
"prettier": "^2.8.8",
7376
"pretty-quick": "^3.3.1",
7477
"rxjs": "~7.8.2",
75-
"rxjs-compat": "^6.5.4",
76-
"schema-utils": "^4.3.2",
78+
"schema-utils": "^4.3.3",
7779
"ts-node": "10.9.2",
7880
"tslib": "^2.8.1",
7981
"tslint": "^6.1.0",
80-
"typescript": "~5.8.3",
81-
"vite": "7.1.5",
82-
"zone.js": "~0.15.1"
82+
"typescript": "~5.9.3",
83+
"vite": "7.2.6",
84+
"zone.js": "~0.16.0"
8385
},
8486
"jest": {
8587
"preset": "jest-preset-angular",

‎src/directives/uiView.ts‎

Lines changed: 12 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import {
88
OnDestroy,
99
OnInit,
1010
reflectComponentType,
11+
signal,
1112
Type,
1213
ViewChild,
1314
ViewContainerRef,
@@ -34,7 +35,6 @@ import {
3435
} from '@uirouter/core';
3536
import { Ng2ViewConfig } from '../statebuilders/views';
3637
import { MergeInjector } from '../mergeInjector';
37-
import { CommonModule } from '@angular/common';
3838

3939
/** @hidden */
4040
let id = 0;
@@ -113,10 +113,11 @@ function ng2ComponentInputs<T>(mirror: ComponentMirror<T>): InputMapping[] {
113113
selector: 'ui-view, [ui-view]',
114114
exportAs: 'uiView',
115115
standalone: true,
116-
imports: [CommonModule],
117116
template: `
118117
<ng-template #componentTarget></ng-template>
119-
<ng-content *ngIf="!_componentRef"></ng-content>
118+
@if (!_componentRef()) {
119+
<ng-content></ng-content>
120+
}
120121
`,
121122
})
122123
export class UIView implements OnInit, OnDestroy {
@@ -132,7 +133,7 @@ export class UIView implements OnInit, OnDestroy {
132133
}
133134

134135
/** The reference to the component currently inside the viewport */
135-
_componentRef: ComponentRef<any>;
136+
readonly _componentRef = signal<ComponentRef<any> | null>(null);
136137
/** Deregisters the ui-view from the view service */
137138
private _deregisterUIView: Function;
138139
/** Deregisters the master uiCanExit transition hook */
@@ -193,7 +194,7 @@ export class UIView implements OnInit, OnDestroy {
193194
* If both are true, adds the uiCanExit component function as a hook to that singular Transition.
194195
*/
195196
private _invokeUiCanExitHook(trans: Transition) {
196-
const instance = this._componentRef && this._componentRef.instance;
197+
const instance = this._componentRef() && this._componentRef().instance;
197198
const uiCanExitFn: TransitionHookFn = instance && instance.uiCanExit;
198199

199200
if (isFunction(uiCanExitFn)) {
@@ -211,7 +212,7 @@ export class UIView implements OnInit, OnDestroy {
211212
* For each transition, checks if any param values changed and notify component
212213
*/
213214
private _invokeUiOnParamsChangedHook($transition$: Transition) {
214-
const instance = this._componentRef && this._componentRef.instance;
215+
const instance = this._componentRef() && this._componentRef().instance;
215216
const uiOnParamsChanged: TransitionHookFn = instance && instance.uiOnParamsChanged;
216217

217218
if (isFunction(uiOnParamsChanged)) {
@@ -247,8 +248,8 @@ export class UIView implements OnInit, OnDestroy {
247248
}
248249

249250
private _disposeLast() {
250-
if (this._componentRef) this._componentRef.destroy();
251-
this._componentRef = null;
251+
if (this._componentRef()) this._componentRef().destroy();
252+
this._componentRef.set(null);
252253
}
253254

254255
ngOnDestroy() {
@@ -281,7 +282,7 @@ export class UIView implements OnInit, OnDestroy {
281282
this._applyUpdatedConfig(config);
282283

283284
// Initiate change detection for the newly created component
284-
this._componentRef.changeDetectorRef.markForCheck();
285+
this._componentRef().changeDetectorRef.markForCheck();
285286
}
286287

287288
private _applyUpdatedConfig(config: Ng2ViewConfig) {
@@ -294,9 +295,9 @@ export class UIView implements OnInit, OnDestroy {
294295
const componentClass = config.viewDecl.component;
295296

296297
// Create the component
297-
this._componentRef = this._componentTarget.createComponent(componentClass, { injector: componentInjector });
298+
this._componentRef.set(this._componentTarget.createComponent(componentClass, { injector: componentInjector }));
298299
// Wire resolves to @Input()s
299-
this._applyInputBindings(componentClass, this._componentRef, context);
300+
this._applyInputBindings(componentClass, this._componentRef(), context);
300301
}
301302

302303
/**

‎test-angular-versions/v20/src/main.ts‎

Lines changed: 0 additions & 5 deletions
This file was deleted.

test-angular-versions/v20-standalone/README.md renamed to test-angular-versions/v21-standalone/README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
# V20-standalone
1+
# V21-standalone
22

33
This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 20.0.5.
44

test-angular-versions/v20-standalone/angular.json renamed to test-angular-versions/v21-standalone/angular.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
},
77
"newProjectRoot": "projects",
88
"projects": {
9-
"v20-standalone": {
9+
"v21-standalone": {
1010
"projectType": "application",
1111
"schematics": {
1212
"@schematics/angular:class": {
@@ -41,7 +41,7 @@
4141
"build": {
4242
"builder": "@angular/build:application",
4343
"options": {
44-
"outputPath": "dist/v20-standalone",
44+
"outputPath": "dist/v21-standalone",
4545
"index": "src/index.html",
4646
"browser": "src/main.ts",
4747
"polyfills": [
@@ -87,10 +87,10 @@
8787
"builder": "@angular/build:dev-server",
8888
"configurations": {
8989
"production": {
90-
"buildTarget": "v20-standalone:build:production"
90+
"buildTarget": "v21-standalone:build:production"
9191
},
9292
"development": {
93-
"buildTarget": "v20-standalone:build:development"
93+
"buildTarget": "v21-standalone:build:development"
9494
}
9595
},
9696
"defaultConfiguration": "development"

test-angular-versions/v20-standalone/cypress.config.ts renamed to test-angular-versions/v21-standalone/cypress.config.js

File renamed without changes.

test-angular-versions/v20-standalone/cypress/e2e/sample_app.cy.js renamed to test-angular-versions/v21-standalone/cypress/e2e/sample_app.cy.js

File renamed without changes.

test-angular-versions/v20/package.json renamed to test-angular-versions/v21-standalone/package.json

Lines changed: 16 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,45 +1,42 @@
11
{
2-
"name": "v20",
2+
"name": "v21-standalone",
33
"version": "0.0.0",
44
"scripts": {
55
"ng": "ng",
66
"start": "ng serve",
77
"build": "ng build",
88
"watch": "ng build --watch --configuration development",
99
"test": "npm run test:dev && npm run test:prod",
10-
"test:dev": "ng build --configuration development && cypress-runner run --path dist/v20/browser",
11-
"test:prod": "ng build --configuration production && cypress-runner run --path dist/v20/browser"
10+
"test:dev": "ng build --configuration development && cypress-runner run --path dist/v21-standalone/browser",
11+
"test:prod": "ng build --configuration production && cypress-runner run --path dist/v21-standalone/browser"
1212
},
1313
"private": true,
1414
"dependencies": {
15-
"@angular/animations": "^20.1.6",
16-
"@angular/common": "^20.1.6",
17-
"@angular/compiler": "^20.1.6",
18-
"@angular/core": "^20.1.6",
19-
"@angular/forms": "^20.1.6",
20-
"@angular/platform-browser": "^20.1.6",
21-
"@angular/platform-browser-dynamic": "^20.1.6",
22-
"@angular/router": "^20.1.6",
23-
"rxjs": "~7.8.0",
24-
"tslib": "^2.3.0",
25-
"zone.js": "~0.15.0",
15+
"@angular/common": "^21.0.3",
16+
"@angular/compiler": "^21.0.3",
17+
"@angular/core": "^21.0.3",
18+
"@angular/platform-browser": "^21.0.3",
19+
"@angular/platform-browser-dynamic": "^21.0.3",
2620
"@uirouter/angular": "*",
2721
"@uirouter/cypress-runner": "*",
2822
"@uirouter/core": "*",
29-
"@uirouter/rx": "*"
23+
"@uirouter/rx": "*",
24+
"rxjs": "~7.8.0",
25+
"tslib": "^2.3.0",
26+
"zone.js": "~0.15.0"
3027
},
3128
"devDependencies": {
32-
"@angular/build": "^20.1.5",
33-
"@angular/cli": "^20.1.5",
34-
"@angular/compiler-cli": "^20.1.6",
29+
"@angular/build": "^21.0.2",
30+
"@angular/cli": "^21.0.2",
31+
"@angular/compiler-cli": "^21.0.3",
3532
"@types/jasmine": "~5.1.0",
3633
"jasmine-core": "~5.1.0",
3734
"karma": "~6.4.0",
3835
"karma-chrome-launcher": "~3.2.0",
3936
"karma-coverage": "~2.2.0",
4037
"karma-jasmine": "~5.1.0",
4138
"karma-jasmine-html-reporter": "~2.1.0",
42-
"typescript": "~5.8.3"
39+
"typescript": "~5.9.3"
4340
},
4441
"checkPeerDependencies": {
4542
"ignore": [

test-angular-versions/v20-standalone/public/favicon.ico renamed to test-angular-versions/v21-standalone/public/favicon.ico

File renamed without changes.

0 commit comments

Comments
 (0)