chore: update to Angular 17.3 (#441)

Author: timdeschryver

package.json

@@ -28,15 +28,15 @@
     "prepare": "git config core.hookspath .githooks"
   },
   "dependencies": {
-    "@angular/animations": "17.1.0",
-    "@angular/cdk": "17.1.0",
-    "@angular/common": "17.1.0",
-    "@angular/compiler": "17.1.0",
-    "@angular/core": "17.1.0",
-    "@angular/material": "17.1.0",
-    "@angular/platform-browser": "17.1.0",
-    "@angular/platform-browser-dynamic": "17.1.0",
-    "@angular/router": "17.1.0",
+    "@angular/animations": "17.3.2",
+    "@angular/cdk": "17.3.2",
+    "@angular/common": "17.3.2",
+    "@angular/compiler": "17.3.2",
+    "@angular/core": "17.3.2",
+    "@angular/material": "17.3.2",
+    "@angular/platform-browser": "17.3.2",
+    "@angular/platform-browser-dynamic": "17.3.2",
+    "@angular/router": "17.3.2",
     "@ngrx/store": "17.1.0",
     "@nx/angular": "17.2.8",
     "@testing-library/dom": "^9.0.0",
@@ -45,25 +45,25 @@
     "zone.js": "0.14.2"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "17.1.0",
-    "@angular-devkit/core": "17.1.0",
-    "@angular-devkit/schematics": "17.1.0",
+    "@angular-devkit/build-angular": "17.3.2",
+    "@angular-devkit/core": "17.3.2",
+    "@angular-devkit/schematics": "17.3.2",
     "@angular-eslint/builder": "17.0.1",
     "@angular-eslint/eslint-plugin": "17.0.1",
     "@angular-eslint/eslint-plugin-template": "17.0.1",
     "@angular-eslint/schematics": "17.0.1",
     "@angular-eslint/template-parser": "17.0.1",
-    "@angular/cli": "~17.1.0",
-    "@angular/compiler-cli": "17.1.0",
-    "@angular/forms": "17.1.0",
-    "@angular/language-service": "17.1.0",
+    "@angular/cli": "~17.3.2",
+    "@angular/compiler-cli": "17.3.2",
+    "@angular/forms": "17.3.2",
+    "@angular/language-service": "17.3.2",
     "@nx/eslint": "17.2.8",
     "@nx/eslint-plugin": "17.2.8",
     "@nx/jest": "17.2.8",
     "@nx/node": "17.2.8",
     "@nx/plugin": "17.2.8",
     "@nx/workspace": "17.2.8",
-    "@schematics/angular": "17.1.0",
+    "@schematics/angular": "17.3.2",
     "@testing-library/jasmine-dom": "^1.2.0",
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/user-event": "^14.4.3",
@@ -93,7 +93,7 @@
     "karma-jasmine-html-reporter": "2.0.0",
     "lint-staged": "^12.1.6",
     "ng-mocks": "^14.11.0",
-    "ng-packagr": "17.1.0",
+    "ng-packagr": "17.3.0",
     "nx": "17.2.8",
     "postcss": "^8.4.5",
     "postcss-import": "14.1.0",

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

@@ -9,11 +9,11 @@ import {
   SimpleChanges,
   Type,
 } from '@angular/core';
-import {ComponentFixture, DeferBlockState, TestBed, tick} from '@angular/core/testing';
-import {BrowserAnimationsModule, NoopAnimationsModule} from '@angular/platform-browser/animations';
-import {NavigationExtras, Router} from '@angular/router';
-import {RouterTestingModule} from '@angular/router/testing';
-import type {BoundFunctions, Queries} from '@testing-library/dom';
+import { ComponentFixture, DeferBlockBehavior, DeferBlockState, TestBed, tick } from '@angular/core/testing';
+import { BrowserAnimationsModule, NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { NavigationExtras, Router } from '@angular/router';
+import { RouterTestingModule } from '@angular/router/testing';
+import type { BoundFunctions, Queries } from '@testing-library/dom';
 import {
   configure as dtlConfigure,
   getQueriesForElement as dtlGetQueriesForElement,
@@ -25,8 +25,8 @@ import {
   waitForOptions as dtlWaitForOptions,
   within as dtlWithin,
 } from '@testing-library/dom';
-import {ComponentOverride, RenderComponentOptions, RenderResult, RenderTemplateOptions} from './models';
-import {getConfig} from './config';
+import { ComponentOverride, RenderComponentOptions, RenderResult, RenderTemplateOptions } from './models';
+import { getConfig } from './config';
 
 const mountedFixtures = new Set<ComponentFixture<any>>();
 const safeInject = TestBed.inject || TestBed.get;
@@ -95,7 +95,7 @@ export async function render<SutType, WrapperType = SutType>(
     }),
     providers: [...providers],
     schemas: [...schemas],
-    deferBlockBehavior: deferBlockBehavior as any
+    deferBlockBehavior: deferBlockBehavior ?? DeferBlockBehavior.Manual,
   });
   overrideComponentImports(sut, componentImports);
   overrideChildComponentProviders(childComponentOverrides);

projects/testing-library/tests/defer-blocks.spec.ts

@@ -1,7 +1,6 @@
-import {Component} from '@angular/core';
-import {DeferBlockBehavior, DeferBlockState} from '@angular/core/testing';
-import {render, screen} from '../src/public_api';
-import {fireEvent} from "@testing-library/dom";
+import { Component } from '@angular/core';
+import { DeferBlockBehavior, DeferBlockState } from '@angular/core/testing';
+import { render, screen, fireEvent } from '../src/public_api';
 
 test('renders a defer block in different states using the official API', async () => {
   const { fixture } = await render(FixtureComponent);
@@ -30,21 +29,21 @@ test('renders a defer block in different states using ATL', async () => {
 });
 
 test('renders a defer block in different states using DeferBlockBehavior.Playthrough', async () => {
-   await render(FixtureComponent, {
-    deferBlockBehavior: DeferBlockBehavior.Playthrough
+  await render(FixtureComponent, {
+    deferBlockBehavior: DeferBlockBehavior.Playthrough,
   });
 
   expect(await screen.findByText(/loading/i)).toBeInTheDocument();
   expect(await screen.findByText(/Defer block content/i)).toBeInTheDocument();
 });
 
 test('renders a defer block in different states using DeferBlockBehavior.Playthrough event', async () => {
-  await render(FixtureComponentWithEvents, {
-    deferBlockBehavior: DeferBlockBehavior.Playthrough
+  await render(FixtureComponentWithEventsComponent, {
+    deferBlockBehavior: DeferBlockBehavior.Playthrough,
   });
 
-  const button = screen.getByRole('button', {name: /click/i});
-  fireEvent.click(button)
+  const button = screen.getByRole('button', { name: /click/i });
+  fireEvent.click(button);
 
   expect(screen.getByText(/empty defer block/i)).toBeInTheDocument();
 });
@@ -91,9 +90,8 @@ class FixtureComponent {}
   template: `
     <button #trigger>Click</button>
     @defer(on interaction(trigger)) {
-        <div>empty defer block</div>
+    <div>empty defer block</div>
     }
   `,
 })
-class FixtureComponentWithEvents {}
-
+class FixtureComponentWithEventsComponent {}