angular v15.1.0-next.0 Release Notes

Release Date: 2022-11-22 // 2 months ago
  • πŸ—„ Deprecations

    router

    • router writable properties

    The following strategies are meant to be configured by registering the application strategy in DI via the providers in the root NgModule or bootstrapApplication:

    • routeReuseStrategy
    • titleStrategy
    • urlHandlingStrategy

    The following options are meant to be configured using the options available in RouterModule.forRoot or provideRouter.

    • onSameUrlNavigation
    • paramsInheritanceStrategy
    • urlUpdateStrategy
    • canceledNavigationResolution

    The following options are available in RouterModule.forRoot but not available in provideRouter:

    • malformedUriErrorHandler - This was found to not be used anywhere internally.
    • errorHandler - Developers can instead subscribe to Router.events and filter for NavigationError. ### common | Commit | Type | Description | | -- | -- | -- | 🀑 | b0a62bea47 | fix | Fix MockPlatformLocation events and missing onPopState implementation (#48113) | ### core | Commit | Type | Description | | -- | -- | -- | βœ… | 6acae1477a | feat | Add TestBed.runInInjectionContext to help test functions which use inject (#47955) | ### forms | Commit | Type | Description | | -- | -- | -- | | 0329c13e95 | fix | don't mutate validators array (#47830) | | d321880440 | fix | FormBuilder.group return right type with shorthand parameters. (#48084) | ### language-service | Commit | Type | Description | | -- | -- | -- | | 5f0b53c735 | feat | Allow auto-imports to suggest multiple possible imports. (#47787) | | fd2eea5961 | fix | correctly handle host directive inputs/outputs (#48147) | | ce8160ecb2 | fix | Prevent crashes on unemitable references (#47938) | ⚑️ | 764fa3d9c3 | fix | update packages/language-service/build.sh script to work with vscode-ng-language-service's new Bazel build (#48120) | ### router | Commit | Type | Description | | -- | -- | -- | πŸ”§ | 0a8b8a66cd | docs | Deprecate public members of Router that are meant to be configured elsewhere (#48006) | | 73f03ad2d2 | feat | Add new NavigationSkipped event for ignored navigations (#48024) | | b51929a394 | fix | correct type of nextState parameter in canDeactivate (#48038) | | 1df0ed7d6e | fix | Ensure renavigating in component init works with enabledBlocking (#48063) | βͺ | 1976e37475 | fix | restore 'history.state' on popstate even if navigationId missing (#48033) | ## Special Thanks Alan Agius, Andrew Kushnir, Andrew Scott, Bjarki, Bob Watson, Brooke, Derek Cormier, Dylan Hunn, George Kalpakas, Greg Magolan, Ikko Ashimine, Ivan Rodriguez, Jessica Janiuk, JiaLiPassion, Joe Roxbury, Joey Perrott, Kristiyan Kostadinov, Matthieu Riegler, Mikhail Savchuk, Nebojsa Cvetkovic, Pawel Kozlowski, Volodymyr, Wooshaah and mgechev

    <!-- CHANGELOG SPLIT MARKER -->


Previous changes from v15.0.0

  • Blog post "Angular v15 is now available".

    πŸ’₯ Breaking Changes

    compiler

    • πŸ›  Keyframes names are now prefixed with the component's "scope name". For example, the following keyframes rule in a component definition, whose "scope name" is host-my-cmp:

      @keyframes foo { ... }

    will become:

     @keyframes host-my-cmp_foo { ... }
    

    Any TypeScript/JavaScript code which relied on the names of keyframes rules will no longer match.

    The recommended solutions in this case are to either:

    • change the component's view encapsulation to the None or ShadowDom
    • define keyframes rules in global stylesheets (e.g styles.css)
    • define keyframes rules programmatically in code. ### compiler-cli
      • Invalid constructors for DI may now report compilation errors

    When a class inherits its constructor from a base class, the compiler may now report an error when that constructor cannot be used for DI purposes. This may either be because the base class is missing an Angular decorator such as @Injectable() or @Directive(), or because the constructor contains parameters which do not have an associated token (such as primitive types like string). These situations used to behave unexpectedly at runtime, where the class may be constructed without any of its constructor parameters, so this is now reported as an error during compilation.

    Any new errors that may be reported because of this change can be resolved either by decorating the base class from which the constructor is inherited, or by adding an explicit constructor to the class for which the error is reported.

    • 🚚 Angular compiler option enableIvy has been removed as Ivy is the only rendering engine. ### core
    • πŸ‘ Angular no longer supports Node.js versions 14.[15-19].x and 16.[10-12].x. Current supported versions of Node.js are 14.20.x, 16.13.x and 18.10.x.
    • πŸ‘ TypeScript versions older than 4.8 are no longer supported.
    • ⚑️ Existing iframe usages may have security-sensitive attributes applied as an attribute or property binding in a template or via host bindings in a directive. Such usages would require an update to ensure compliance with the new stricter rules around iframe bindings.
    • ⚑️ Existing iframe usages may have src or srcdoc preceding other attributes. Such usages may need to be updated to ensure compliance with the new stricter rules around iframe bindings. ### forms
    • setDisabledState will always be called when a ControlValueAccessor is attached. You can opt-out with FormsModule.withConfig or ReactiveFormsModule.withConfig. ### localize
    • 🌐 - canParse method has been removed from all translation parsers in @angular/localize/tools. analyze should be used instead.
      • the hint parameter in theparse methods is now mandatory. ### router
    • Previously, the RouterOutlet would immediately instantiate the component being activated during navigation. Now the component is not instantiated until the change detection runs. This could affect tests which do not trigger change detection after a router navigation. In rarer cases, this can affect production code that relies on the exact timing of component availability.
    • The title property is now required on ActivatedRouteSnapshot
    • πŸ”§ relativeLinkResolution is no longer configurable in the Router. This option was used as a means to opt out of a bug fix. ## πŸ—„ Deprecations ### common
    • The DATE_PIPE_DEFAULT_TIMEZONE token is now deprecated in favor of the DATE_PIPE_DEFAULT_OPTIONS token, which accepts an object as a value and the timezone can be defined as a field (called timezone) on that object. ### core
    • - The ability to pass an NgModule to the providedIn option for @Injectable and InjectionToken is now deprecated.

    providedIn: NgModule was intended to be a tree-shakable alternative to NgModule providers. It does not have wide usage, and in most cases is used incorrectly, in circumstances where providedIn: 'root' should be preferred. If providers should truly be scoped to a specific NgModule, use NgModule.providers instead.

    • The ability to set providedIn: 'any' for an @Injectable or InjectionToken is now deprecated.

    providedIn: 'any' is an option with confusing semantics and is almost never used apart from a handful of esoteric cases internal to the framework.

    • πŸ—„ The bit field signature of Injector.get() has been deprecated, in favor of the new options object.
    • βœ… The bit field signature of TestBed.inject() has been deprecated, in favor of the new options object. ### router
    • πŸ—„ The RouterLinkWithHref directive is deprecated, use the RouterLink directive instead. The RouterLink contains the code from the RouterLinkWithHref to handle elements with href attributes. ### common | Commit | Type | Description | | -- | -- | -- | 🀑 | c0c7efaf7c | feat | add provideLocationMocks() function to provide Location mocks (#47674) | | 75e6297f09 | feat | add preload tag on server for priority img (#47343) | ⚑️ | 4fde292bb5 | feat | Add automatic srcset generation to ngOptimizedImage (#47547) | ⚑️ | 9483343ebf | feat | Add fill mode to NgOptimizedImage (#47738) | πŸ”§ | bdb5371033 | feat | add injection token for default DatePipe configuration (#47157) | ⚑️ | 449d29b701 | fix | Add fetchpriority to ngOptimizedImage preloads (#48010) | | 4f52d4e474 | fix | don't generate srcset if noopImageLoader is used (#47804) | | 3a18398d83 | fix | Don't warn about image distortion is fill mode is enabled (#47824) | | edea15f2c6 | fix | export the IMAGE_CONFIG token (#48051) | | 8abf1c844c | fix | fix formatting on oversized image error (#47188) | ⚑️ | ca7bf65933 | fix | rename rawSrc -> ngSrc in NgOptimizedImage directive (#47362) | πŸ‘ | b3879dbf14 | fix | support density descriptors with 2+ decimals (#47197) | ⚑️ | fa4798095e | fix | update size error to mention 'fill' mode (#47797) | πŸ‘ | 23f210c0ab | fix | warn if using supported CDN but not built-in loader (#47330) | ⚑️ | 945432e3fa | fix | Warn on fill ngOptimizedImage without height (#48036) | ### compiler | Commit | Type | Description | | -- | -- | -- | | 051f75648d | fix | scope css keyframes in emulated view encapsulation (#42608) | ⚑️ | 39b72e208b | fix | update element schema (#47552) | ⚑️ | 48b354a83e | fix | update element schema (#47552) | ### compiler-cli | Commit | Type | Description | | -- | -- | -- | | bc54687c7b | fix | exclude abstract classes from strictInjectionParameters requirement (#44615) | | 309b2cde51 | fix | implement more host directive validations as diagnostics (#47768) | πŸ‘ | 2e1dddec45 | fix | support hasInvalidatedResolutions. (#47585) | | 19ad4987f9 | fix | use @ts-ignore. (#47636) | | 8fcadaad48 | perf | cache source file for reporting type-checking diagnostics (#47471) | πŸ”¨ | 16f96eeabf | refactor | remove enableIvy options (#47346) | ### core | Commit | Type | Description | | -- | -- | -- | πŸ—„ | e3cef4a784 | docs | deprecate providedIn: NgModule and providedIn: 'any' (#47616) | πŸ‘ | 1b9fd46d14 | feat | add support for Node.js version 18 (#47730) | πŸ‘ | ed11a13c3c | feat | drop support for TypeScript 4.6 and 4.7 (#47690) | | db28badfe6 | feat | enable the new directive composition API (#47642) | | 7de1469be6 | feat | introduce EnvironmentProviders wrapper type (#47669) | πŸ‘ | 841c8e5138 | feat | support object-based DI flags in Injector.get() (#46761) | βœ… | 120555a626 | feat | support object-based DI flags in TestBed.inject() (#46761) | | 96c0e42e61 | fix | allow readonly arrays for standalone imports (#47851) | | 28f289b825 | fix | hardening attribute and property binding rules for elements (#47964) | | d4b3c0b47c | fix | hardening rules related to the attribute order on iframe elements (#47935) | ⚑️ | 85330f3fd9 | fix | update isDevMode to rely on ngDevMode (#47475) | ### forms | Commit | Type | Description | | -- | -- | -- | | a8569e3802 | feat | export forms utility functions: isFormArray, isFormGroup… (#47718) | | 96b7fe93af | fix | call setDisabledState on ControlValueAcessor when control is enabled (#47576) | | a99d9d67f3 | fix | don't mutate validators array (#47830) | | 2625dc1312 | fix | Improve a very commonly viewed error message by adding a guide. (#47969) | | ae29f98c20 | fix | Runtime error pages must begin with leading zero (#47991) | ### http | Commit | Type | Description | | -- | -- | -- | | 3ba99e286a | feat | allow for child HttpClients to request via parents (#47502) | βœ… | 84d0d33c35 | feat | introduce provideHttpClientTesting provider function (#47502) | | 62c7a7a16e | feat | introduce functional interceptors (#47502) | | e47b129070 | feat | introduce the provideHttpClient() API (#47502) | πŸ‘ | ea16a98dfe | fix | better handle unexpected undefined XSRF tokens (#47683) | | e7b48da713 | fix | rename withLegacyInterceptors to withInterceptorsFromDi (#47901) | ### language-service | Commit | Type | Description | | -- | -- | -- | | bebef5fb43 | feat | Quick fix to import a component when its selector is used (#47088) | πŸ‘ | e7ee53c541 | feat | support to fix invalid banana in box (#47393) | ### localize | Commit | Type | Description | | -- | -- | -- | | 400a6b5e37 | fix | add polyfill in polyfills array instead of polyfills.ts (#47569) | ⚑️ | b6fd814542 | fix | update ng add schematic to support Angular CLI version 15 (#47763) | πŸ”¨ | d36fd3d9e4 | refactor | remove deprecated canParse method from TranslationParsers (#47275) | ### platform-server | Commit | Type | Description | | -- | -- | -- | | 2908eba59c | fix | align server renderer interface with base renderer (#47868) | ### router | Commit | Type | Description | | -- | -- | -- | 🚚 | 7bee28d037 | feat | add a migration to remove relativeLinkResolution usages (#47604) | | 5163e3d876 | feat | Add UrlTree constructor to public API (#47186) | 0️⃣ | da58801f95 | feat | auto-unwrap default exports when lazy loading (#47586) | | c3f857975d | feat | make RouterOutlet name an Input so it can be set dynamically (#46569) | πŸ”€ | f73ef21442 | feat | merge RouterLinkWithHref into RouterLink (#47630) | | 16c8f55663 | feat | migrate RouterLinkWithHref references to RouterLink (#47599) | | 07017a7bd3 | feat | prevent provideRouter() from usage in @Component (#47669) | | 79e9e8ab77 | fix | Delay router scroll event until navigated components have rendered (#47563) | | 6a88bad019 | fix | Ensure ActivatedRouteSnapshot#title has correct value (#47481) | 🚚 | 7b89d95c0e | fix | Remove deprecated relativeLinkResolution (#47623) | ## Special Thanks Alan Agius, AleksanderBodurri, Alex Castle, Alex Rickabaugh, Andrew Kushnir, Andrew Scott, Charles Lyding, Dylan Hunn, Ferdinand Malcher, George Kalpakas, Jeremy Elbourn, Jessica Janiuk, JiaLiPassion, Joey Perrott, JoostK, Kara Erickson, Kristiyan Kostadinov, Martin Probst, Matthias Weiß, Matthieu Riegler, Paul Gschwendtner, Pawel Kozlowski, Sabareesh Kappagantu, WD Snoeijer, angular-robot[bot], arturovt, ced, dario-piotrowicz, ivanwonder and jaybell

    <!-- CHANGELOG SPLIT MARKER -->