web-manager 4.2.0 → 4.3.1

package/dist/index.js

@@ -133,9 +133,9 @@ class Manager {
       // Set up auth event listeners (uses event delegation, no need to wait for DOM)
       this._auth.setupEventListeners();
 
-      // Set up push notification auto-request if enabled
-      if (this.config.pushNotifications?.enabled && this.config.pushNotifications?.config?.autoRequest > 0) {
-        this._setupNotificationAutoRequest();
+      // Set up push notifications
+      if (this.config.pushNotifications?.enabled) {
+        this._notifications.initialize(this.config.pushNotifications.config);
       }
 
       // Initialize Chatsy chat widget if enabled
@@ -568,29 +568,6 @@ class Manager {
     }, this.config.refreshNewVersion.config.interval);
   }
 
-  _setupNotificationAutoRequest() {
-    // Quit if document is not available
-    if (typeof document === 'undefined') {
-      return;
-    }
-
-    // Set up click listener to request notification permissions
-    const handleClick = () => {
-      // Remove listener after first click
-      document.removeEventListener('click', handleClick);
-
-      // Set timeout to request notifications
-      setTimeout(() => {
-        console.log('Auto-requesting notification permissions...');
-        this._notifications.subscribe().catch(err => {
-          console.error('Notification subscription failed:', err.message);
-        });
-      }, this.config.pushNotifications.config.autoRequest);
-    };
-
-    // Wait for user click
-    document.addEventListener('click', handleClick);
-  }
 
   // async _loadPolyfillsIfNeeded() {
   //   // Check if polyfills are needed by testing for ES6 features

package/dist/modules/notifications.js

@@ -4,6 +4,58 @@ class Notifications {
     this._requestInProgress = false;
   }
 
+  initialize(config) {
+    this._vapidKey = this.manager.config?.firebase?.messaging?.config?.vapidKey || null;
+
+    const storage = this.manager.storage();
+    const stored = storage.get('notifications');
+    const permission = typeof Notification !== 'undefined' ? Notification.permission : 'default';
+
+    console.log('[WM:push] Page load check:', { storedSubscribed: stored?.subscribed, storedToken: stored?.token?.slice(-8), permission });
+
+    // If localStorage says subscribed but browser permission disagrees, clear it
+    if (stored?.subscribed && permission !== 'granted') {
+      console.log('[WM:push] Clearing stale subscription — permission is', permission);
+      storage.set('notifications', { subscribed: false, token: null });
+    }
+
+    // Arm auto-request if not currently subscribed (including just-cleared)
+    const autoRequest = config?.autoRequest;
+    if ((!stored?.subscribed || permission !== 'granted') && autoRequest > 0) {
+      console.log('[WM:push] Arming auto-request (delay:', autoRequest + 'ms)');
+      this._setupAutoRequest(autoRequest);
+    }
+
+    // Listen for foreground messages (tab is focused)
+    if (permission === 'granted') {
+      console.log('[WM:push] Setting up foreground listener...', { supported: this.isSupported(), hasMessaging: !!this.manager.firebaseMessaging });
+      this.onMessage((payload) => {
+        console.log('[WM:push] Foreground message received:', payload);
+      }).then(unsub => {
+        console.log('[WM:push] Foreground listener registered:', typeof unsub === 'function' ? 'OK' : 'FAILED (got empty fn)');
+      });
+    }
+  }
+
+  _setupAutoRequest(delay) {
+    if (typeof document === 'undefined') {
+      return;
+    }
+
+    const handleClick = () => {
+      document.removeEventListener('click', handleClick);
+
+      setTimeout(() => {
+        console.log('[WM:push] Auto-requesting notification permissions...');
+        this.subscribe().catch(err => {
+          console.error('[WM:push] Auto-subscription failed:', err.message);
+        });
+      }, delay);
+    };
+
+    document.addEventListener('click', handleClick);
+  }
+
   // Check if notifications are supported
   isSupported() {
     return 'Notification' in window &&
@@ -62,10 +114,9 @@ class Notifications {
 
       // Get FCM token
       const { getToken } = await import('firebase/messaging');
-      const token = await getToken(messaging, {
-        serviceWorkerRegistration: swRegistration,
-        vapidKey: options.vapidKey
-      });
+      const tokenOptions = { serviceWorkerRegistration: swRegistration };
+      if (this._vapidKey) { tokenOptions.vapidKey = this._vapidKey; }
+      const token = await getToken(messaging, tokenOptions);
 
       if (!token) {
         throw new Error('Failed to get FCM token');
@@ -148,9 +199,9 @@ class Notifications {
       const { getToken } = await import('firebase/messaging');
       const swRegistration = this.manager.state.serviceWorker;
 
-      return await getToken(messaging, {
-        serviceWorkerRegistration: swRegistration
-      });
+      const tokenOptions = { serviceWorkerRegistration: swRegistration };
+      if (this._vapidKey) { tokenOptions.vapidKey = this._vapidKey; }
+      return await getToken(messaging, tokenOptions);
     } catch (error) {
       console.error('Get token error:', error);
       return null;
@@ -222,31 +273,54 @@ class Notifications {
     }
   }
 
-  // Sync subscription when auth state changes
+  // Sync subscription when auth state changes or on page load.
+  // Re-fetches the current FCM token — if it changed (browser rotated it,
+  // service worker was re-registered, etc.), saves the new token to Firestore
+  // and updates localStorage. Clears the subscribed state if the token is gone.
   async syncSubscription() {
     try {
-      // Check if we have a stored notification token
       const storage = this.manager.storage();
       const storedNotification = storage.get('notifications');
 
-      if (!storedNotification?.token) {
+      const permission = typeof Notification !== 'undefined' ? Notification.permission : 'default';
+
+      console.log('[WM:push:sync] Starting sync:', { storedSubscribed: storedNotification?.subscribed, storedToken: storedNotification?.token?.slice(-8), permission });
+
+      if (permission !== 'granted') {
+        if (storedNotification?.subscribed) {
+          console.log('[WM:push:sync] Permission not granted — clearing localStorage');
+          storage.set('notifications', { subscribed: false, token: null });
+        } else {
+          console.log('[WM:push:sync] Permission not granted and not subscribed — nothing to do');
+        }
         return false;
       }
 
-      // Update the subscription in Firestore with current auth state
-      await this._saveSubscription(storedNotification.token);
+      // Permission is granted — check if there's a live token (covers localStorage cleared, new browser, etc.)
+      const currentToken = await this.getToken();
+
+      if (!currentToken) {
+        console.log('[WM:push:sync] Token fetch returned null — clearing localStorage');
+        storage.set('notifications', { subscribed: false, token: null });
+        return false;
+      }
+
+      console.log('[WM:push:sync] Token valid:', currentToken.slice(-8), storedNotification?.token ? (storedNotification.token.slice(-8) === currentToken.slice(-8) ? '(unchanged)' : '(CHANGED from ' + storedNotification.token.slice(-8) + ')') : '(recovered — localStorage was empty)');
+
+      await this._saveSubscription(currentToken);
 
-      // Update local storage with current user ID
       const user = this.manager.auth().getUser();
       storage.set('notifications', {
-        ...storedNotification,
+        subscribed: true,
+        token: currentToken,
         uid: user?.uid || null,
-        timestamp: new Date().toISOString()
+        timestamp: new Date().toISOString(),
       });
 
+      console.log('[WM:push:sync] Sync complete — subscribed');
       return true;
     } catch (error) {
-      console.error('Sync subscription error:', error);
+      console.error('[WM:push:sync] Sync error:', error);
       return false;
     }
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "web-manager",
-  "version": "4.2.0",
+  "version": "4.3.1",
   "description": "Easily access important variables such as the query string, current domain, and current page in a single object.",
   "main": "dist/index.js",
   "module": "src/index.js",
@@ -43,14 +43,14 @@
     "@sentry/browser": "Resolved by using OVERRIDES in web-manager (lighthouse is the issue"
   },
   "dependencies": {
-    "@sentry/browser": "^10.52.0",
+    "@sentry/browser": "^10.54.0",
     "chatsy": "^2.0.14",
     "firebase": "^12.13.0",
     "itwcw-package-analytics": "^1.0.8",
     "lodash": "^4.18.1"
   },
   "devDependencies": {
-    "mocha": "^11.7.5",
+    "mocha": "^11.7.6",
     "prepare-package": "^2.1.0"
   }
 }