[Bug]: Page does not work when opening a new tab with window.open()

[scurk1415]

Version

15.0.1

Please provide a link to a minimal reproduction of the bug

No response

Please provide the exception or error you saw

ERROR Error: Uncaught (in promise): TypeError: Cannot destructure property 'isAuthenticated' of 'object null' as it is null.
TypeError: Cannot destructure property 'isAuthenticated' of 'object null' as it is null.
    at angular-auth-oidc-client.mjs:5166:93
    at map.js:7:37
    at OperatorSubscriber._next (OperatorSubscriber.js:13:21)
    at OperatorSubscriber.next (Subscriber.js:31:18)
    at take.js:12:32
    at OperatorSubscriber._next (OperatorSubscriber.js:13:21)
    at OperatorSubscriber.next (Subscriber.js:31:18)
    at Observable._subscribe (innerFrom.js:51:24)
    at Observable._trySubscribe (Observable.js:37:25)
    at Observable.js:31:30
    at resolvePromise (zone.js:1214:31)
    at resolvePromise (zone.js:1168:17)
    at zone.js:1281:17
    at _ZoneDelegate.invokeTask (zone.js:409:31)
    at core.mjs:26276:55
    at AsyncStackTaggingZoneSpec.onInvokeTask (core.mjs:26276:36)
    at _ZoneDelegate.invokeTask (zone.js:408:60)
    at Object.onInvokeTask (core.mjs:26584:33)
    at _ZoneDelegate.invokeTask (zone.js:408:60)
    at Zone.runTask (zone.js:178:47)

Steps to reproduce the behavior

1. Authenticate yourself on your page
2. Open a route with window.open(url, '_blank') (i guess you need to have a guard on the route, we use AutoLoginAllRoutesGuard)
3. The error above gets thrown

A clear and concise description of what you expected to happen.

No error

Additional context

• It still works with 15.0.0, but does not work with 15.0.1+.
• It also works if we want to open a page with:
  <a [routerLink]="['/page']" target="_blank">Url</a>

Does not work with window.open(url)

[FabianGosebrink]

Why are you using the non-angular way to open an angular internal route?

[scurk1415]

We have a common icon component with a click output. Sometimes we open a modal, sometimes we redirect the user. The client wants us to open the page in a new tab and so far we have been doing it with window.open, as the angular router.navigate() does not support opening new tabs

[Mas2112]

We are running into this exact same issue for the same use case. We want to open page in a new tab.

[TrondBotnen]

This is also the case if you have a link in an external page pointing to a page requiring authentication.

[jancvmr]

We are encountering this in links to our application from an SSO landing page (which opens the application in a new tab). One work-around we attempted was to link to a static html landing page which would then redirect to the home page of the application, but we get the same result:
ERROR Error: Uncaught (in promise): TypeError: Cannot destructure property 'isAuthenticated' of 'object null' as it is null. TypeError: Cannot destructure property 'isAuthenticated' of 'object null' as it is null.

[windischb]

same for my project....
I'll want to open a details view in a seperate window and/or tab. Both didn't work.

[tiberiuzuld]

same for my project...
I narrowed it down to this PR https://github.com/damienbod/angular-auth-oidc-client/pull/1595/files
While debugging seems my window is considered as pop-up and I get a null as return:

        if (this.popupService.currentWindowIsPopUp()) {
            this.popupService.sendMessageToMainWindow(currentUrl);
            return of(null);
        }

angular-auth-oidc-client/projects/angular-auth-oidc-client/src/lib/auth-state/check-auth.service.ts

Line 111 in 6f44b82

return of(null);

Workaround use noopener in window.open
window.open(<your link>, '_blank', 'noopener');
https://developer.mozilla.org/en-US/docs/Web/API/Window/open
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/noopener

Currently library checks if is popup by checking window.opener

angular-auth-oidc-client/projects/angular-auth-oidc-client/src/lib/login/popup/popup.service.ts

Line 34 in 2011258

currentWindowIsPopUp(): boolean {

[natecowen]

same for my project... I narrowed it down to this PR https://github.com/damienbod/angular-auth-oidc-client/pull/1595/files While debugging seems my window is considered as pop-up and I get a null as return:

        if (this.popupService.currentWindowIsPopUp()) {
            this.popupService.sendMessageToMainWindow(currentUrl);
            return of(null);
        }

angular-auth-oidc-client/projects/angular-auth-oidc-client/src/lib/auth-state/check-auth.service.ts

Line 111 in 6f44b82

return of(null);

Workaround use noopener in window.open window.open(<your link>, '_blank', 'noopener'); https://developer.mozilla.org/en-US/docs/Web/API/Window/open https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/noopener

Currently library checks if is popup by checking window.opener

angular-auth-oidc-client/projects/angular-auth-oidc-client/src/lib/login/popup/popup.service.ts

Line 34 in 2011258

currentWindowIsPopUp(): boolean {

I was running into this issue as well. Your workaround of 'noopener' worked for me. Thanks for the workaround.

[kodemus]

This is also the case if you have a link in an external page pointing to a page requiring authentication.

It's exactly our situation : we can't ask the external page to add the 'noopener' option when they open our page.
As we don't use popups in our flow we "deactivated" the popup check with a dummy implementation.

import { Injectable } from '@angular/core';
import { OpenIdConfiguration, PopupOptions } from 'angular-auth-oidc-client';
import { PopupResult } from 'angular-auth-oidc-client/lib/login/popup/popup-result';
import { Observable, of } from 'rxjs';

/** Custom dummy implementation of the PopUpService used to prevent this issue :
 *  https://github.com/damienbod/angular-auth-oidc-client/issues/1616.
 *  As the portal page opens our application with window.open(<our app url>, '_blank') without the 'noopener' option,
 *  we end-up with the portal window as opener of our window and the oidc lib thinks that we're in a popup.
 *  As we don't use popups in our auth process, the dummy implementation works for us.
 */
@Injectable({ providedIn: 'root' })
export class DummyAuthPopUpService {

  get result$(): Observable<PopupResult> {
    return of();
  }

  currentWindowIsPopUp(): boolean {
    return false;
  }

  isCurrentlyInPopup(config: OpenIdConfiguration): boolean {
    return false;
  }

  openPopUp(url: string, popupOptions: PopupOptions, config: OpenIdConfiguration): void {
    console.error('openPopUp() not implemented');
  }

  sendMessageToMainWindow(url: string): void {
    console.error('sendMessageToMainWindow() not implemented');
  }
}

It's injected in the module like this :

@NgModule({
  imports: [AuthModule.forRoot({
    config: {
      authority: 'https://our-oidc-authority',
      redirectUrl: 'https://our-redirect-url',
      clientId: 'our-client-id',
      ....
    }
  })],
  exports: [AuthModule],
  providers:[
    { provide: PopUpService, useClass: DummyAuthPopUpService }
  ],
})
export class AuthConfigModule { }

[lufo88ita]

Happen also in 13.1.0
My case is:
I have two applications (A and B) that share the same authentication server. In application A I have a link to application B and it must open in a new tab.

@tiberiuzuld your workaround work for me. Thanks