refactor(router): Move preloading to tree-shakeable provider (angular#46215)

Extracting preloading to a provider moves us towards
thinking about a world where `ExtraOptions` doesn't exist to control
behaviors that are opt-in/opt-out. Instead, these behaviors could be
controlled by the presence (or lackthereof) of the providers which has
the functionality. This is relevant to a world in which we no longer
have the `RouterModule` but instead have something like `provideRouter`
where the features are tree-shakeable.

This change _does not_ make the `RouterPreloader` tree-shakeable inside
`RouterModule.forRoot` because the compiler cannot statically determine
whether it's needed. However, in the `provideRouter` world without
`forRoot`, preloading could be exposed through the provider function
instead, making the `RouterPreloader` and `PreloadingStrategy`
implementations tree-shakeable for those that don't use it (which is the
default - no preloading).

PR Close angular#46215

Author: atscott

goldens/public-api/router/index.md

@@ -417,6 +417,10 @@ export class NavigationStart extends RouterEvent {
 export class NoPreloading implements PreloadingStrategy {
     // (undocumented)
     preload(route: Route, fn: () => Observable<any>): Observable<any>;
+    // (undocumented)
+    static ɵfac: i0.ɵɵFactoryDeclaration<NoPreloading, never>;
+    // (undocumented)
+    static ɵprov: i0.ɵɵInjectableDeclaration<NoPreloading>;
 }
 
 // @public
@@ -452,6 +456,10 @@ export type Params = {
 export class PreloadAllModules implements PreloadingStrategy {
     // (undocumented)
     preload(route: Route, fn: () => Observable<any>): Observable<any>;
+    // (undocumented)
+    static ɵfac: i0.ɵɵFactoryDeclaration<PreloadAllModules, never>;
+    // (undocumented)
+    static ɵprov: i0.ɵɵInjectableDeclaration<PreloadAllModules>;
 }
 
 // @public

goldens/public-api/router/testing/index.md

@@ -37,7 +37,7 @@ export class RouterTestingModule {
 export function setupTestingRouter(urlSerializer: UrlSerializer, contexts: ChildrenOutletContexts, location: Location_2, compiler: Compiler, injector: Injector, routes: Route[][], opts?: ExtraOptions | UrlHandlingStrategy | null, urlHandlingStrategy?: UrlHandlingStrategy, routeReuseStrategy?: RouteReuseStrategy, titleStrategy?: TitleStrategy): Router;
 
 // @public
-export function setupTestingRouterInternal(urlSerializer: UrlSerializer, contexts: ChildrenOutletContexts, location: Location_2, compiler: Compiler, injector: Injector, routes: Route[][], opts?: ExtraOptions | UrlHandlingStrategy, urlHandlingStrategy?: UrlHandlingStrategy, routeReuseStrategy?: RouteReuseStrategy, defaultTitleStrategy?: DefaultTitleStrategy, titleStrategy?: TitleStrategy): Router;
+export function setupTestingRouterInternal(urlSerializer: UrlSerializer, contexts: ChildrenOutletContexts, location: Location_2, compiler: Compiler, injector: Injector, routes: Route[][], opts?: ExtraOptions | UrlHandlingStrategy | null, urlHandlingStrategy?: UrlHandlingStrategy, routeReuseStrategy?: RouteReuseStrategy, defaultTitleStrategy?: DefaultTitleStrategy, titleStrategy?: TitleStrategy): Router;
 
 // (No @packageDocumentation comment for this package)
 

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

@@ -248,9 +248,6 @@
   {
     "name": "INJECTOR_SCOPE"
   },
-  {
-    "name": "Inject"
-  },
   {
     "name": "InjectFlags"
   },
@@ -407,9 +404,6 @@
   {
     "name": "NoMatch"
   },
-  {
-    "name": "NoPreloading"
-  },
   {
     "name": "NodeInjector"
   },
@@ -485,9 +479,15 @@
   {
     "name": "ROUTER_INITIALIZER"
   },
+  {
+    "name": "ROUTER_PRELOADER"
+  },
   {
     "name": "ROUTER_PROVIDERS"
   },
+  {
+    "name": "ROUTER_SCROLLER"
+  },
   {
     "name": "ROUTES"
   },
@@ -785,9 +785,6 @@
   {
     "name": "_randomChar"
   },
-  {
-    "name": "componentDefCount"
-  },
   {
     "name": "_stripIndexHtml"
   },
@@ -890,6 +887,9 @@
   {
     "name": "compare"
   },
+  {
+    "name": "componentDefCount"
+  },
   {
     "name": "computeStaticStyling"
   },
@@ -971,9 +971,6 @@
   {
     "name": "createRoot"
   },
-  {
-    "name": "createRouterScroller"
-  },
   {
     "name": "createTView"
   },
@@ -1376,6 +1373,9 @@
   {
     "name": "initTNodeFlags"
   },
+  {
+    "name": "inject"
+  },
   {
     "name": "injectArgs"
   },
@@ -1697,9 +1697,6 @@
   {
     "name": "provideForRootGuard"
   },
-  {
-    "name": "provideLocationStrategy2"
-  },
   {
     "name": "provideRoutes"
   },
@@ -2027,4 +2024,4 @@
   {
     "name": "ɵɵtextInterpolate1"
   }
-]
+]

packages/router/src/private_export.ts

@@ -9,5 +9,5 @@
 
 export {ɵEmptyOutletComponent} from './components/empty_outlet';
 export {RestoredState as ɵRestoredState} from './router';
-export {assignExtraOptionsToRouter as ɵassignExtraOptionsToRouter, ROUTER_PROVIDERS as ɵROUTER_PROVIDERS} from './router_module';
+export {assignExtraOptionsToRouter as ɵassignExtraOptionsToRouter, providePreloading as ɵprovidePreloading, ROUTER_PROVIDERS as ɵROUTER_PROVIDERS} from './router_module';
 export {flatten as ɵflatten} from './utils/collection';

packages/router/src/router_module.ts

@@ -7,7 +7,7 @@
  */
 
 import {APP_BASE_HREF, HashLocationStrategy, Location, LOCATION_INITIALIZED, LocationStrategy, PathLocationStrategy, PlatformLocation, ViewportScroller} from '@angular/common';
-import {ANALYZE_FOR_ENTRY_COMPONENTS, APP_BOOTSTRAP_LISTENER, APP_INITIALIZER, ApplicationRef, Compiler, ComponentRef, ENVIRONMENT_INITIALIZER, Inject, inject, Injectable, InjectFlags, InjectionToken, Injector, ModuleWithProviders, NgModule, NgProbeToken, OnDestroy, Optional, Provider, SkipSelf} from '@angular/core';
+import {ANALYZE_FOR_ENTRY_COMPONENTS, APP_BOOTSTRAP_LISTENER, APP_INITIALIZER, ApplicationRef, Compiler, ComponentRef, ENVIRONMENT_INITIALIZER, Inject, inject, Injectable, InjectFlags, InjectionToken, Injector, ModuleWithProviders, NgModule, NgProbeToken, OnDestroy, Optional, Provider, SkipSelf, Type} from '@angular/core';
 import {Title} from '@angular/platform-browser';
 import {of, Subject} from 'rxjs';
 
@@ -22,7 +22,7 @@ import {RouteReuseStrategy} from './route_reuse_strategy';
 import {ErrorHandler, Router} from './router';
 import {RouterConfigLoader, ROUTES} from './router_config_loader';
 import {ChildrenOutletContexts} from './router_outlet_context';
-import {NoPreloading, PreloadAllModules, PreloadingStrategy, RouterPreloader} from './router_preloader';
+import {PreloadingStrategy, RouterPreloader} from './router_preloader';
 import {ROUTER_SCROLLER, RouterScroller} from './router_scroller';
 import {ActivatedRoute} from './router_state';
 import {UrlHandlingStrategy} from './url_handling_strategy';
@@ -52,6 +52,8 @@ export const ROUTER_CONFIGURATION = new InjectionToken<ExtraOptions>('ROUTER_CON
  */
 export const ROUTER_FORROOT_GUARD = new InjectionToken<void>('ROUTER_FORROOT_GUARD');
 
+const ROUTER_PRELOADER = new InjectionToken<RouterPreloader>('');
+
 export const ROUTER_PROVIDERS: Provider[] = [
   Location,
   {provide: UrlSerializer, useClass: DefaultUrlSerializer},
@@ -66,9 +68,6 @@ export const ROUTER_PROVIDERS: Provider[] = [
   },
   ChildrenOutletContexts,
   {provide: ActivatedRoute, useFactory: rootRoute, deps: [Router]},
-  RouterPreloader,
-  NoPreloading,
-  PreloadAllModules,
   RouterConfigLoader,
 ];
 
@@ -138,11 +137,7 @@ export class RouterModule {
         {provide: ROUTER_CONFIGURATION, useValue: config ? config : {}},
         config?.useHash ? provideHashLocationStrategy() : providePathLocationStrategy(),
         provideRouterScroller(),
-        {
-          provide: PreloadingStrategy,
-          useExisting: config && config.preloadingStrategy ? config.preloadingStrategy :
-                                                             NoPreloading
-        },
+        config?.preloadingStrategy ? providePreloading(config.preloadingStrategy) : [],
         {provide: NgProbeToken, multi: true, useFactory: routerNgProbeToken},
         provideRouterInitializer(),
       ],
@@ -575,7 +570,6 @@ export class RouterInitializer implements OnDestroy {
 
   bootstrapListener(bootstrappedComponentRef: ComponentRef<any>): void {
     const opts = this.injector.get(ROUTER_CONFIGURATION);
-    const preloader = this.injector.get(RouterPreloader);
     const routerScroller: RouterScroller|null =
         this.injector.get(ROUTER_SCROLLER, null, InjectFlags.Optional);
     const router = this.injector.get(Router);
@@ -590,7 +584,7 @@ export class RouterInitializer implements OnDestroy {
       router.initialNavigation();
     }
 
-    preloader.setUpPreloading();
+    this.injector.get(ROUTER_PRELOADER, null, InjectFlags.Optional)?.setUpPreloading();
     routerScroller?.init();
     router.resetRootComponentType(ref.componentTypes[0]);
     this.resultOfPreactivationDone.next(void 0);
@@ -653,4 +647,12 @@ function provideTracing(): Provider[] {
   } else {
     return [];
   }
-}
+}
+
+export function providePreloading(preloadingStrategy: Type<PreloadingStrategy>): Provider[] {
+  return [
+    RouterPreloader,
+    {provide: ROUTER_PRELOADER, useExisting: RouterPreloader},
+    {provide: PreloadingStrategy, useExisting: preloadingStrategy},
+  ];
+}

packages/router/src/router_preloader.ts

@@ -8,9 +8,9 @@
 
 import {Compiler, createEnvironmentInjector, EnvironmentInjector, Injectable, OnDestroy} from '@angular/core';
 import {from, Observable, of, Subscription} from 'rxjs';
-import {catchError, concatMap, filter, map, mapTo, mergeAll, mergeMap, tap} from 'rxjs/operators';
+import {catchError, concatMap, filter, mergeAll, mergeMap} from 'rxjs/operators';
 
-import {Event, NavigationEnd, RouteConfigLoadEnd, RouteConfigLoadStart} from './events';
+import {Event, NavigationEnd} from './events';
 import {LoadedRouterConfig, Route, Routes} from './models';
 import {Router} from './router';
 import {RouterConfigLoader} from './router_config_loader';
@@ -38,6 +38,7 @@ export abstract class PreloadingStrategy {
  *
  * @publicApi
  */
+@Injectable({providedIn: 'root'})
 export class PreloadAllModules implements PreloadingStrategy {
   preload(route: Route, fn: () => Observable<any>): Observable<any> {
     return fn().pipe(catchError(() => of(null)));
@@ -53,6 +54,7 @@ export class PreloadAllModules implements PreloadingStrategy {
  *
  * @publicApi
  */
+@Injectable({providedIn: 'root'})
 export class NoPreloading implements PreloadingStrategy {
   preload(route: Route, fn: () => Observable<any>): Observable<any> {
     return of(null);

packages/router/testing/src/router_testing_module.ts

@@ -9,7 +9,7 @@
 import {Location, LocationStrategy} from '@angular/common';
 import {MockLocationStrategy, SpyLocation} from '@angular/common/testing';
 import {Compiler, Injector, ModuleWithProviders, NgModule, Optional} from '@angular/core';
-import {ChildrenOutletContexts, DefaultTitleStrategy, ExtraOptions, NoPreloading, PreloadingStrategy, provideRoutes, Route, Router, ROUTER_CONFIGURATION, RouteReuseStrategy, RouterModule, ROUTES, Routes, TitleStrategy, UrlHandlingStrategy, UrlSerializer, ɵassignExtraOptionsToRouter as assignExtraOptionsToRouter, ɵflatten as flatten, ɵROUTER_PROVIDERS as ROUTER_PROVIDERS} from '@angular/router';
+import {ChildrenOutletContexts, DefaultTitleStrategy, ExtraOptions, NoPreloading, PreloadingStrategy, provideRoutes, Route, Router, ROUTER_CONFIGURATION, RouteReuseStrategy, RouterModule, ROUTES, Routes, TitleStrategy, UrlHandlingStrategy, UrlSerializer, ɵassignExtraOptionsToRouter as assignExtraOptionsToRouter, ɵflatten as flatten, ɵprovidePreloading as providePreloading, ɵROUTER_PROVIDERS as ROUTER_PROVIDERS} from '@angular/router';
 
 import {EXTRA_ROUTER_TESTING_PROVIDERS} from './extra_router_testing_providers';
 
@@ -119,7 +119,7 @@ export function setupTestingRouter(
         [TitleStrategy, new Optional()],
       ]
     },
-    {provide: PreloadingStrategy, useExisting: NoPreloading},
+    providePreloading(NoPreloading),
     provideRoutes([]),
   ]
 })