Dodes/#15 angular17 update

.gitignore

@@ -39,3 +39,5 @@ testem.log
 Thumbs.db
 
 .angular
+
+.nx/cache

.prettierignore

@@ -3,3 +3,5 @@
 /dist
 /coverage
 .angular
+
+/.nx/cache

apps/examples-e2e/project.json

@@ -21,11 +21,8 @@
       }
     },
     "lint": {
-      "executor": "@nx/linter:eslint",
-      "outputs": ["{options.outputFile}"],
-      "options": {
-        "lintFilePatterns": ["apps/examples-e2e/**/*.{js,ts}"]
-      }
+      "executor": "@nx/eslint:lint",
+      "outputs": ["{options.outputFile}"]
     }
   },
   "tags": [],

apps/examples/project.json

@@ -50,39 +50,29 @@
       "executor": "@angular-devkit/build-angular:dev-server",
       "configurations": {
         "production": {
-          "browserTarget": "examples:build:production"
+          "buildTarget": "examples:build:production"
         },
         "development": {
-          "browserTarget": "examples:build:development"
+          "buildTarget": "examples:build:development"
         }
       },
       "defaultConfiguration": "development"
     },
     "extract-i18n": {
       "executor": "@angular-devkit/build-angular:extract-i18n",
       "options": {
-        "browserTarget": "examples:build"
+        "buildTarget": "examples:build"
       }
     },
     "lint": {
-      "executor": "@nx/linter:eslint",
-      "outputs": ["{options.outputFile}"],
-      "options": {
-        "lintFilePatterns": ["apps/examples/**/*.ts", "apps/examples/**/*.html"]
-      }
+      "executor": "@nx/eslint:lint",
+      "outputs": ["{options.outputFile}"]
     },
     "test": {
       "executor": "@nx/jest:jest",
       "outputs": ["{workspaceRoot}/coverage/{projectRoot}"],
       "options": {
-        "jestConfig": "apps/examples/jest.config.ts",
-        "passWithNoTests": true
-      },
-      "configurations": {
-        "ci": {
-          "ci": true,
-          "codeCoverage": true
-        }
+        "jestConfig": "apps/examples/jest.config.ts"
       }
     },
     "serve-static": {

apps/examples/src/app/basic-smart-dumb-example/basic-smart/basic-smart.component.spec.ts

@@ -4,7 +4,6 @@ import { cold } from 'jest-marbles';
 import { errorState, loadedState, loadingState } from 'ngx-http-request-state';
 import { Brewery } from '../model/brewery';
 import { RandomBreweryService } from '../random-brewery.service';
-import * as angularCore from '@angular/core';
 
 describe('BasicSmartComponent', () => {
   function createComponent(): {
@@ -16,15 +15,7 @@ describe('BasicSmartComponent', () => {
       randomBrewery: jest.fn(),
     }) as jest.Mocked<RandomBreweryService>;
 
-    const injectSpy = jest.spyOn(angularCore, 'inject');
-    injectSpy.mockImplementation((providerToken: unknown) => {
-      if (providerToken === RandomBreweryService) {
-        return mockService;
-      }
-      throw new Error(`Unexpected inject token: ` + providerToken);
-    });
-
-    const component = new BasicSmartComponent();
+    const component = new BasicSmartComponent(mockService);
     return {
       component,
       mockService,

apps/examples/src/app/basic-smart-dumb-example/basic-smart/basic-smart.component.ts

@@ -16,7 +16,7 @@ import { AsyncPipe } from '@angular/common';
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class BasicSmartComponent {
-  private readonly service = inject(RandomBreweryService);
+  constructor(private readonly service: RandomBreweryService) {}
 
   private readonly loadNewBrewery$ = new Subject<void>();
 

apps/examples/src/app/multiple-data-sources/container/multiple-sources-container.component.spec.ts

@@ -21,13 +21,8 @@ describe('MultipleSourcesContainerComponent', () => {
       brewedBefore: jest.fn(),
       brewedAfter: jest.fn(),
     } as unknown as jest.Mocked<PunkApiService>;
-    jest.spyOn(angularCore, 'inject').mockImplementation((token) => {
-      if (token === PunkApiService) {
-        return service;
-      }
-      throw new Error('No provider for ' + token);
-    });
-    const component = new MultipleSourcesContainerComponent();
+
+    const component = new MultipleSourcesContainerComponent(service);
     return { component, service };
   }
 

apps/examples/src/app/multiple-data-sources/container/multiple-sources-container.component.ts

@@ -1,4 +1,4 @@
-import { ChangeDetectionStrategy, Component, inject } from '@angular/core';
+import { ChangeDetectionStrategy, Component } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { MultipleSourcesLayoutComponent } from '../layout/multiple-sources-layout.component';
 import { BrewDateForm } from '../model/form';
@@ -17,9 +17,10 @@ import { map } from 'rxjs/operators';
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class MultipleSourcesContainerComponent {
-  private readonly punkApi = inject(PunkApiService);
   private readonly search$ = new Subject<BrewDateForm>();
 
+  constructor(private readonly punkApi: PunkApiService) {}
+
   readonly beers$: Observable<HttpRequestState<Brews & BrewDateForm>> =
     this.search$.pipe(switchMap((params) => this.getBeers(params)));
 

libs/ngx-http-request-state/project.json

@@ -11,7 +11,7 @@
       "outputs": ["{workspaceRoot}/dist/{projectRoot}"],
       "options": {
         "project": "libs/ngx-http-request-state/ng-package.json",
-        "updateBuildableProjectDepsInPackageJson": false
+        "updateBuildableProjectDepsInPackageJson": true
       },
       "configurations": {
         "production": {
@@ -24,27 +24,14 @@
       "defaultConfiguration": "production"
     },
     "lint": {
-      "executor": "@nx/linter:eslint",
-      "options": {
-        "lintFilePatterns": [
-          "libs/ngx-http-request-state/src/**/*.ts",
-          "libs/ngx-http-request-state/src/**/*.html"
-        ]
-      },
+      "executor": "@nx/eslint:lint",
       "outputs": ["{options.outputFile}"]
     },
     "test": {
       "executor": "@nx/jest:jest",
       "outputs": ["{workspaceRoot}/coverage/{projectRoot}"],
       "options": {
-        "jestConfig": "libs/ngx-http-request-state/jest.config.ts",
-        "passWithNoTests": true
-      },
-      "configurations": {
-        "ci": {
-          "ci": true,
-          "codeCoverage": true
-        }
+        "jestConfig": "libs/ngx-http-request-state/jest.config.ts"
       }
     }
   }

nx.json

@@ -3,14 +3,6 @@
   "affected": {
     "defaultBase": "origin/main"
   },
-  "tasksRunnerOptions": {
-    "default": {
-      "runner": "nx/tasks-runners/default",
-      "options": {
-        "cacheableOperations": ["build", "lint", "test", "e2e"]
-      }
-    }
-  },
   "generators": {
     "@nx/angular:application": {
       "style": "css",
@@ -29,21 +21,34 @@
   },
   "targetDefaults": {
     "e2e": {
-      "inputs": ["default", "^production"]
-    },
-    "test": {
-      "inputs": ["default", "^production", "{workspaceRoot}/jest.preset.js"]
+      "inputs": ["default", "^production"],
+      "cache": true
     },
     "lint": {
       "inputs": [
         "default",
         "{workspaceRoot}/.eslintrc.json",
         "{workspaceRoot}/.eslintignore"
-      ]
+      ],
+      "cache": true
     },
     "build": {
       "dependsOn": ["^build"],
-      "inputs": ["production", "^production"]
+      "inputs": ["production", "^production"],
+      "cache": true
+    },
+    "@nx/jest:jest": {
+      "inputs": ["default", "^production", "{workspaceRoot}/jest.preset.js"],
+      "cache": true,
+      "options": {
+        "passWithNoTests": true
+      },
+      "configurations": {
+        "ci": {
+          "ci": true,
+          "codeCoverage": true
+        }
+      }
     }
   },
   "namedInputs": {
@@ -53,7 +58,8 @@
       "!{projectRoot}/**/?(*.)+(spec|test).[jt]s?(x)?(.snap)",
       "!{projectRoot}/tsconfig.spec.json",
       "!{projectRoot}/jest.config.[jt]s",
-      "!{projectRoot}/.eslintrc.json"
+      "!{projectRoot}/.eslintrc.json",
+      "!{projectRoot}/src/test-setup.[jt]s"
     ],
     "sharedGlobals": []
   }