I posted another question about unit testing my authGuard for a small angular app, but even though in the same test, I see another unrelated issue. So that is why I created this question.

My code, without unnecessary extras is this:
Authguard:

@Injectable({
  providedIn: 'root',
})
export class AuthGuard implements CanActivate {
  constructor(
    private authService: AuthService,
    private router: Router,
    @Inject(PLATFORM_ID) private platformId: Object,
  ) {}

  canActivate(
    _route: ActivatedRouteSnapshot,
    _state: RouterStateSnapshot,
  ): boolean | UrlTree | Promise<boolean | UrlTree> | Observable<boolean | UrlTree> {
    if (isPlatformServer(this.platformId)) {
      console.log('server');
      return true;
    } else {
      console.log('browser');
      this.authService.autoLogin();
      return this.authService.user.pipe(
        take(1),
        map((user) => {
          console.log('user', user);
          if (!!user) {
            return true;
          }
          console.log('navugate');
          this.router.navigate(['/auth']);
          return false;
        }),
      );
    }
  }
}

And the spec file:

describe('AuthGuard', () => {
  let spectator: SpectatorService<AuthGuard>;
  const config = {
    service: AuthGuard,
    imports: [RouterTestingModule, HttpClientTestingModule],
    providers: [AppRoutingModule, AuthService, { provide: PLATFORM_ID, useValue: 'browser' }],
    schemas: [CUSTOM_ELEMENTS_SCHEMA],
  };

  const createService = createServiceFactory(config);

  it('should should navigate to /auth if running on browser and not authenticated', () => {
    spectator = createService();
    // const spyNavigate = spyOn(spectator.service['router'], 'navigate').and.callThrough();
    const user = new User('[email protected]', 'id', 'token', new Date(10000));
    spectator.service['authService'].user.next(user);
    const result = spectator.service.canActivate(null, null);
    // expect(spyNavigate).toHaveBeenCalled();
    expect(result).toEqual(false);
  });
});

Two things go wrong:

1. when I uncomment the spyNavigate lines it tells me it was never called.
2. When I leave them like this it tells me:

    Error: Expected AnonymousSubject({ _isScalar: false, observers: [  ], closed: false, isStopped: false, hasError: false, thrownError: null, destination: AnonymousSubject({ _isScalar: false, observers: [  ], closed: false, isStopped: false, hasError: false, thrownError: null, destination: BehaviorSubject({ _isScalar: false, observers: [  ], closed: false, isStopped: false, hasError: false, thrownError: null, _value: User({ email: 'email', id: 'localId', _token: 'idToken', _expirationDate: Date(Thu Mar 04 2021 21:28:27 GMT+0100 (Central European Standard Time)) }) }), source: BehaviorSubject({ _isScalar: false, observers: [  ], closed: false, isStopped: false, hasError: false, thrownError: null, _value: User({ email: 'email', id: 'localId', _token: 'idToken', _expirationDate: Date(Thu Mar 04 2021 21:28:27 GMT+0100 (Central European Standard Time)) }) }), operator: TakeOperator({ total: 1 }) }), source: AnonymousSubject({ _isScalar: false, observers: [  ], closed: false, isStopped: false, hasError: false ... to equal false.

I feel it has something to do with the async behavior of the subscribe in the authGuard.
I tried using fakeAsync in the spec, and then tick() before the assertions, but could not get that to work either.

Any help here is appreciated!

Source: Angular Questions