remove-4-second-wait-for-ublock-users (#1934)

* remove-4-second-wait-for-ublock-users

* 🤖 GITHUB ACTIONS

src/app/core/google-tag-manager/google-tag-manager.service.ts

@@ -1,4 +1,4 @@
-import { Injectable } from '@angular/core'
+import { Inject, Injectable } from '@angular/core'
 import { environment } from '../../../environments/environment'
 import { RequestInfoForm } from '../../types'
 import { BehaviorSubject, Observable } from 'rxjs'
@@ -12,6 +12,7 @@ import { catchError } from 'rxjs/operators'
 import { ItemGTM } from '../../types/item_gtm'
 import { ERROR_REPORT } from '../../errors'
 import { ErrorHandlerService } from '../error-handler/error-handler.service'
+import { WINDOW } from 'src/app/cdk/window'
 
 @Injectable({
   providedIn: 'root',
@@ -22,7 +23,10 @@ export class GoogleTagManagerService {
 
   private isLoaded = false
 
-  constructor(private _errorHandler: ErrorHandlerService) {}
+  constructor(
+    private _errorHandler: ErrorHandlerService,
+    @Inject(WINDOW) private _window: Window
+  ) {}
 
   public pushTag(item: ItemGTM): Observable<void> {
     return new Observable<void>((subscriber) => {
@@ -40,15 +44,23 @@ export class GoogleTagManagerService {
             (response) => {
               if (response) {
                 pushOnDataLayer(item)
-                subscriber.next()
-                subscriber.complete()
+                if (!this.isGtmRunning()) {
+                  subscriber.error({
+                    name: 'GTM - Error',
+                    message: 'Gtm is not adding uniqueEventId attributes',
+                  })
+                } else {
+                  subscriber.next()
+                  subscriber.complete()
+                }
               }
             },
-            () =>
+            () => {
               subscriber.error({
                 name: 'GTM - Error',
                 message: 'Unable to add GTM',
               })
+            }
           )
       } else {
         pushOnDataLayer(item)
@@ -58,6 +70,13 @@ export class GoogleTagManagerService {
     })
   }
 
+  public isGtmRunning(): boolean {
+    // When GTM is blocked by add blockers like Ublock
+    // the `gtm.uniqueEventId` will not be added to the dataLayer objects
+    const gtmData = (this._window as any).dataLayer || []
+    return gtmData.some((event: any) => event['gtm.uniqueEventId'])
+  }
+
   public addGtmToDom(): Observable<boolean> {
     return new Observable<boolean>((subscriber) => {
       if (this.isLoaded) {

src/app/guards/authorize.guard.ts

@@ -80,39 +80,29 @@ export class AuthorizeGuard implements CanActivateChild {
     analyticsReports.push(
       this._googleTagManagerService.reportEvent(`Reauthorize`, request)
     )
-    addEventListener('beforeunload', (event) => {
-      // temporally keeping the console logs to debug the issue
-      console.log('beforeunload', event)
-      this.redirectTroughGtmWasCalled = true
-    })
 
     return forkJoin(analyticsReports).pipe(
-      tap(
-        (value) => {
-          console.log('reportAlreadyAuthorize tap', value)
-        },
-        (err) => {
-          console.log('reportAlreadyAuthorize tap err', err)
-        }
-      ),
+      tap((value) => {
+        console.log(
+          'reportAlreadyAuthorize tap',
+          value,
+          JSON.stringify((this.window as any).dataLayer)
+        )
+      }),
       catchError((err) => {
+        console.log(
+          'reportAlreadyAuthorize catchError',
+          err,
+          JSON.stringify((this.window as any).dataLayer)
+        )
         this._errorHandler.handleError(
           err,
           ERROR_REPORT.STANDARD_NO_VERBOSE_NO_GA
         )
         return this.sendUserToRedirectURL(request)
       }),
-      // If and Add blocker like Ublock is enable the GTM `redirectURL` will never be called
-      // This add blockers will also not trigger the `catchError` above, since GTM will not throw an error
-      // So this timeout will redirect the user to the redirectURL after 4 seconds of waiting for the GTM redirect
-      switchMap(() => timer(4000)),
       switchMap(() => {
-        // Checks that a redirect by GTM is not already in progress
-        // Stop a second redirect to happen if the a browser event `beforeunload` event was triggered
-        if (this.redirectTroughGtmWasCalled) {
-          return NEVER
-        }
-        return this.sendUserToRedirectURL(request)
+        return NEVER
       })
     )
   }