ERROR TypeError: Cannot read property 'isCallback' of null

[jycaraujo]

Hi, I implemented a login component with "@angular/cli": "~6.2.3" and "adal-angular4": "^3.0.16", it works fine in DEV/UAT environment but when I migrated to PROD I received the following error:

ERROR TypeError: Cannot read property 'isCallback' of null
    at AdalService.push../node_modules/adal-angular4/adal.service.js.AdalService.handleWindowCallback (adal.service.js:69)
    at AppComponent.push../src/app/app.component.ts.AppComponent.ngOnInit (app.component.ts:27)
    at checkAndUpdateDirectiveInline (core.js:9243)
    at checkAndUpdateNodeInline (core.js:10507)
    at checkAndUpdateNode (core.js:10469)
    at debugCheckAndUpdateNode (core.js:11102)
    at debugCheckDirectivesFn (core.js:11062)
    at Object.eval [as updateDirectives] (AppComponent_Host.ngfactory.js? [sm]:1)
    at Object.debugUpdateDirectives [as updateDirectives] (core.js:11054)
    at checkAndUpdateView (core.js:10451)
View_AppComponent_Host_0 @ AppComponent_Host.ngfactory.js? [sm]:1

Does anyone know how to fix it? Thanks.

[michaeltarleton]

@jycaraujo Can you provide more context to your error? Where are you calling login?

Here is some of my working code:

export class AppComponent implements OnInit {
  constructor(private configService: ConfigurationService, public adalService: AdalService) {
    this.adalService.init(this.configService.get(c => c.aadConfig))
  }

  ngOnInit(): void {
    this.adalService.handleWindowCallback(true)
  }

[jycaraujo]

@michaeltarleton my working code is very similar to yours

export class AppComponent implements OnInit {

  constructor(private adalSvc: AdalService) {
    this.adalSvc.init(environment.adalConfig);
  }

  ngOnInit(): void {
    this.adalSvc.handleWindowCallback(); //error line
  }

}

and this is my login component:

export class LoginComponent implements OnInit {

  loading: boolean;

  constructor(
    private route: ActivatedRoute,
    private router: Router,
    private adalSvc: AdalService
  ) {
  }

  ngOnInit() {
    const returnUrl = this.route.snapshot.queryParams['returnUrl'] || '/';

    if (this.adalSvc.userInfo.authenticated) {
      this.router.navigate([returnUrl]);
    }
  }

  login() {
    this.loading = true;
    this.adalSvc.login();
  }
}

[geerzo]

What does your production environment file look like? The only reason you would get that error is if there was another error during the constructor that I can see.

[danton721]

Just had a similar issue, documenting for future users with this issue, fixed it by going back to my previous wotking code and noticing I forgot to init adal with the required configuration before using it.

Just add this line before everything happens, I have added in init of app.component.ts

adalService.init(environment.adalConfig);

Then check your environment for adalConfig:

adalConfig: { tenant: 'REDACTED', clientId: 'REDACTED', endpoints: { 'https://graph.microsoft.com': '00000003-0000-0000-c000-000000000000' } }