fix(router): ensure preloaded components are properly activated (#62502)

dimakuba · AndrewKushnir · commit 9c45c322d1ac · 2025-07-09T14:39:39.000-07:00
Preloaded components were not being activated in certain scenarios when preloading was enabled. This change ensures that components are correctly activated after being preloaded. PR Close #62502
diff --git a/packages/router/src/navigation_transition.ts b/packages/router/src/navigation_transition.ts
@@ -694,7 +694,7 @@ export class NavigationTransitions {
           switchTap((t: NavigationTransition) => {
             const loadComponents = (route: ActivatedRouteSnapshot): Array<Observable<void>> => {
               const loaders: Array<Observable<void>> = [];
-              if (route.routeConfig?.loadComponent && !route.routeConfig._loadedComponent) {
+              if (route.routeConfig?.loadComponent) {
                 const injector = getClosestRouteInjector(route) ?? this.environmentInjector;
                 loaders.push(
                   this.configLoader.loadComponent(injector, route.routeConfig).pipe(
diff --git a/packages/router/test/integration/lazy_loading.spec.ts b/packages/router/test/integration/lazy_loading.spec.ts
@@ -57,6 +57,8 @@ import {
   createRoot,
   advance,
 } from './integration_helpers';
+import {getLoadedComponent} from '../../src/utils/config';
+import {of, delay} from 'rxjs';
 
 export function lazyLoadingIntegrationSuite() {
   describe('lazy loading', () => {
@@ -760,6 +762,12 @@ export function lazyLoadingIntegrationSuite() {
       })
       class LazyLoadedComponent {}
 
+      @Component({
+        selector: 'lazy',
+        template: 'LazyLoadedStandaloneComponent',
+      })
+      class LazyLoadedStandaloneComponent {}
+
       @NgModule({
         declarations: [LazyLoadedComponent],
         imports: [RouterModule.forChild([{path: 'LoadedModule2', component: LazyLoadedComponent}])],
@@ -808,6 +816,33 @@ export function lazyLoadingIntegrationSuite() {
         expect(secondRoutes[0].path).toEqual('LoadedModule2');
       });
 
+      it('should activate preloaded component', async () => {
+        const router = TestBed.inject(Router);
+        const routerPreloader = TestBed.inject(RouterPreloader);
+        const fixture = await createRoot(router, RootCmp);
+
+        router.resetConfig([
+          {path: 'blank', component: BlankCmp},
+          {
+            path: 'lazy',
+            loadComponent: () => of(LazyLoadedStandaloneComponent).pipe(delay(10)),
+            canActivate: [() => of(true).pipe(delay(20))],
+          },
+        ]);
+
+        router.navigateByUrl('/blank');
+
+        await advance(fixture);
+
+        routerPreloader.preload();
+
+        router.navigateByUrl('/lazy');
+
+        await advance(fixture, 40);
+
+        expect(fixture.nativeElement).toHaveText('LazyLoadedStandaloneComponent');
+      });
+
       it('should not preload when canLoad is present and does not execute guard', async () => {
         const router = TestBed.inject(Router);
         const fixture = await createRoot(router, RootCmp);
