canLoad is never fired when you use lazy loading, but as soon as you try to navigate manually it fires

I’m submitting a…

[ ] Regression (a behavior that used to work and stopped working in a new release)
[x] Bug report  
[ ] Performance issue
[ ] Feature request
[ ] Documentation issue or request
[ ] Support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question
[ ] Other... Please describe:

Current behavior

I have used canLoad in router along with canActivate, and the modules are lazy loaded for ex:

{
    path: "",
    loadChildren: "./admin/admin.module#AdminModule",
    canActivate: [AdminGuard],
    canLoad: [AdminGuard]
  },

Where my AdminGuard is:

import {Injectable} from "@angular/core";
import {CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, Router, CanLoad, Route} from "@angular/router";
import {Observable} from "rxjs";
import {AuthService} from "@core/services/auth.service";

@Injectable()
export class AdminGuard implements CanActivate, CanLoad {

  constructor(private router: Router, private authService: AuthService) {
  }

  canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
    console.log("AdminGuard->CanActivate:", state, this.isAdmin());
    return this.isAdmin();
  }

  canLoad(route: Route): Observable<boolean> | Promise<boolean> | boolean {
    console.log("AdminGuard->CanLoad:", route, this.isAdmin());
    return this.isAdmin();
  }

  isAdmin() {
    if (this.authService.isAdmin) {
      return true;
    } else {
      this.router.navigate(["/"]);
      return false;
    }
  }
}

I am using a PreloadAllModules as preloadingStrategy; all the modules are preloaded except the above mentioned module on which I have used canLoad. (I observed this because no console log is recorded). But as soon as I try to navigate to admin module I see the console log given below:

admin.guard.ts:18 AdminGuard->CanLoad: {path: "", loadChildren: "./admin/admin.module#AdminModule", canActivate: Array(1), canLoad: Array(1), data: {…}} true
admin.guard.ts:13 AdminGuard->CanActivate: RouterStateSnapshot {_root: TreeNode, url: "/manage/dashboard"} true
admin.guard.ts:13 AdminGuard->CanActivate: RouterStateSnapshot {_root: TreeNode, url: "/manage/dashboard"} true

Expected behavior

• canLoad should be called while lazy loading the modules
• there should be a way to trigger lazy loading again for all not loaded modules for example is current user is changed.

Environment

Angular version: 6.1.4
 
For Tooling issues:
- Node version: 8.11.4
- Platform:  Linux

StackBlitz Link

https://stackblitz.com/edit/angular-canload-bug

I have created two modules here one user and other admin. Admin module has been restricted using canLoad guard. But canLoad is never fired for it during lazy loading while user module is lazy loaded successfully(not having canLoad guard). But as soon as I try no navigate manually on admin route It gets fired. You can see all this in console.log

[deepakgonda]

But there should be a way so that preloader can call canLoad Method and check if module can be loaded and load that module if condition matches.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}