chore: upgrade to Angular 15

Closes #319

Author: timdeschryver

.github/workflows/ci.yml

@@ -26,7 +26,7 @@ jobs:
         with:
           node-version: ${{ matrix.node-version }}
       - name: install
-        run: npm install
+        run: npm install --legacy-peer-deps
       - name: build
         run: npm run build -- --skip-nx-cache
       - name: test

apps/example-app-karma/.browserslistrc

@@ -1,4 +1,5 @@
 {
+  "name": "example-app-karma",
   "$schema": "../../node_modules/nx/schemas/project-schema.json",
   "projectType": "application",
   "sourceRoot": "apps/example-app-karma/src",

apps/example-app-karma/project.json

@@ -9,11 +9,5 @@ beforeEach(() => {
   jasmine.addMatchers(JasmineDOM);
 });
 
-declare const require: any;
-
 // First, initialize the Angular testing environment.
 getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting(), {});
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);

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

@@ -3,7 +3,9 @@
   "compilerOptions": {
     "outDir": "../../dist/out-tsc",
     "types": [],
-    "allowJs": true
+    "allowJs": true,
+    "target": "ES2022",
+    "useDefineForClassFields": false
   },
   "files": ["src/main.ts", "src/polyfills.ts"],
   "include": ["src/**/*.d.ts"],

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

@@ -2,7 +2,9 @@
   "extends": "./tsconfig.json",
   "compilerOptions": {
     "outDir": "./out-tsc/spec",
-    "types": ["jasmine", "node", "@testing-library/jasmine-dom"]
+    "types": ["jasmine", "node", "@testing-library/jasmine-dom"],
+    "target": "ES2022",
+    "useDefineForClassFields": false
   },
   "files": ["src/test.ts", "src/polyfills.ts"],
   "include": ["**/*.spec.ts", "**/*.d.ts"]

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

@@ -1,4 +1,5 @@
 {
+  "name": "example-app",
   "$schema": "../../node_modules/nx/schemas/project-schema.json",
   "projectType": "application",
   "sourceRoot": "apps/example-app/src",
@@ -75,7 +76,7 @@
       "options": {
         "jestConfig": "apps/example-app/jest.config.ts"
       },
-      "outputs": ["coverage/"]
+      "outputs": ["{workspaceRoot}/coverage/"]
     }
   },
   "tags": []

apps/example-app/.browserslistrc

@@ -95,7 +95,7 @@ export const routes: Routes = [
 ];
 
 @NgModule({
-  imports: [RouterModule.forRoot(routes, { relativeLinkResolution: 'legacy' })],
+  imports: [RouterModule.forRoot(routes, {})],
   exports: [RouterModule],
 })
 export class AppRoutingModule {}

apps/example-app/project.json

@@ -7,7 +7,7 @@ import { StoreModule } from '@ngrx/store';
 import { AppRoutingModule } from './app-routing.module';
 import { MaterialModule } from './material.module';
 import { MatIconModule } from '@angular/material/icon';
-import { MatListModule } from '@angular/material/list';
+import { MatLegacyListModule as MatListModule } from '@angular/material/legacy-list';
 import { MatSidenavModule } from '@angular/material/sidenav';
 import { MatToolbarModule } from '@angular/material/toolbar';