Angular 17 (#633)

* feat: 🎸 upgrade to Angular 17

Upgrade packages and dependencies

BREAKING CHANGE: 🧨 The library now requires a minimum version of Angular 17.0.0

✅ Closes: #631

* feat: 🎸 upgrade to Angular 17

Added a wrapper for Angular 17 TestBed.flushEffects()

✅ Closes: #631

Author: lneumeier

README.md

@@ -209,6 +209,7 @@ The `createComponent()` method returns an instance of `Spectator` which exposes
 - `element` - The tested component's native element
 - `debugElement` - The tested fixture's debug element
 
+- `flushEffects()` - Provides a wrapper for `TestBed.flushEffects()`
 - `inject()` - Provides a wrapper for `TestBed.inject()`:
 ```ts
 const service = spectator.inject(QueryService);
@@ -1008,7 +1009,7 @@ it('should call the weather api in the constructor', () => {
       { provide: WeatherDataApi, useValue: weatherService }
     ]
   });
-  
+
   expect(weatherService.getWeatherData).toHaveBeenCalled();
 });
 ```
@@ -1219,7 +1220,7 @@ expect('.zippy__content').toHaveClass(['class-b', 'class-a'], { strict: false })
 
 // Note that toHaveText only looks for the existence of a string, not if the string is exactly the same. If you want to verify that the string is completely the same, use toHaveExactText.
 // Note that if you want to verify that the string is completely the same, but trimmed first, use toHaveExactTrimmedText.
-// Note that if you pass multiple values, Spectator checks the text of each array element against the index of the element found. 
+// Note that if you pass multiple values, Spectator checks the text of each array element against the index of the element found.
 expect('.zippy__content').toHaveText('Content');
 expect('.zippy__content').toHaveText(['Content A', 'Content B']);
 expect('.zippy__content').toHaveText((text) => text.includes('..'));
@@ -1288,7 +1289,7 @@ The `spectator` schematics extend the default `@schematics/angular` collection.
 
 ## Working Spectator & Jest Sample Repo and Karma Comparison
 
-The [examples in Karma]((https://stackblitz.com/angular/pmqopjovvvb?file=src%2Fapp%2Fapp.component.html)) from Angular docs [testing developer guide](https://angular.io/guide/testing) has been reproduced in Spectator and Jest. 
+The [examples in Karma]((https://stackblitz.com/angular/pmqopjovvvb?file=src%2Fapp%2Fapp.component.html)) from Angular docs [testing developer guide](https://angular.io/guide/testing) has been reproduced in Spectator and Jest.
 (For convenience, [this is the local version](https://github.com/muratkeremozcan/books/tree/master/Angular_with_Typescript/angular-unit-testing-with-Karma) of the Karma examples.)
 
 The Spectator & Jest version can be accessed [here](https://github.com/muratkeremozcan/angular-playground).

package.json

@@ -30,59 +30,60 @@
     "release:dry": "cd projects/spectator && standard-version --infile ../../CHANGELOG.md --dry-run"
   },
   "devDependencies": {
-    "@angular-builders/jest": "^16.0.0",
-    "@angular-devkit/build-angular": "^16.0.0",
-    "@angular-devkit/schematics": "^16.0.0",
-    "@angular-eslint/builder": "16.0.1",
-    "@angular-eslint/eslint-plugin": "16.0.1",
-    "@angular-eslint/eslint-plugin-template": "16.0.1",
-    "@angular-eslint/schematics": "16.0.1",
-    "@angular-eslint/template-parser": "16.0.1",
-    "@angular/animations": "^16.0.0",
-    "@angular/cdk": "^16.0.0",
-    "@angular/cli": "^16.0.0",
-    "@angular/common": "^16.0.0",
-    "@angular/compiler": "^16.0.0",
-    "@angular/compiler-cli": "^16.0.0",
-    "@angular/core": "^16.0.0",
-    "@angular/forms": "^16.0.0",
-    "@angular/language-service": "^16.0.0",
-    "@angular/platform-browser": "^16.0.0",
-    "@angular/platform-browser-dynamic": "^16.0.0",
-    "@angular/router": "16.0.0",
+    "@angular-builders/jest": "^17.0.0",
+    "@angular-devkit/build-angular": "^17.0.6",
+    "@angular-devkit/schematics": "^17.0.6",
+    "@angular-eslint/builder": "17.1.1",
+    "@angular-eslint/eslint-plugin": "17.1.1",
+    "@angular-eslint/eslint-plugin-template": "17.1.1",
+    "@angular-eslint/schematics": "17.1.1",
+    "@angular-eslint/template-parser": "17.1.1",
+    "@angular/animations": "^17.0.6",
+    "@angular/cdk": "^17.0.3",
+    "@angular/cli": "^17.0.6",
+    "@angular/common": "^17.0.6",
+    "@angular/compiler": "^17.0.6",
+    "@angular/compiler-cli": "^17.0.6",
+    "@angular/core": "^17.0.6",
+    "@angular/forms": "^17.0.6",
+    "@angular/language-service": "^17.0.6",
+    "@angular/platform-browser": "^17.0.6",
+    "@angular/platform-browser-dynamic": "^17.0.6",
+    "@angular/router": "17.0.6",
     "@commitlint/cli": "17.3.0",
     "@commitlint/config-angular": "17.3.0",
     "@commitlint/config-conventional": "17.3.0",
-    "@types/jasmine": "3.8.1",
-    "@types/jest": "29.5.2",
-    "@types/node": "18.16.5",
-    "@typescript-eslint/eslint-plugin": "^5.59.2",
-    "@typescript-eslint/parser": "^5.59.2",
+    "@types/jasmine": "5.1.4",
+    "@types/jest": "29.5.11",
+    "@types/node": "20.10.4",
+    "@typescript-eslint/eslint-plugin": "^6.13.2",
+    "@typescript-eslint/parser": "^6.13.2",
     "all-contributors-cli": "^6.19.0",
     "core-js": "^3.9.1",
     "cross-env": "^5.1.4",
     "cz-conventional-changelog": "^3.3.0",
-    "eslint": "^8.39.0",
+    "eslint": "^8.55.0",
     "git-cz": "^4.7.6",
     "helpful-decorators": "^2.1.0",
     "husky": "^8.0.2",
-    "jasmine-core": "3.8.0",
+    "jasmine-core": "5.1.1",
     "jasmine-spec-reporter": "7.0.0",
-    "jest": "29.5.0",
-    "jest-preset-angular": "13.1.1",
-    "karma": "6.3.4",
-    "karma-chrome-launcher": "3.1.0",
+    "jest": "29.7.0",
+    "jest-preset-angular": "13.1.4",
+    "karma": "6.4.2",
+    "karma-chrome-launcher": "3.2.0",
     "karma-coverage-istanbul-reporter": "3.0.3",
-    "karma-jasmine": "4.0.1",
-    "karma-jasmine-html-reporter": "1.7.0",
+    "karma-jasmine": "5.1.0",
+    "karma-jasmine-html-reporter": "2.1.0",
     "lint-staged": "^13.1.0",
-    "ng-packagr": "16.0.0",
+    "ng-packagr": "17.0.2",
     "prettier": "2.3.2",
-    "rxjs": "6.6.3",
+    "rxjs": "7.8.1",
     "standard-version": "^9.1.0",
     "ts-node": "10.1.0",
-    "typescript": "5.0.4",
-    "zone.js": "0.13.0"
+    "tslib": "^2.6.2",
+    "typescript": "5.2.2",
+    "zone.js": "0.14.2"
   },
   "config": {
     "commitizen": {

projects/spectator/package.json

@@ -26,12 +26,12 @@
     "@testing-library/dom": "^8.11.0",
     "jquery": "3.6.4",
     "replace-in-file": "6.2.0",
-    "tslib": "^2.1.0"
+    "tslib": "^2.6.2"
   },
   "peerDependencies": {
-    "@angular/common": ">= 16.0.0",
-    "@angular/router": ">= 16.0.0",
-    "@angular/animations": ">= 16.0.0"
+    "@angular/common": ">= 17.0.0",
+    "@angular/router": ">= 17.0.0",
+    "@angular/animations": ">= 17.0.0"
   },
   "schematics": "./schematics/collection.json"
 }

projects/spectator/src/lib/base/base-spectator.ts

@@ -10,4 +10,11 @@ export abstract class BaseSpectator {
   public inject<T>(token: Token<T>): SpyObject<T> {
     return TestBed.inject ? TestBed.inject(token) : TestBed.get(token);
   }
+
+  /**
+   * Execute any pending effects.
+   */
+  public flushEffects(): void {
+    TestBed.flushEffects();
+  }
 }

projects/spectator/tsconfig.lib.json

@@ -6,7 +6,8 @@
     "declaration": true,
     "inlineSources": true,
     "typeRoots": [
-      "./typings"
+      "./typings",
+      "../../node_modules/@types"
     ],
     "types": [
       "jasmine",