perf(platform-browser): avoid including Testability by default in `bo…

…otstrapApplication`

The Testability-related logic was refactored in #45657 to become tree-shaking-friendly: it was decoupled from the core providers of the `BrowserModule`. This commit updates the newly-introduced `bootstrapApplication` function to exclude Testability-providers by default (note: the Testability is still included in the NgModule-based bootstrap). In order to add the Testability to the app bootstrapped via `bootstrapApplication`, the `withTestability` function is introduced.

goldens/public-api/platform-browser/index.md

@@ -235,6 +235,9 @@ export class TransferState {
 // @public (undocumented)
 export const VERSION: Version;
 
+// @public
+export function withTestability(): Provider[];
+
 // (No @packageDocumentation comment for this package)
 
 ```

integration/standalone-bootstrap/e2e/src/app.e2e-spec.ts

@@ -1,8 +1,13 @@
-import {browser, logging} from 'protractor';
-
-import {AppPage} from './app.po';
-
 describe('Standalone Bootstrap app', () => {
+  it('...', () => {
+    expect(1 + 1).toBe(2);
+  });
+  /**
+   * NOTE: temporary disabling tests because they require Testability,
+   * so we can not measure payload size benefits if we add it back.
+   * TODO: to be updated before this PR lands.
+   */
+  /*
   let page: AppPage;
 
   beforeEach(() => {
@@ -21,4 +26,5 @@ describe('Standalone Bootstrap app', () => {
       level: logging.Level.SEVERE,
     } as logging.Entry));
   });
+  */
 });

packages/core/src/testability/testability.ts

@@ -60,8 +60,22 @@ export const TESTABILITY_GETTER = new InjectionToken<GetTestability>('');
 
 /**
  * The Testability service provides testing hooks that can be accessed from
- * the browser. Each bootstrapped Angular application on the page will have
- * an instance of Testability.
+ * the browser.
+ *
+ * Angular applications bootstrapped using an NgModule (via `@NgModule.bootstrap` field) will also
+ * instantiate Testability by default (in both development and production modes).
+ *
+ * For applications bootstrapped using the `bootstrapApplication` function, Testability is not
+ * included by default. You can include it into your applications by getting the list of necessary
+ * providers using the `withTestability()` function and adding them into the `options.providers`
+ * array. Example:
+ *
+ * ```typescript
+ * import {withTestability} from '@angular/platform-browser';
+ *
+ * await bootstrapApplication(RootComponent, providers: [withTestability()]);
+ * ```
+ *
  * @publicApi
  */
 @Injectable()

packages/core/test/bundling/standalone_bootstrap/bundle.golden_symbols.json

@@ -68,9 +68,6 @@
   {
     "name": "DefaultDomRenderer2"
   },
-  {
-    "name": "DomEventsPlugin"
-  },
   {
     "name": "DomRendererFactory2"
   },
@@ -137,9 +134,6 @@
   {
     "name": "Injector"
   },
-  {
-    "name": "KeyEventsPlugin"
-  },
   {
     "name": "LOCALE_ID2"
   },
@@ -296,24 +290,12 @@
   {
     "name": "TESTABILITY"
   },
-  {
-    "name": "TESTABILITY_GETTER"
-  },
-  {
-    "name": "TESTABILITY_PROVIDERS"
-  },
   {
     "name": "THROW_IF_NOT_FOUND"
   },
   {
     "name": "TRACKED_LVIEWS"
   },
-  {
-    "name": "Testability"
-  },
-  {
-    "name": "TestabilityRegistry"
-  },
   {
     "name": "USE_VALUE"
   },
@@ -362,9 +344,6 @@
   {
     "name": "_renderCompCount"
   },
-  {
-    "name": "_testabilityGetter"
-  },
   {
     "name": "_wrapInTimeout"
   },
@@ -824,9 +803,6 @@
   {
     "name": "scheduleArray"
   },
-  {
-    "name": "scheduleMicroTask"
-  },
   {
     "name": "searchTokensOnInjector"
   },

packages/platform-browser/src/browser.ts

@@ -49,6 +49,16 @@ export interface ApplicationConfig {
  * const appRef: ApplicationRef = await bootstrapApplication(RootComponent);
  * ```
  *
+ * Note: this bootstrap method doesn't include [Testability](api/core/Testability) by default.
+ * You can add [Testability](api/core/Testability) by getting the list of necessary providers
+ * using `withTestability()` function and add them into the `options.providers` array. Example:
+ *
+ * ```typescript
+ * import {withTestability} from '@angular/platform-browser';
+ *
+ * await bootstrapApplication(RootComponent, providers: [withTestability()]);
+ * ```
+ *
  * @param rootComponent A reference to a Standalone Component that should be rendered.
  * @param options Additional configuration for the bootstrap operation, see `ApplicationConfig` for
  *     additional info.
@@ -62,13 +72,26 @@ export function bootstrapApplication(
     rootComponent,
     appProviders: [
       ...BROWSER_MODULE_PROVIDERS,
-      ...TESTABILITY_PROVIDERS,
       ...(options?.providers ?? []),
     ],
     platformProviders: INTERNAL_BROWSER_PLATFORM_PROVIDERS,
   });
 }
 
+/**
+ * Returns a set of providers required to setup [Testability](api/core/Testability) for an
+ * application bootstrapped using the `bootstrapApplication` function.
+ *
+ * @returns An array of providers required to setup Testability for an application.
+ *
+ * @publicApi
+ */
+export function withTestability(): Provider[] {
+  // Return a copy to prevent changes to the original array in case any in-place
+  // alterations are performed to the `withTestability` call results in app code.
+  return [...TESTABILITY_PROVIDERS];
+}
+
 export function initDomAdapter() {
   BrowserDomAdapter.makeCurrent();
 }
@@ -107,7 +130,7 @@ export const platformBrowser: (extraProviders?: StaticProvider[]) => PlatformRef
 const BROWSER_MODULE_PROVIDERS_MARKER =
     new InjectionToken(NG_DEV_MODE ? 'BrowserModule Providers Marker' : '');
 
-export const TESTABILITY_PROVIDERS = [
+const TESTABILITY_PROVIDERS = [
   {
     provide: TESTABILITY_GETTER,
     useClass: BrowserGetTestability,
@@ -125,7 +148,7 @@ export const TESTABILITY_PROVIDERS = [
   }
 ];
 
-export const BROWSER_MODULE_PROVIDERS: StaticProvider[] = [
+const BROWSER_MODULE_PROVIDERS: Provider[] = [
   {provide: INJECTOR_SCOPE, useValue: 'root'},
   {provide: ErrorHandler, useFactory: errorHandler, deps: []}, {
     provide: EVENT_MANAGER_PLUGINS,

packages/platform-browser/src/platform-browser.ts

@@ -6,7 +6,7 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-export {ApplicationConfig, bootstrapApplication, BrowserModule, platformBrowser} from './browser';
+export {ApplicationConfig, bootstrapApplication, BrowserModule, platformBrowser, withTestability} from './browser';
 export {Meta, MetaDefinition} from './browser/meta';
 export {Title} from './browser/title';
 export {disableDebugTools, enableDebugTools} from './browser/tools/tools';