Skip to content

Commit d69d03e

Browse files
msgoloborodovMihail Goloborodov
and
Mihail Goloborodov
authored
feat: Angular 15 support (#973)
Co-authored-by: Mihail Goloborodov <Mihail.Goloborodov@nexign-systems.com>
1 parent 1795920 commit d69d03e

30 files changed

+7517
-7712
lines changed

add_support_for_new_angular_version.txt

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,10 +10,10 @@ Notes from when I added Angular 11 support
1010
- update other libs
1111
- update tests in test-angular-versions/
1212
- ./scaffold.sh 11
13-
- remove old tests fro test-angular-versions and ../downstream_projects.json
13+
- remove old tests from test-angular-versions and ../downstream_projects.json
1414
- update tests in test-typescript-versions/
1515
- ./scaffold.sh 4.5
16-
- (maybe) remove old tests fro test-typescript-versions and ../downstream_projects.json
16+
- (maybe) remove old tests from test-typescript-versions and ../downstream_projects.json
1717
- npx check-peer-dependencies
1818
- gh pr create
1919
- npm run release

downstream_projects.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
{
22
"packageDir": "./dist",
33
"projects": {
4-
"angular14": "./test-angular-versions/v14",
5-
"typescript46": "./test-typescript-versions/typescript4.6",
6-
"sample-app-angular": "https://github.com/ui-router/sample-app-angular.git"
4+
"sample-app-angular": "https://github.com/ui-router/sample-app-angular.git",
5+
"angular15": "./test-angular-versions/v15",
6+
"typescript48": "./test-typescript-versions/typescript4.8"
77
}
8-
}
8+
}

package.json

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -43,29 +43,29 @@
4343
"license": "MIT",
4444
"distDir": "dist",
4545
"peerDependencies": {
46-
"@angular/common": "^14.0.0",
47-
"@angular/core": "^14.0.0",
46+
"@angular/common": "^15.0.0",
47+
"@angular/core": "^15.0.0",
4848
"@uirouter/core": "^6.0.8",
4949
"@uirouter/rx": "^1.0.0"
5050
},
5151
"devDependencies": {
52-
"@angular-devkit/build-angular": "^14.0.0",
53-
"@angular/animations": "^14.0.0",
54-
"@angular/common": "^14.0.0",
55-
"@angular/compiler": "^14.0.0",
56-
"@angular/compiler-cli": "^14.0.0",
57-
"@angular/core": "^14.1.0",
58-
"@angular/platform-browser": "^14.0.0",
59-
"@angular/platform-browser-dynamic": "^14.0.0",
52+
"@angular-devkit/build-angular": "^15.0.0",
53+
"@angular/animations": "^15.0.0",
54+
"@angular/common": "^15.0.0",
55+
"@angular/compiler": "^15.0.0",
56+
"@angular/compiler-cli": "^15.0.0",
57+
"@angular/core": "^15.0.0",
58+
"@angular/platform-browser": "^15.0.0",
59+
"@angular/platform-browser-dynamic": "^15.0.0",
6060
"@types/jest": "^27.0.3",
6161
"@types/jquery": "^3.5.9",
6262
"@uirouter/core": "^6.0.8",
6363
"@uirouter/publish-scripts": "2.6.0",
6464
"@uirouter/rx": "^1.0.0",
6565
"husky": "^7.0.4",
6666
"jest": "^28.0.0",
67-
"jest-preset-angular": "^12.2.0",
68-
"ng-packagr": "^14.0.0",
67+
"jest-preset-angular": "^12.2.3",
68+
"ng-packagr": "^15.0.0",
6969
"postcss": "^8.0.0",
7070
"prettier": "^2.5.0",
7171
"pretty-quick": "^3.1.2",
@@ -74,7 +74,7 @@
7474
"schema-utils": "^4.0.0",
7575
"ts-node": "10.4.0",
7676
"tslint": "^6.1.0",
77-
"typescript": "~4.6.2",
77+
"typescript": "~4.8.4",
7878
"zone.js": "0.11.4"
7979
},
8080
"jest": {

test-angular-versions/v11/cypress/integration/sample_app_spec.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
describe('Angular v9 app', () => {
1+
describe('Angular app', () => {
22
beforeEach(() => {
33
window.sessionStorage.clear();
44
});

test-angular-versions/v11/package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
{
2-
"name": "v9",
2+
"name": "11",
33
"version": "0.0.0",
44
"scripts": {
55
"ng": "ng",
@@ -47,4 +47,4 @@
4747
"tslint": "~6.1.0",
4848
"typescript": "~4.0.5"
4949
}
50-
}
50+
}

test-angular-versions/v11/src/app/lazy/lazy.component.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,5 +8,5 @@ import { Component, Input } from '@angular/core';
88
`,
99
})
1010
export class LazyComponent {
11-
@Input('$state$') state;
11+
@Input('$state$') state: any;
1212
}

test-angular-versions/v15/README.md

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
# V15
2+
3+
This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 15.0.4.
4+
5+
## Development server
6+
7+
Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The application will automatically reload if you change any of the source files.
8+
9+
## Code scaffolding
10+
11+
Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
12+
13+
## Build
14+
15+
Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory.
16+
17+
## Running unit tests
18+
19+
Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
20+
21+
## Running end-to-end tests
22+
23+
Run `ng e2e` to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.
24+
25+
## Further help
26+
27+
To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.
Lines changed: 126 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,126 @@
1+
{
2+
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
3+
"version": 1,
4+
"cli": {
5+
"packageManager": "yarn"
6+
},
7+
"newProjectRoot": "projects",
8+
"projects": {
9+
"v15": {
10+
"projectType": "application",
11+
"schematics": {
12+
"@schematics/angular:class": {
13+
"skipTests": true
14+
},
15+
"@schematics/angular:component": {
16+
"skipTests": true
17+
},
18+
"@schematics/angular:directive": {
19+
"skipTests": true
20+
},
21+
"@schematics/angular:guard": {
22+
"skipTests": true
23+
},
24+
"@schematics/angular:interceptor": {
25+
"skipTests": true
26+
},
27+
"@schematics/angular:pipe": {
28+
"skipTests": true
29+
},
30+
"@schematics/angular:resolver": {
31+
"skipTests": true
32+
},
33+
"@schematics/angular:service": {
34+
"skipTests": true
35+
}
36+
},
37+
"root": "",
38+
"sourceRoot": "src",
39+
"prefix": "app",
40+
"architect": {
41+
"build": {
42+
"builder": "@angular-devkit/build-angular:browser",
43+
"options": {
44+
"outputPath": "dist/v15",
45+
"index": "src/index.html",
46+
"main": "src/main.ts",
47+
"polyfills": [
48+
"zone.js"
49+
],
50+
"tsConfig": "tsconfig.app.json",
51+
"assets": [
52+
"src/favicon.ico",
53+
"src/assets"
54+
],
55+
"styles": [
56+
"src/styles.css"
57+
],
58+
"scripts": []
59+
},
60+
"configurations": {
61+
"production": {
62+
"budgets": [
63+
{
64+
"type": "initial",
65+
"maximumWarning": "500kb",
66+
"maximumError": "1mb"
67+
},
68+
{
69+
"type": "anyComponentStyle",
70+
"maximumWarning": "2kb",
71+
"maximumError": "4kb"
72+
}
73+
],
74+
"outputHashing": "all"
75+
},
76+
"development": {
77+
"buildOptimizer": false,
78+
"optimization": false,
79+
"vendorChunk": true,
80+
"extractLicenses": false,
81+
"sourceMap": true,
82+
"namedChunks": true
83+
}
84+
},
85+
"defaultConfiguration": "production"
86+
},
87+
"serve": {
88+
"builder": "@angular-devkit/build-angular:dev-server",
89+
"configurations": {
90+
"production": {
91+
"browserTarget": "v15:build:production"
92+
},
93+
"development": {
94+
"browserTarget": "v15:build:development"
95+
}
96+
},
97+
"defaultConfiguration": "development"
98+
},
99+
"extract-i18n": {
100+
"builder": "@angular-devkit/build-angular:extract-i18n",
101+
"options": {
102+
"browserTarget": "v15:build"
103+
}
104+
},
105+
"test": {
106+
"builder": "@angular-devkit/build-angular:karma",
107+
"options": {
108+
"polyfills": [
109+
"zone.js",
110+
"zone.js/testing"
111+
],
112+
"tsConfig": "tsconfig.spec.json",
113+
"assets": [
114+
"src/favicon.ico",
115+
"src/assets"
116+
],
117+
"styles": [
118+
"src/styles.css"
119+
],
120+
"scripts": []
121+
}
122+
}
123+
}
124+
}
125+
}
126+
}
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
{
2+
"baseUrl": "http://localhost:4000",
3+
"video": false
4+
}
Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
describe('Angular app', () => {
2+
beforeEach(() => {
3+
window.sessionStorage.clear();
4+
});
5+
6+
it('loads', () => {
7+
cy.visit('');
8+
});
9+
10+
it('loads home state by default', () => {
11+
cy.visit('');
12+
cy.url().should('include', '/home');
13+
});
14+
15+
it('renders uisref as links', () => {
16+
cy.visit('');
17+
cy.get('a').contains('home');
18+
cy.get('a').contains('about');
19+
cy.get('a').contains('lazy');
20+
cy.get('a').contains('lazy.child');
21+
cy.get('a').contains('lazy.child.viewtarget');
22+
});
23+
24+
it('renders home', () => {
25+
cy.visit('/home');
26+
cy.get('a').contains('home').should('have.class', 'active');
27+
cy.get('a').contains('about').should('not.have.class', 'active');
28+
cy.get('#default').contains('home works');
29+
});
30+
31+
it('renders about', () => {
32+
cy.visit('/home');
33+
cy.visit('/about');
34+
cy.get('a').contains('home').should('not.have.class', 'active');
35+
cy.get('a').contains('about').should('have.class', 'active');
36+
cy.get('#default').contains('about works');
37+
});
38+
39+
it('loads lazy routes', () => {
40+
cy.visit('/home');
41+
cy.visit('/lazy');
42+
cy.get('a').contains('home').should('not.have.class', 'active');
43+
cy.get('a').contains('lazy').should('have.class', 'active');
44+
cy.get('#default').contains('lazy works');
45+
});
46+
47+
it('routes to lazy routes', () => {
48+
cy.visit('/lazy');
49+
cy.get('a').contains('home').should('not.have.class', 'active');
50+
cy.get('a').contains('lazy').should('have.class', 'active');
51+
cy.get('#default').contains('lazy works');
52+
});
53+
54+
it('routes to lazy child routes', () => {
55+
cy.visit('/lazy/child');
56+
cy.get('a').contains('home').should('not.have.class', 'active');
57+
cy.get('a').contains('lazy.child').should('have.class', 'active');
58+
cy.get('#default').contains('lazy.child works');
59+
});
60+
61+
it('targets named views', () => {
62+
cy.visit('/lazy/child/viewtarget');
63+
cy.get('a').contains('home').should('not.have.class', 'active');
64+
cy.get('a').contains('lazy.child').should('have.class', 'active');
65+
cy.get('#default').contains('lazy.child works');
66+
cy.get('#header').contains('lazy.child.viewtarget works');
67+
cy.get('#footer').contains('lazy.child.viewtarget works');
68+
});
69+
});
Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
{
2+
"name": "15",
3+
"version": "0.0.0",
4+
"scripts": {
5+
"ng": "ng",
6+
"start": "ng serve",
7+
"build": "ng build",
8+
"watch": "ng build --watch --configuration development",
9+
"test": "npm run test:dev && npm run test:prod",
10+
"test:dev": "ng build --configuration development && cypress-runner run --path dist/v15",
11+
"test:prod": "ng build --configuration production && cypress-runner run --path dist/v15"
12+
},
13+
"private": true,
14+
"dependencies": {
15+
"@angular/animations": "^15.0.0",
16+
"@angular/common": "^15.0.0",
17+
"@angular/compiler": "^15.0.0",
18+
"@angular/core": "^15.0.0",
19+
"@angular/forms": "^15.0.0",
20+
"@angular/platform-browser": "^15.0.0",
21+
"@angular/platform-browser-dynamic": "^15.0.0",
22+
"@angular/router": "^15.0.0",
23+
"rxjs": "~7.5.0",
24+
"tslib": "^2.3.0",
25+
"zone.js": "~0.12.0",
26+
"@uirouter/angular": "*",
27+
"@uirouter/cypress-runner": "*"
28+
},
29+
"devDependencies": {
30+
"@angular-devkit/build-angular": "^15.0.4",
31+
"@angular/cli": "~15.0.4",
32+
"@angular/compiler-cli": "^15.0.0",
33+
"@types/jasmine": "~4.3.0",
34+
"jasmine-core": "~4.5.0",
35+
"karma": "~6.4.0",
36+
"karma-chrome-launcher": "~3.1.0",
37+
"karma-coverage": "~2.2.0",
38+
"karma-jasmine": "~5.1.0",
39+
"karma-jasmine-html-reporter": "~2.0.0",
40+
"typescript": "~4.8.2"
41+
}
42+
}
Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import { Component } from '@angular/core';
2+
3+
@Component({
4+
selector: 'app-about',
5+
template: ` <p>about works!</p> `,
6+
})
7+
export class AboutComponent {}

test-angular-versions/v15/src/app/app.component.css

Whitespace-only changes.

0 commit comments

Comments
 (0)