fix(ivy): ensure DebugNode/DebugElement are tree-shakeable in Ivy (#35003)

There are different `DebugNode`/`DebugElement` implementations (and
associated helper functions) for ViewEngine and Ivy. Additionally, these
classes/functions, which are defined inside the `core` package, are
imported by the `platform-browser` package.

Previously, this code was not tree-shaken as expected in Ivy. #30130
partially addressed the issue, but only for the case where `core` and
`platform-browser` end up in the same closure after webpack's scope
hoisting. In cases where this is not the case, our webpack/terser based
tooling is not capable of tree-shaking it.

This commit fixes the problem, by ensuring that the code retained in Ivy
mode (due to the cross-package import) does not unnecessarily reference
`DebugNode`/`DebugElement`, allowing the code to be tree-shaken away.
This results in a 7.6KB reduction in the size of the main angular.io
bundle.

Jira issue: [FW-1802](https://angular-team.atlassian.net/browse/FW-1802)

PR Close #35003
This commit is contained in:
George Kalpakas
2020-01-28 11:13:23 +02:00
committed by Andrew Kushnir
parent c8eb164f01
commit 669df70da5
5 changed files with 23 additions and 10 deletions

View File

@ -6,7 +6,7 @@
* found in the LICENSE file at https://angular.io/license
*/
import {APP_INITIALIZER, ApplicationRef, DebugNode, NgProbeToken, NgZone, Optional, Provider, getDebugNode} from '@angular/core';
import {APP_INITIALIZER, ApplicationRef, DebugNode, NgProbeToken, NgZone, Optional, Provider, ɵgetDebugNodeR2} from '@angular/core';
import {exportNgVar} from '../util';
@ -23,14 +23,14 @@ const CORE_TOKENS_GLOBAL_NAME = 'coreTokens';
* null if the given native element does not have an Angular view associated
* with it.
*/
export function inspectNativeElement(element: any): DebugNode|null {
return getDebugNode(element);
export function inspectNativeElementR2(element: any): DebugNode|null {
return ɵgetDebugNodeR2(element);
}
export function _createNgProbe(coreTokens: NgProbeToken[]): any {
exportNgVar(INSPECT_GLOBAL_NAME, inspectNativeElement);
export function _createNgProbeR2(coreTokens: NgProbeToken[]): any {
exportNgVar(INSPECT_GLOBAL_NAME, inspectNativeElementR2);
exportNgVar(CORE_TOKENS_GLOBAL_NAME, {...CORE_TOKENS, ..._ngProbeTokensToMap(coreTokens || [])});
return () => inspectNativeElement;
return () => inspectNativeElementR2;
}
function _ngProbeTokensToMap(tokens: NgProbeToken[]): {[name: string]: any} {
@ -52,7 +52,7 @@ export const ELEMENT_PROBE_PROVIDERS__POST_R3__ = [];
export const ELEMENT_PROBE_PROVIDERS__PRE_R3__: Provider[] = [
{
provide: APP_INITIALIZER,
useFactory: _createNgProbe,
useFactory: _createNgProbeR2,
deps: [
[NgProbeToken, new Optional()],
],