Skip to content

Commit eb506f1

Browse files
chore: upgrade to Angular 15
Closes #319
2 parents 53b29ca + bff8acb commit eb506f1

21 files changed

+109
-129
lines changed

.github/workflows/ci.yml

+1-1
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ jobs:
2626
with:
2727
node-version: ${{ matrix.node-version }}
2828
- name: install
29-
run: npm install
29+
run: npm install --legacy-peer-deps
3030
- name: build
3131
run: npm run build -- --skip-nx-cache
3232
- name: test

apps/example-app-karma/.browserslistrc

-17
This file was deleted.

apps/example-app-karma/project.json

+1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
{
2+
"name": "example-app-karma",
23
"$schema": "../../node_modules/nx/schemas/project-schema.json",
34
"projectType": "application",
45
"sourceRoot": "apps/example-app-karma/src",

apps/example-app-karma/src/test.ts

-6
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,5 @@ beforeEach(() => {
99
jasmine.addMatchers(JasmineDOM);
1010
});
1111

12-
declare const require: any;
13-
1412
// First, initialize the Angular testing environment.
1513
getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting(), {});
16-
// Then we find all the tests.
17-
const context = require.context('./', true, /\.spec\.ts$/);
18-
// And load the modules.
19-
context.keys().map(context);

apps/example-app-karma/tsconfig.app.json

+3-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,9 @@
33
"compilerOptions": {
44
"outDir": "../../dist/out-tsc",
55
"types": [],
6-
"allowJs": true
6+
"allowJs": true,
7+
"target": "ES2022",
8+
"useDefineForClassFields": false
79
},
810
"files": ["src/main.ts", "src/polyfills.ts"],
911
"include": ["src/**/*.d.ts"],

apps/example-app-karma/tsconfig.spec.json

+3-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,9 @@
22
"extends": "./tsconfig.json",
33
"compilerOptions": {
44
"outDir": "./out-tsc/spec",
5-
"types": ["jasmine", "node", "@testing-library/jasmine-dom"]
5+
"types": ["jasmine", "node", "@testing-library/jasmine-dom"],
6+
"target": "ES2022",
7+
"useDefineForClassFields": false
68
},
79
"files": ["src/test.ts", "src/polyfills.ts"],
810
"include": ["**/*.spec.ts", "**/*.d.ts"]

apps/example-app/.browserslistrc

-17
This file was deleted.

apps/example-app/project.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
{
2+
"name": "example-app",
23
"$schema": "../../node_modules/nx/schemas/project-schema.json",
34
"projectType": "application",
45
"sourceRoot": "apps/example-app/src",
@@ -75,7 +76,7 @@
7576
"options": {
7677
"jestConfig": "apps/example-app/jest.config.ts"
7778
},
78-
"outputs": ["coverage/"]
79+
"outputs": ["{workspaceRoot}/coverage/"]
7980
}
8081
},
8182
"tags": []

apps/example-app/src/app/app-routing.module.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -95,7 +95,7 @@ export const routes: Routes = [
9595
];
9696

9797
@NgModule({
98-
imports: [RouterModule.forRoot(routes, { relativeLinkResolution: 'legacy' })],
98+
imports: [RouterModule.forRoot(routes, {})],
9999
exports: [RouterModule],
100100
})
101101
export class AppRoutingModule {}

apps/example-app/src/app/app.module.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { StoreModule } from '@ngrx/store';
77
import { AppRoutingModule } from './app-routing.module';
88
import { MaterialModule } from './material.module';
99
import { MatIconModule } from '@angular/material/icon';
10-
import { MatListModule } from '@angular/material/list';
10+
import { MatLegacyListModule as MatListModule } from '@angular/material/legacy-list';
1111
import { MatSidenavModule } from '@angular/material/sidenav';
1212
import { MatToolbarModule } from '@angular/material/toolbar';
1313

apps/example-app/src/app/material.module.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { NgModule } from '@angular/core';
22

3-
import { MatInputModule } from '@angular/material/input';
4-
import { MatSelectModule } from '@angular/material/select';
3+
import { MatLegacyInputModule as MatInputModule } from '@angular/material/legacy-input';
4+
import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
55
import { MatDatepickerModule } from '@angular/material/datepicker';
66
import { MatNativeDateModule } from '@angular/material/core';
77

apps/example-app/tsconfig.app.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,8 @@
44
"outDir": "../../dist/out-tsc",
55
"types": [],
66
"allowJs": true,
7-
"target": "ES2020"
7+
"target": "ES2022",
8+
"useDefineForClassFields": false
89
},
910
"files": ["src/main.ts", "src/polyfills.ts"],
1011
"include": ["src/**/*.d.ts"],

nx.json

+21-8
Original file line numberDiff line numberDiff line change
@@ -15,13 +15,6 @@
1515
"environment": "all"
1616
}
1717
},
18-
"implicitDependencies": {
19-
"package.json": {
20-
"dependencies": "*",
21-
"devDependencies": "*"
22-
},
23-
".eslintrc.json": "*"
24-
},
2518
"tasksRunnerOptions": {
2619
"default": {
2720
"runner": "@nrwl/nx-cloud",
@@ -75,7 +68,27 @@
7568
"$schema": "./node_modules/nx/schemas/nx-schema.json",
7669
"targetDefaults": {
7770
"build": {
78-
"dependsOn": ["^build"]
71+
"dependsOn": ["^build"],
72+
"inputs": ["production", "^production"]
73+
},
74+
"test": {
75+
"inputs": ["default", "^production"]
76+
},
77+
"lint": {
78+
"inputs": ["default", "{workspaceRoot}/.eslintrc.json"]
7979
}
80+
},
81+
"namedInputs": {
82+
"default": ["{projectRoot}/**/*", "sharedGlobals"],
83+
"sharedGlobals": [],
84+
"production": [
85+
"default",
86+
"!{projectRoot}/**/*.spec.[jt]s",
87+
"!{projectRoot}/tsconfig.spec.json",
88+
"!{projectRoot}/karma.conf.js",
89+
"!{projectRoot}/**/?(*.)+(spec|test).[jt]s?(x)?(.snap)",
90+
"!{projectRoot}/jest.config.[jt]s",
91+
"!{projectRoot}/.eslintrc.json"
92+
]
8093
}
8194
}

package.json

+34-34
Original file line numberDiff line numberDiff line change
@@ -28,51 +28,51 @@
2828
"prepare": "git config core.hookspath .githooks"
2929
},
3030
"dependencies": {
31-
"@angular/animations": "14.1.3",
32-
"@angular/cdk": "14.1.3",
33-
"@angular/common": "14.1.3",
34-
"@angular/compiler": "14.1.3",
35-
"@angular/core": "14.1.3",
36-
"@angular/material": "14.1.3",
37-
"@angular/platform-browser": "14.1.3",
38-
"@angular/platform-browser-dynamic": "14.1.3",
39-
"@angular/router": "14.1.3",
31+
"@angular/animations": "15.0.0",
32+
"@angular/cdk": "15.0.0",
33+
"@angular/common": "15.0.0",
34+
"@angular/compiler": "15.0.0",
35+
"@angular/core": "15.0.0",
36+
"@angular/material": "15.0.0",
37+
"@angular/platform-browser": "15.0.0",
38+
"@angular/platform-browser-dynamic": "15.0.0",
39+
"@angular/router": "15.0.0",
4040
"@ngrx/store": "14.0.2",
41-
"@nrwl/angular": "14.5.8",
42-
"@nrwl/nx-cloud": "14.4.1",
41+
"@nrwl/angular": "15.2.1",
42+
"@nrwl/nx-cloud": "15.0.2",
4343
"@testing-library/dom": "^8.11.1",
4444
"rxjs": "7.5.6",
4545
"tslib": "~2.3.1",
4646
"zone.js": "~0.11.4"
4747
},
4848
"devDependencies": {
49-
"@angular-devkit/build-angular": "14.1.3",
49+
"@angular-devkit/build-angular": "15.0.0",
5050
"@angular-eslint/builder": "14.0.2",
51-
"@angular-eslint/eslint-plugin": "14.0.2",
52-
"@angular-eslint/eslint-plugin-template": "14.0.2",
51+
"@angular-eslint/eslint-plugin": "14.0.4",
52+
"@angular-eslint/eslint-plugin-template": "14.0.4",
5353
"@angular-eslint/schematics": "14.0.2",
54-
"@angular-eslint/template-parser": "14.0.2",
55-
"@angular/cli": "~14.1.0",
56-
"@angular/compiler-cli": "14.1.3",
57-
"@angular/forms": "14.1.3",
58-
"@angular/language-service": "14.1.3",
59-
"@nrwl/cli": "14.5.8",
60-
"@nrwl/eslint-plugin-nx": "14.5.8",
61-
"@nrwl/jest": "14.5.8",
62-
"@nrwl/linter": "14.5.8",
63-
"@nrwl/node": "14.5.8",
64-
"@nrwl/nx-plugin": "14.5.8",
65-
"@nrwl/workspace": "14.5.8",
54+
"@angular-eslint/template-parser": "14.0.4",
55+
"@angular/cli": "~15.0.0",
56+
"@angular/compiler-cli": "15.0.0",
57+
"@angular/forms": "15.0.0",
58+
"@angular/language-service": "15.0.0",
59+
"@nrwl/cli": "15.2.1",
60+
"@nrwl/eslint-plugin-nx": "15.2.1",
61+
"@nrwl/jest": "15.2.1",
62+
"@nrwl/linter": "15.2.1",
63+
"@nrwl/node": "15.2.1",
64+
"@nrwl/nx-plugin": "15.2.1",
65+
"@nrwl/workspace": "15.2.1",
6666
"@swc-node/register": "^1.4.2",
6767
"@swc/core": "^1.2.173",
6868
"@testing-library/jasmine-dom": "^1.2.0",
6969
"@testing-library/jest-dom": "^5.15.1",
7070
"@testing-library/user-event": "^13.5.0",
7171
"@types/jasmine": "4.0.3",
72-
"@types/jest": "28.1.7",
72+
"@types/jest": "28.1.8",
7373
"@types/node": "18.7.1",
74-
"@typescript-eslint/eslint-plugin": "5.29.0",
75-
"@typescript-eslint/parser": "5.29.0",
74+
"@typescript-eslint/eslint-plugin": "5.36.1",
75+
"@typescript-eslint/parser": "5.36.1",
7676
"cpy-cli": "^3.1.1",
7777
"eslint": "8.15.0",
7878
"eslint-config-prettier": "8.3.0",
@@ -84,15 +84,15 @@
8484
"jasmine-core": "4.2.0",
8585
"jasmine-spec-reporter": "7.0.0",
8686
"jest": "28.1.3",
87-
"jest-environment-jsdom": "^28.1.1",
88-
"jest-preset-angular": "12.1.0",
87+
"jest-environment-jsdom": "28.1.3",
88+
"jest-preset-angular": "12.2.2",
8989
"karma": "6.4.0",
9090
"karma-chrome-launcher": "^3.1.0",
9191
"karma-jasmine": "5.1.0",
9292
"karma-jasmine-html-reporter": "2.0.0",
9393
"lint-staged": "^12.1.6",
94-
"ng-packagr": "14.1.0",
95-
"nx": "14.5.8",
94+
"ng-packagr": "15.0.0",
95+
"nx": "15.2.1",
9696
"postcss": "^8.4.5",
9797
"postcss-import": "14.1.0",
9898
"postcss-preset-env": "7.5.0",
@@ -102,6 +102,6 @@
102102
"semantic-release": "^18.0.0",
103103
"ts-jest": "28.0.8",
104104
"ts-node": "10.9.1",
105-
"typescript": "4.7.4"
105+
"typescript": "4.8.4"
106106
}
107107
}

projects/testing-library/project.json

+4-3
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
11
{
2+
"name": "testing-library",
23
"$schema": "../../node_modules/nx/schemas/project-schema.json",
34
"projectType": "library",
45
"sourceRoot": "projects/testing-library/src",
56
"prefix": "lib",
67
"targets": {
78
"build-package": {
89
"executor": "@nrwl/angular:package",
9-
"outputs": ["dist/@testing-library/angular"],
10+
"outputs": ["{workspaceRoot}/dist/@testing-library/angular"],
1011
"options": {
1112
"project": "projects/testing-library/ng-package.json"
1213
},
@@ -28,7 +29,7 @@
2829
"outputs": ["{options.outputFile}"]
2930
},
3031
"build": {
31-
"executor": "@nrwl/workspace:run-commands",
32+
"executor": "nx:run-commands",
3233
"options": {
3334
"parallel": false,
3435
"commands": [
@@ -49,7 +50,7 @@
4950
"options": {
5051
"jestConfig": "projects/testing-library/jest.config.ts"
5152
},
52-
"outputs": ["coverage/projects/testing-library"]
53+
"outputs": ["{workspaceRoot}/coverage/projects/testing-library"]
5354
}
5455
},
5556
"tags": []

projects/testing-library/src/lib/models.ts

+2-4
Original file line numberDiff line numberDiff line change
@@ -195,14 +195,12 @@ export interface RenderComponentOptions<ComponentType, Q extends Queries = typeo
195195
*
196196
* @example
197197
* const component = await render(AppComponent, {
198-
* ɵcomponentImports: [
198+
* componentImports: [
199199
* MockChildComponent
200200
* ]
201201
* })
202-
*
203-
* @experimental
204202
*/
205-
ɵcomponentImports?: (Type<any> | any[])[];
203+
componentImports?: (Type<any> | any[])[];
206204
/**
207205
* @description
208206
* Queries to bind. Overrides the default set from DOM Testing Library unless merged.

projects/testing-library/src/lib/testing-library.ts

+4-7
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@ export async function render<SutType, WrapperType = SutType>(
5555
wrapper = WrapperComponent as Type<WrapperType>,
5656
componentProperties = {},
5757
componentProviders = [],
58-
ɵcomponentImports: componentImports,
58+
componentImports: componentImports,
5959
excludeComponentDeclaration = false,
6060
routes = [],
6161
removeAngularAttributes = false,
@@ -107,7 +107,7 @@ export async function render<SutType, WrapperType = SutType>(
107107
};
108108

109109
const change = (changedProperties: Partial<SutType>) => {
110-
const changes = getChangesObj(fixture.componentInstance, changedProperties);
110+
const changes = getChangesObj(fixture.componentInstance as Record<string, any>, changedProperties);
111111

112112
setComponentProperties(fixture, { componentProperties: changedProperties });
113113

@@ -288,17 +288,14 @@ function hasOnChangesHook<SutType>(componentInstance: SutType): componentInstanc
288288
);
289289
}
290290

291-
function getChangesObj<SutType extends Record<string, any>>(
292-
oldProps: Partial<SutType> | null,
293-
newProps: Partial<SutType>,
294-
) {
291+
function getChangesObj(oldProps: Record<string, any> | null, newProps: Record<string, any>) {
295292
const isFirstChange = oldProps === null;
296293
return Object.keys(newProps).reduce<SimpleChanges>(
297294
(changes, key) => ({
298295
...changes,
299296
[key]: new SimpleChange(isFirstChange ? null : oldProps[key], newProps[key], isFirstChange),
300297
}),
301-
{} as SutType,
298+
{} as Record<string, any>,
302299
);
303300
}
304301

projects/testing-library/tests/render-template.spec.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -135,7 +135,7 @@ describe('removeAngularAttributes', () => {
135135
});
136136

137137
test('updates properties and invokes change detection', async () => {
138-
const view = await render('<div [update]="value" ></div>', {
138+
const view = await render<{ value: string }>('<div [update]="value" ></div>', {
139139
declarations: [UpdateInputDirective],
140140
componentProperties: {
141141
value: 'value1',

0 commit comments

Comments
 (0)