Angular: 14.0.0 Release

Release date:
June 2, 2022
Previous version:
14.0.0-rc.3 (released May 31, 2022)
Magnitude:
160 Diff Delta
Contributors:
4 total committers
Data confidence:
Commits:

Top Contributors in 14.0.0

alxhub
AndrewKushnir
atscott
george-looshch-0e53

Directory Browser for 14.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="14.0.0"></a>

14.0.0 (2022-06-02)

Breaking Changes

animations

  • The AnimationDriver.getParentElement method has become required, so any implementors of this interface are now required to provide an implementation for this method. This breakage is unlikely to affect application developers, as AnimationDriver is not expected to be implemented in user code. ### common
  • Adds new required class member that any implementors of the LocationStrategy will need to satisfy. Location does not depend on PlatformLocation anymore. ### 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. - 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.

core

  • Support for Node.js v12 has been removed as it will become EOL on 2022-04-30. Please use Node.js v14.15 or later.
  • TypeScript versions older than 4.6 are no longer supported.
  • Forms [email] input coercion

Forms [email] input value will be considered as true if it is defined with any value rather than false and 'false'. - Since Ivy, TestBed doesn't use AOT summaries. The aotSummaries fields in TestBed APIs were present, but unused. The fields were deprecated in previous major version and in v14 those fields are removed. The aotSummaries fields were completely unused, so you can just drop them from the TestBed APIs usage.

forms

  • Forms classes accept a generic.

Forms model classes now accept a generic type parameter. Untyped versions of these classes are available to opt-out of the new, stricter behavior. - objects with a length key set to zero will no longer validate as empty.

This is technically a breaking change, since objects with a key length and value 0 will no longer validate as empty. This is a very minor change, and any reliance on this behavior is probably a bug anyway.

http

  • Queries including + will now actually query for + instead of space. Most workarounds involving custom codecs will be unaffected. Possible server-side workarounds will need to be undone.
  • JSONP will throw an error when headers are set on a reques

JSONP does not support headers being set on requests. Before when a request was sent to a JSONP backend that had headers set the headers were ignored. The JSONP backend will now throw an error if it receives a request that has any headers set. Any uses of JSONP on requests with headers set will need to remove the headers to avoid the error.

platform-browser

  • This change may cause a breaking change in unit tests that are implicitly depending on a specific number and sequence of change detections in order for their assertions to pass.
  • This may break invalid calls to TransferState methods.

This tightens parameter types of TransferState usage, and is a minor breaking change which may reveal existing problematic calls.

router

  • The type of Route.pathMatch is now more strict. Places that use pathMatch will likely need to be updated to have an explicit Route/Routes type so that TypeScript does not infer the type as string.
  • When returning a Promise from the LoadChildrenCallback, the possible type is now restricted to Type<any>|NgModuleFactory<any> rather than any.
  • initialNavigation: 'enabled' was deprecated in v11 and is replaced by initialNavigation: 'enabledBlocking'.
  • The type of component on ActivatedRoute and ActivatedRouteSnapshot includes string. In reality, this is not the case. The component cannot be anything other than a component class.
  • * The type of initialUrl is set to string|UrlTree but in reality, the Router only sets it to a value that will always be UrlTree
    • initialUrl is documented as "The target URL passed into the Router#navigateByUrl() call before navigation" but the value actually gets set to something completely different. It's set to the current internal UrlTree of the Router at the time navigation occurs.

With this change, there is no exact replacement for the old value of initialUrl because it was enver intended to be exposed. Router.url is likely the best replacement for this. In more specific use-cases, tracking the finalUrl between successful navigations can also be used as a replacement. - Lazy loaded configs are now also validated once loaded like the initial set of routes are. Lazy loaded modules which have invalid Route configs will now error. Note that this is only done in dev mode so there is no production impact of this change. - When a guard returns a UrlTree, the router would previously schedule the redirect navigation within a setTimeout. This timeout is now removed, which can result in test failures due to incorrectly written tests. Tests which perform navigations should ensure that all timeouts are flushed before making assertions. Tests should ensure they are capable of handling all redirects from the original navigation. - Previously, resolvers were waiting to be completed before proceeding with the navigation and the Router would take the last value emitted from the resolver. The router now takes only the first emitted value by the resolvers and then proceeds with navigation. This is now consistent with Observables returned by other guards: only the first value is used.

zone.js

  • in TaskTrackingZoneSpec track a periodic task until it is cancelled

The breaking change is scoped only to the plugin zone.js/plugins/task-tracking. If you used TaskTrackingZoneSpec and checked the pending macroTasks e.g. using (this.ngZone as any)._inner ._parent._properties.TaskTrackingZone.getTasksFor('macroTask'), then its behavior slightly changed for periodic macrotasks. For example, previously the setInterval macrotask was no longer tracked after its callback was executed for the first time. Now it's tracked until the task is explicitly cancelled, e.g with clearInterval(id).

fixes 45350

Deprecations

common

  • The ngModuleFactory input of the NgComponentOutlet directive is deprecated in favor of a newly added ngModule input. The ngModule input accepts references to the NgModule class directly, without the need to resolve module factory first. ### forms
  • The initialValueIsDefault option has been deprecated and replaced with the otherwise-identical nonNullable option, for the sake of naming consistency.
  • It is now deprecated to provide both AbstractControlOptions and an async validators argument to a FormControl. Previously, the async validators would just be silently dropped, resulting in a probably buggy forms. Now, the constructor call is deprecated, and Angular will print a warning in devmode. ### router
  • The resolver argument of the RouterOutletContract.activateWith function and the resolver field of the OutletContext class are deprecated. Passing component factory resolvers are no longer needed. The ComponentFactoryResolver-related symbols were deprecated in @angular/core package since v13. ### animations | Commit | Description | | -- | -- | | feat - a6fa37bc6e | make validateStyleProperty check dev-mode only (#45570) | | feat - 79d334b138 | provide warnings for non-animatable CSS properties (#45212) | | fix - f8dc660605 | allow animations with unsupported CSS properties (#44729) | | fix - 2a75754ee8 | apply default params when resolved value is null or undefined (#45339) | | fix - e46b379204 | implement missing transition delay (#44799) | | perf - 5c7c56bc85 | improve algorithm to balance animation namespaces (#45057) | | perf - 4c778cdb28 | made errors in the animations package tree shakeable (#45004) | | perf - 7a81481fb2 | Remove generic objects in favor of Maps (#44482) | | perf - 6642e3c8fd | remove no longer needed CssKeyframes classes (#44903) | | refactor - 59559fdbac | make AnimationDriver.getParentElement required (#45114) | ### bazel | Commit | Description | | -- | -- | | feat - 636909fba7 | allow for generated package.json files in ng_package (#45470) | | feat - 28e835b4bb | report error when dependency does not provide JS sources in ng_package (#45470) | | feat - 68597bb0ca | speed up dev-turnaround by bundling types only when packaging (#45405) | | fix - f8a1ea0c11 | do not error if files part of srcs are outside of package (#45622) | | fix - 4b2e98d55d | remove unnecessary file extractions from ng_package (#45470) | | fix - d48e0ccc01 | speed up d.ts bundling by configuring worker (#45900) | | perf - 21a04ef5be | use allowedInputs to avoid fs.stat (#46069) | ### common | Commit | Description | | -- | -- | | feat - 31d7c3bd71 | add getState method to LocationStrategy interface (#45648) | | feat - c89cf63059 | support NgModule as an input to the NgComponentOutlet (#44815) | | feat - 38c03a2035 | support years greater than 9999 (#43622) | | fix - bedb257afc | cleanup URL change listeners when the root view is removed (#44901) | | fix - 10691c626b | properly cast http param values to strings (#42643) | | perf - 05d50b849b | make NgLocalization token tree-shakable (#45118) | ### compiler | Commit | Description | | -- | -- | | fix - bb8d7091c6 | exclude empty styles from emitted metadata (#45459) | | fix - 4d6a1d6722 | scope css keyframes in emulated view encapsulation (#42608) | | fix - f03e313f24 | scope css keyframes in emulated view encapsulation (#42608) | ### compiler-cli | Commit | Description | | -- | -- | | feat - 9cf14ff03d | exclude abstract classes from strictInjectionParameters requirement (#44615) | | feat - 0072eb48ba | initial implementation of standalone components (#44812) | | feat - 2142ffd295 | propagate standalone flag to runtime (#44973) | | feat - 6f653e05f9 | standalone types imported into NgModule scopes (#44973) | | feat - 752ddbc165 | Support template binding to protected component members (#45823) | | fix - 3d13343975 | better error messages for NgModule structural issues (#44973) | | fix - 046dad1a8d | fix issue with incremental tracking of APIs for pipes (#45672) | | fix - 27b4af7240 | full side-effectful registration of NgModules with ids (#45024) | | fix - 32c625d027 | handle forwardRef in imports of standalone component (#45869) | | fix - 06050ac2b4 | handle inline type-check blocks in nullish coalescing extended check (#45454) | | fix - a524a50361 | handle standalone components with cycles (#46029) | | fix - 724e88e042 | preserve forwardRef for component scopes (#46139) | | fix - 9cfea3d522 | report invalid imports in standalone components during resolve phase (#45827) | | fix - c0778b4dfc | Support resolve animation name from the DTS (#45107) | | fix - f2e5234e07 | update unknown tag error for aot standalone components (#45919) | | fix - 35f20afcac | use existing imports for standalone dependencies (#46029) | | perf - 8155428ba6 | ignore the module.id anti-pattern for NgModule ids (#45024) | ### core | Commit | Description | | -- | -- | | feat - 174ce7dd13 | add ApplicationRef.destroy method (#45624) | | feat - 5771b18a98 | add the bootstrapApplication function (#45674) | | feat - 69018c9f42 | allow for injector to be specified when creating an embedded view (#45156) | | feat - 94c949a60a | allow for injector to be specified when creating an embedded view (#45156) | | feat - e702cafcf2 | allow to throw on unknown elements in tests (#45479) | | feat - 6662a97c61 | allow to throw on unknown elements in tests (#45479) | | feat - a6675925b0 | allow to throw on unknown properties in tests (#45853) | | feat - 6eaaefd22e | drop support for Node.js 12 (#45286) | | feat - c9d566ce4b | drop support for TypeScript 4.4 and 4.5 (#45394) | | feat - b568a5e708 | implement importProvidersFrom function (#45626) | | feat - d5a6cd1111 | implement EnvironmentInjector with adapter to NgModuleRef (#45626) | | feat - 5a10fc4f82 | implement standalone directives, components, and pipes (#45687) | | feat - e461f716d4 | move ANIMATION_MODULE_TYPE injection token into core (#44970) | | feat - 94bba76a4a | support TypeScript 4.6 (#45190) | | feat - 29039fcdbc | support TypeScript 4.7 (#45749) | | feat - 225e4f2dbe | triggerEventHandler accept optional eventObj (#45279) | | feat - 401dec46eb | update TestBed to recognize Standalone Components (#45809) | | fix - 35653ce337 | add more details to the MISSING_INJECTION_CONTEXT error (#46166) | | fix - d36fa111eb | avoid Closure Compiler error in restoreView (#45445) | | fix - 0bc77f4cab | better error message when unknown property is present (#46147) | | fix - f3eb7d9ecb | Ensure the StandaloneService is retained after closure minification (#45783) | | fix - 701405fa71 | handle AOT-compiled standalone components in TestBed correctly (#46052) | | fix - ddce357d1d | improve TestBed declarations standalone error message (#45999) | | fix - ba9f30c9a6 | include component name into unknown element/property error message (#46160) | | fix - 9fa6f5a552 | incorrectly inserting elements inside template element (#43429) | | fix - d5719c2e0f | input coercion (#42803) | | fix - be161bef79 | memory leak in event listeners inside embedded views (#43075) | | fix - fa755b2a54 | prevent BrowserModule providers from being loaded twice (#45826) | | fix - 3172b4cc99 | produce proper error message for unknown props on <ng-template>s (#46068) | | fix - 4f1a813596 | restore NgModule state correctly after TestBed overrides (#46049) | | fix - 3f7ecec59b | set correct context for inject() for component ctors (#45991) | | fix - 4e413d9240 | support nested arrays of providers in EnvironmentInjector (#45789) | | fix - fde4942cdf | throw if standalone components are present in @NgModule.bootstrap (#45825) | | fix - 560188bf12 | update unknown property error to account for standalone components in AOT (#46159) | | fix - df339d8abf | update unknown tag error for jit standalone components (#45920) | | fix - aafac7228f | verify standalone component imports in JiT (#45777) | | perf - e9317aee71 | allow checkNoChanges mode to be tree-shaken in production (#45913) | | perf - 071c8af8ba | avoid storing LView in ngContext (#45051) | | perf - a96c4827c4 | make Compiler, ApplicationRef and ApplicationInitStatus tree-shakable (#45102) | | perf - 45d98e7ca5 | make IterableDiffers and KeyValueDiffers tree-shakable (#45094) | | perf - 1e60fe0a3e | make LOCALE_ID and other tokens from ApplicationModule tree-shakable (#45102) | | perf - 88f1168506 | only track LViews that are referenced in ngContext (#45172) | | refactor - 9add714b13 | remove deprecated aotSummaries fields in TestBed config (#45487) | ### devtools tabs | Commit | Description | | -- | -- | | fix - 6c284ef32e | stop scroll occuring at tabs level | ### forms | Commit | Description | | -- | -- | | feat - 2dbdebc646 | Add FormBuilder.nonNullable. (#45852) | | feat - e0a2248b32 | Add a FormRecord type. (#45607) | | feat - 7ee121f595 | Add untyped versions of the model classes for use in migration. (#45205) | | feat - 89d299105a | Implement strict types for the Angular Forms package. (#43834) | | feat - f490c2de4e | support negative indices in FormArray methods. (#44848) | | fix - 39be06037d | Add a nonNullable option to FormControl for consistency. | | fix - 4332897baa | Add UntypedFormBuilder (#45268) | | fix - 5d13e58aed | Allow NonNullableFormBuilder to be injected. (#45904) | | fix - 8dd3f82f94 | Correct empty validator to handle objects with a property length: 0. (#33729) | | fix - ff3f5a8d12 | Fix a typing bug in FormBuilder. (#45684) | | fix - fe0e42a996 | Make UntypedFormBuilder assignable to FormBuilder, and vice versa. (#45421) | | fix - b36dec6b5b | not picking up disabled state if group is swapped out and disabled (#43499) | | fix - 9f6fa5b746 | Prevent FormBuilder from distributing unions to control types. (#45942) | | fix - aa7b857be8 | Property renaming safe code (#45271) | | fix - cae1e44608 | Update the typed forms migration to use FormArray<T> instead of FormArray<T[]>. (#44933) | | fix - d336ba96d9 | Update the typed forms migration. (#45281) | | fix - 018550ed50 | Value and RawValue should be part of the public API. (#45978) | | fix - 2e96cede3e | Warn on FormControls that are constructed with both options and asyncValidators. | ### http | Commit | Description | | -- | -- | | fix - 76a9a24cdc | encode + signs in query params as %2B (angular#11058) (#45111) | | fix - d43c0e973f | Throw error when headers are supplied in JSONP request (#45210) | ### language-service | Commit | Description | | -- | -- | | feat - 9d4af65e34 | Provide plugin to delegate rename requests to Angular (#44696) | | fix - 3ae133c69e | Fix detection of Angular for v14+ projects (#45998) | ### localize | Commit | Description | | -- | -- | | fix - a50e2da64a | ensure transitively loaded compiler code is tree-shakable (#45405) | ### migrations | Commit | Description | | -- | -- | | feat - d56a537196 | Add migration to add explicit Route/Routes type (#45084) | ### ngcc | Commit | Description | | -- | -- | | fix - 74a2e2e2ec | cope with packages following APF v14+ (#45833) | ### platform-browser | Commit | Description | | -- | -- | | fix - a01bcb8e7e | do not run change detection when loading Hammer (#44921) | | fix - b32647dc68 | Make transfer state key typesafe. (#23020) | | fix - c7bf75dd5e | remove obsolete shim for Map comparison in Jasmine (#45521) | | perf - 23c4c9601e | avoid including Testability by default in bootstrapApplication (#45885) | ### platform-server | Commit | Description | | -- | -- | | feat - dff5586d52 | implement renderApplication function (#45785) | | fix - 22c71be94c | update renderApplication to move appId to options (#45844) | ### router | Commit | Description | | -- | -- | | feat - f4fd1a8262 | Add EnvironmentInjector to RouterOutlet.activateWith (#45597) | | feat - 910de8bc33 | Add Route.title with a configurable TitleStrategy (#43307) | | feat - 4e0957a4e1 | Add ability to specify providers on a Route (#45673) | | feat - dea8c86cd5 | add ariaCurrentWhenActive input to RouterLinkActive directive (#45167) | | feat - 41e2a68e30 | add type properties to all router events (#44189) | | feat - 4962a4a332 | Allow loadChildren to return a Route array (#45700) | | feat - 791bd31424 | set stricter type for Route.title (#44939) | | feat - 50004c143b | Support lazy loading standalone components with loadComponent (#45705) | | fix - 7fd416d060 | Fix type of Route.pathMatch to be more accurate (#45176) | | fix - 1c11a57155 | merge interited resolved data and static data (#45276) | | fix - f8f3ab377b | Remove any from LoadChildrenCallback type (#45524) | | fix - d4fc12fa19 | Remove deprecated initialNavigation option (#45729) | | fix - 989e840cce | Remove unused string type for ActivatedRoute.component (#45625) | | fix - 64f837d2c0 | Update Navigation#initialUrl to match documentation and reality (#43863) | | fix - 96fd29c6d2 | validate lazy loaded configs (#45526) | | perf - f13295f3a3 | cancel the navigation instantly if at least one resolver doesn't emit any value (#45621) | | refactor - 1d2f5c1101 | deprecate no longer needed resolver fields (#45597) | | refactor - 7b367d9d90 | Remove unnecessary setTimeout in UrlTree redirects (#45735) | | refactor - c9679760b2 | take only the first emitted value of every resolver to make it consistent with guards (#44573) | ### service-worker | Commit | Description | | -- | -- | | feat - ec0a0e0669 | add cacheOpaqueResponses option for data-groups (#44723) | | feat - bd04fbc05b | emit a notification when the service worker is already up to date after check (#45216) | ## Special Thanks Adrian Kunz, Alan Agius, AleksanderBodurri, Alex Rickabaugh, AlirezaEbrahimkhani, Amir Rustamzadeh, Andrew Kushnir, Andrew Scott, Chabbey Franรงois, Charles Lyding, Cรฉdric Exbrayat, Daan De Smedt, David Schmidt, Derek Cormier, Dmitrij Kuba, Doug Parker, Dylan Hunn, Emma Twersky, George Kalpakas, George Looshch, Jan Kuehle, Jessica Janiuk, JiaLiPassion, JimMorrison723, Joe Martin (Crowdstaffing), Joey Perrott, JoostK, Kristiyan Kostadinov, Krzysztof Platis, Leosvel Pรฉrez Espinosa, Maddie Klein, Mark Whitfeld, Martin Sikora, Michael-Doner, Michal Materowski, Minko Gechev, Paul Gschwendtner, Pawel Kozlowski, Payam Shahidi, Pusztai Tibor, Ricardo Mattiazzi Baumgartner, Roy Dorombozi, Ruslan Lekhman, Samuel Littley, Sergej Grilborzer, Sumit Arora, Tobias Speicher, Virginia Dooley, Zack Elliott, alirezaghey, ananyahs96, arturovt, cexbrayat, dario-piotrowicz, ivanwonder, kamikopi, markostanimirovic, markwhitfeld, mgechev, renovate[bot], twerske and zverbeta