Angular: 16.0.0 Release

Release date:
May 3, 2023
Previous version:
16.0.0-rc.4 (released May 1, 2023)
Magnitude:
93 Diff Delta
Contributors:
7 total committers
Data confidence:
Commits:

Top Contributors in 16.0.0

JeanMeche
atscott
spirithntr
mgechev
AndrewKushnir
angular-robot
devversion

Directory Browser for 16.0.0

We haven't yet finished calculating and confirming the files and directories changed in this release. Please check back soon.

Release Notes Published

<a name="16.0.0"></a>

16.0.0 (2023-05-03)

| Commit | Description | | -- | -- | | refactor - 48aa96ea13 | remove Angular Compatibility Compiler (ngcc) (#49101) | | refactor - 2703fd6260 | remove deprecated EventManager method addGlobalEventListener (#49645) |

common

| Commit | Description | | -- | -- | | feat - 5dce2a5a3a | Provide MockPlatformLocation by default in BrowserTestingModule (#49137) | | fix - d47fef72cb | strict type checking for ngtemplateoutlet (#48374) | | refactor - c41a21658c | remove deprecated XhrFactory export from http entrypoint (#49251) |

compiler

| Commit | Description | | -- | -- | | feat - 1a6ca68154 | add support for compile-time required inputs (#49304) | | feat - 13dd614cd1 | add support for compile-time required inputs (#49453) | | feat - 8f539c11f4 | add support for compile-time required inputs (#49468) | | feat - 79cdfeb392 | drop support for TypeScript 4.8 (#49155) | | feat - 1407a9aeaf | support multiple configuration files in extends (#49125) | | fix - 9de1e9da8f | incorrectly matching directives on attribute bindings (#49713) | | fix - 6623810e4d | Produce diagnositc if directive used in host binding is not exported (#49527) |

compiler-cli

| Commit | Description | | -- | -- | | feat - 03d1d00ad9 | Add an extended diagnostic for nSkipHydration (#49512) | | fix - ed817e32fe | Catch FatalDiagnosticError during template type checking (#49527) | | perf - 49fe974501 | optimize NgModule emit for standalone components (#49837) |

core

| Commit | Description | | -- | -- | | feat - 89d291c367 | add assertInInjectionContext (#49529) | | feat - 4e9531f777 | add mergeApplicationConfig method (#49253) | | feat - d7d6514add | Add ability to configure NgZone in bootstrapApplication (#49557) | | feat - bc5ddabdcb | add Angular Signals to the public API (#49150) | | feat - 17e9862653 | add API to provide CSP nonce for inline stylesheets (#49444) | | feat - 605c536420 | add migration to remove moduleId references (#49496) | | feat - 99d874fe3b | add support for TypeScript 5.0 (#49126) | | feat - d1617c449d | allow removal of previously registered DestroyRef callbacks (#49493) | | feat - b2327f4df1 | Allow typeguards on QueryList.filter (#48042) | | feat - 061f3d1086 | Drop public factories property for IterableDiffers : Breaking change (#49598) | | feat - fdf61974d1 | drop support for zone.js versions <=0.12.0 (#49331) | | feat - 9c5fd50de4 | effects can optionally return a cleanup function (#49625) | | feat - c024574f46 | expose makeStateKey, StateKey and TransferState (#49563) | | feat - a5f1737d1c | expose onDestroy on ApplicationRef (#49677) | | feat - e883198460 | implement takeUntilDestroyed in rxjs-interop (#49154) | | feat - 0814f20594 | introduce runInInjectionContext and deprecate prior version (#49396) | | feat - 0f5c8003cc | introduce concept of DestroyRef (#49158) | | feat - 9b65b84cb9 | Mark components for check if they read a signal (#49153) | | feat - 8997bdc03b | prototype implementation of @angular/core/rxjs-interop (#49154) | | feat - 585e34bf6c | remove entryComponents (#49484) | | feat - aad05ebeb4 | support usage of non-experimental decorators with TypeScript 5.0 (#49492) | | fix - 6d7be42da7 | add newline to hydration mismatch error (#49965) | | fix - f8e25864e8 | allow async functions in effects (#49783) | | fix - 84216dabfc | catch errors from source signals outside of .next (#49769) | | fix - be23b7ce65 | ComponentRef.setInput only sets input when not equal to previous (#49607) | | fix - 316c91b1a4 | deprecate moduleId @Component property (#49496) | | fix - fd9dcd36cd | Ensure effects can be created when Zone is not defined (#49890) | | fix - 9180f98f0e | ensure takeUntilDestroyed unregisters onDestroy listener on unsubscribe (#49901) | | fix - 4721c48a24 | error if document body is null (#49818) | | fix - 2650f1afc1 | execute input setters in non-reactive context (#49906) | | fix - f8b95b9da6 | execute query setters in non-reactive context (#49906) | | fix - ef91a2e0fe | execute template creation in non-reactive context (#49883) | | fix - 87549af73c | Fix capitalization of toObservableOptions (#49832) | | fix - 0e5f9ba6f4 | generate consistent component IDs (#48253) | | fix - fedc75624c | include inner ViewContainerRef anchor nodes into ViewRef.rootNodes output (#49867) | | fix - df1dfc4c17 | make sure that lifecycle hooks are not tracked (#49701) | | fix - c34d7e0822 | onDestroy should be registered only on valid DestroyRef (#49804) | | fix - 2f2ef14f9e | resolve InitialRenderPendingTasks promise on complete (#49784) | | fix - c7d8d3ee37 | toObservable should allow writes to signals in the effect (#49769) | | fix - b4531f1d82 | typing of TestBed Common token. (#49997) | | fix - a4e749ffca | When using setInput, mark view dirty in same was as markForCheck (#49711) | | perf - 9b9c818f99 | change RendererType2.styles to accept a only a flat array (#49072) | | refactor - 82d6fbb109 | generate a static application ID (#49422) | | refactor - 3b863ddc1e | Remove ReflectiveInjector symbol (#48103) | | refactor - f594725951 | remove Node.js v14 support (#49255) |

forms

| Commit | Description | | -- | -- | | feat - 07a1aa3004 | Improve typings form (async)Validators (#48679) |

http

| Commit | Description | | -- | -- | | feat - aff1512950 | allow HttpClient to cache requests (#49509) | | fix - 15c91a53ae | delay accessing pendingTasks.whenAllTasksComplete (#49784) | | fix - 9f0c6d1ed1 | ensure new cache state is returned on each request (#49749) | | fix - 45a6ac09fd | force macro task creation during HTTP request (#49546) | | fix - 2a580b6f0b | HTTP cache was being disabled prematurely (#49826) | | fix - 2eb9b8b402 | wait for all XHR requests to finish before stabilizing application (#49776) |

migrations

| Commit | Description | | -- | -- | | feat - 5e5dac278d | Migration to remove Router guard and resolver interfaces (#49337) |

platform-browser

| Commit | Description | | -- | -- | | feat - 761e02d912 | add a public API function to enable non-destructive hydration (#49666) | | feat - 630af63fae | deprecate withServerTransition call (#49422) | | feat - 81e7d15ef6 | enable HTTP request caching when using provideClientHydration (#49699) | | fix - 74c925c19c | export deprecated TransferState as type (#50015) | | fix - 2312eb53ef | KeyEventsPlugin should keep the same behavior (#49330) | | fix - c934a8e72b | only add ng-app-id to style on server side (#49465) | | fix - 9165ff2517 | reuse server generated component styles (#48253) | | fix - e8e36811d5 | set nonce attribute in a platform compatible way (#49624) | | refactor - 3aa85a8087 | move ApplicationConfig to core (#49253) | | refactor - 9bd9a11f4e | remove deprecated BrowserTransferStateModule symbol (#49718) |

platform-server

| Commit | Description | | -- | -- | | feat - b5278cc115 | renderApplication now accepts a bootstrapping method (#49248) | | feat - 056d68002f | add provideServerSupport function to provide server capabilities to an application (#49380) | | feat - 7870fb07fe | rename provideServerSupport to provideServerRendering (#49678) | | fix - a08a8ff108 | bundle @angular/domino in via esbuild (#49229) | | fix - 5ea624f313 | remove dependency on @angular/platform-browser-dynamic (#50064) | | refactor - e99460865e | deprecate useAbsoluteUrl and baseUrl (#49546) | | refactor - 41f27ad086 | remove renderApplication overload that accepts a component (#49463) | | refactor - 17abe6dc96 | remove deprecated renderModuleFactory (#49247) |

router

| Commit | Description | | -- | -- | | feat - ea32c3289a | Expose information about the last successful Navigation (#49235) | | feat - 455c728525 | helper functions to convert class guards to functional (#48709) | | feat - f982a3f965 | Opt-in for binding Router information to component inputs (#49633) | | fix - 1f055b90b6 | Ensure anchor scrolling happens on ignored same URL navigations (#48025) | | fix - 6193a3d406 | fix = not parsed in router segment name (#47332) | | fix - c0b1b7becf | Remove deprecated ComponentFactoryResolver from APIs (#49239) | | fix - 1e32709e0e | remove RouterEvent from Event union type (#46061) | | fix - 3c7e637374 | Route matching should only happen once when navigating (#49163) | | fix - 1600687fe5 | Route matching should only happen once when navigating (#49163) | | fix - 31f210bf2c | Router.createUrlTree should work with any ActivatedRoute (#48508) |

service-worker

| Commit | Description | | -- | -- | | feat - 5e7fc259ea | add function to provide service worker (#48247) |

Breaking Changes

  • Angular Compatibility Compiler (ngcc) has been removed and as a result Angular View Engine libraries will no longer work
  • Deprecated EventManager method addGlobalEventListener has been removed as it is not used by Ivy. ### bazel
  • Several changes to the Angular Package Format (APF)
    • Removal of FESM2015
    • Replacing ES2020 with ES2022
    • Replacing FESM2020 with FESM2022
  • Several changes to the Angular Package Format (APF)
    • Removal of FESM2015
    • Replacing ES2020 with ES2022
    • Replacing FESM2020 with FESM2022 ### common
  • MockPlatformLocation is now provided by default in tests. Existing tests may have behaviors which rely on BrowserPlatformLocation instead. For example, direct access to the window.history in either the test or the component rather than going through the Angular APIs (Location.getState()). The quickest fix is to update the providers in the test suite to override the provider again TestBed.configureTestingModule({providers: [{provide: PlatformLocation, useClass: BrowserPlatformLocation}]}). The ideal fix would be to update the code to instead be compatible with MockPlatformLocation instead.
  • If the 'ngTemplateOutletContext' is different from the context, it will result in a compile-time error.

Before the change, the following template was compiling:

  interface MyContext {
    $implicit: string;
  }

  @Component({
    standalone: true,
    imports: [NgTemplateOutlet],
    selector: 'person',
    template: `
      <ng-container
        *ngTemplateOutlet="
          myTemplateRef;
          context: { $implicit: 'test', xxx: 'xxx' }
        "></ng-container>
    `,
  })
  export class PersonComponent {
    myTemplateRef!: TemplateRef<MyContext>;
  }

However, it does not compile now because the 'xxx' property does not exist in 'MyContext', resulting in the error: 'Type '{ $implicit: string; xxx: string; }' is not assignable to type 'MyContext'.'

The solution is either: - add the 'xxx' property to 'MyContext' with the correct type or - add '$any(...)' inside the template to make the error disappear. However, adding '$any(...)' does not correct the error but only preserves the previous behavior of the code. - Deprecated XhrFactory export from @angular/common/http has been removed. Use XhrFactory from @angular/common instead.

compiler

  • * TypeScript 4.8 is no longer supported. ### core
  • QueryList.filter now supports type guard functions, which will result in type narrowing. Previously if you used type guard functions, it resulted in no changes to the return type. Now the type would be narrowed, which might require updates to the application code that relied on the old behavior.
  • zone.js versions 0.11.x and 0.12.x are not longer supported.
  • * entryComponents has been deleted from the @NgModule and @Component public APIs. Any usages can be removed since they weren't doing anyting.
    • ANALYZE_FOR_ENTRY_COMPONENTS injection token has been deleted. Any references can be removed.
  • ComponentRef.setInput will only set the input on the component if it is different from the previous value (based on Object.is equality). If code relies on the input always being set, it should be updated to copy objects or wrap primitives in order to ensure the input value differs from the previous call to setInput.
  • RendererType2.styles no longer accepts a nested arrays.
  • The APP_ID token value is no longer randomly generated. If you are bootstrapping multiple application on the same page you will need to set to provide the APP_ID yourself.
  bootstrapApplication(ComponentA, {
    providers: [
     { provide: APP_ID, useValue: 'app-a' },
     // ... other providers ...
    ]
  });
  • The ReflectiveInjector and related symbols were removed. Please update the code to avoid references to the ReflectiveInjector symbol. Use Injector.create as a replacement to create an injector instead.
  • Node.js v14 support has been removed

Node.js v14 is planned to be End-of-Life on 2023-04-30. Angular will stop supporting Node.js v14 in Angular v16. Angular v16 will continue to officially support Node.js versions v16 and v18.

platform-browser

  • The deprecated BrowserTransferStateModule was removed, since it's no longer needed. The TransferState class can be injected without providing the module. The BrowserTransferStateModule was empty starting from v14 and you can just remove the reference to that module from your applications. ### platform-server
  • Users that are using SSR with JIT mode will now need to add import to @angular/compiler before bootstrapping the application.

NOTE: this does not effect users using the Angular CLI. - renderApplication method no longer accepts a root component as first argument. Instead, provide a bootstrapping function that returns a Promise<ApplicationRef>.

Before ts const output: string = await renderApplication(RootComponent, options);

Now ts const bootstrap = () => bootstrapApplication(RootComponent, appConfig); const output: string = await renderApplication(bootstrap, options); - renderModuleFactory has been removed. Use renderModule instead.

router

  • The Scroll event's routerEvent property may also be a NavigationSkipped event. Previously, it was only a NavigationEnd event.
  • ComponentFactoryResolver has been removed from Router APIs. Component factories are not required to create an instance of a component dynamically. Passing a factory resolver via resolver argument is no longer needed and code can instead use ViewContainerRef.createComponent without the factory resolver.
  • The RouterEvent type is no longer present in the Event union type representing all router event types. If you have code using something like filter((e: Event): e is RouterEvent => e instanceof RouterEvent), you'll need to update it to filter((e: Event|RouterEvent): e is RouterEvent => e instanceof RouterEvent).
  • Tests which mock ActivatedRoute instances may need to be adjusted because Router.createUrlTree now does the right thing in more scenarios. This means that tests with invalid/incomplete ActivatedRoute mocks may behave differently than before. Additionally, tests may now navigate to a real URL where before they would navigate to the root. Ensure that tests provide expected routes to match. There is rarely production impact, but it has been found that relative navigations when using an ActivatedRoute that does not appear in the current router state were effectively ignored in the past. By creating the correct URLs, this sometimes resulted in different navigation behavior in the application. Most often, this happens when attempting to create a navigation that only updates query params using an empty command array, for example router.navigate([], {relativeTo: route, queryParams: newQueryParams}). In this case, the relativeTo property should be removed. ## Deprecations ### core
  • makeStateKey, StateKey and TransferState exports have been moved from @angular/platform-browser to @angular/core. Please update the imports.
  - import {makeStateKey, StateKey, TransferState} from '@angular/platform-browser';
  + import {makeStateKey, StateKey, TransferState} from '@angular/core';
  • EnvironmentInjector.runInContext is now deprecated, with runInInjectionContext functioning as a direct replacement:
  // Previous method version (deprecated):
  envInjector.runInContext(fn);
  // New standalone function:
  runInInjectionContext(envInjector, fn);
  • The @Directive/@Component moduleId property is now deprecated. It did not have any effect for multiple major versions and will be removed in v17. ### platform-browser
  • BrowserModule.withServerTransition has been deprecated. APP_ID should be used instead to set the application ID. NB: Unless, you render multiple Angular applications on the same page, setting an application ID is not necessary.

Before: ts imports: [ BrowserModule.withServerTransition({ appId: 'serverApp' }), ... ]

After: ts imports: [ BrowserModule, { provide: APP_ID, useValue: 'serverApp' }, ... ], - ApplicationConfig has moved, please import ApplicationConfig from @angular/core instead.

platform-server

  • PlatformConfig.baseUrl and PlatformConfig.useAbsoluteUrl platform-server config options are deprecated as these were not used.