@networkpro/web 1.20.0 → 1.21.0

package/CHANGELOG.md

@@ -22,6 +22,30 @@ This project attempts to follow [Keep a Changelog](https://keepachangelog.com/en
 
 ---
 
+## [1.21.0] - 2025-10-17
+
+### Added
+
+- Introduced modular analytics initializer at `src/lib/utils/initAnalytics.js` to handle PostHog tracking, asset preloading, and cleanup logic.
+
+### Changed
+
+- Bumped project version to `v1.21.0`.
+- Added `pageleave` to `cspell.json` to support custom PostHog events.
+- Expanded `lint` script in `package.json` to include `.cjs` files.
+- Updated `src/service-worker.js` to correctly exclude `security.txt.sig` from caching.
+- Refactored `+layout.svelte` to use the new `initAnalytics.js` utility for cleaner side-effect management.
+- Updated fallback meta description logic in both `+layout.svelte` and `+layout.js`.
+- Adjusted `"purpose"` value in `static/manifest.json` from `"any maskable"` to `"maskable"` for improved PWA icon support.
+- Increased spacing before contact info in `src/lib/pages/HomeContent.svelte`.
+- Enhanced `registerServiceWorker.js` to skip SW registration in Firefox during development, preventing known `/@fs/` path evaluation errors.
+- Integrated automatic cleanup of existing service workers in `registerServiceWorker.js` when running in Firefox + dev mode.
+- Improved logging clarity in `registerServiceWorker.js` to better distinguish SW lifecycle behavior by environment.
+- Updated `unregisterServiceWorker.js` to include scoped SW logging when unregistering.
+- Refactored `posthog.js` to add conditional guards for suppressing noisy analytics errors in development mode.
+
+---
+
 ## [1.20.0] - 2025-10-17
 
 ### Added
@@ -1121,7 +1145,8 @@ This project attempts to follow [Keep a Changelog](https://keepachangelog.com/en
 
 <!-- Link references -->
 
-[Unreleased]: https://github.com/netwk-pro/netwk-pro.github.io/compare/v1.20.0...HEAD
+[Unreleased]: https://github.com/netwk-pro/netwk-pro.github.io/compare/v1.21.0...HEAD
+[1.21.0]: https://github.com/netwk-pro/netwk-pro.github.io/releases/tag/v1.21.0
 [1.20.0]: https://github.com/netwk-pro/netwk-pro.github.io/releases/tag/v1.20.0
 [1.19.0]: https://github.com/netwk-pro/netwk-pro.github.io/releases/tag/v1.19.0
 [1.18.5]: https://github.com/netwk-pro/netwk-pro.github.io/releases/tag/v1.18.5

package/cspell.json

@@ -61,6 +61,7 @@
     "obtainium",
     "openpgp",
     "opgp",
+    "pageleave",
     "pallyy",
     "posthog",
     "precaching",

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@networkpro/web",
   "private": false,
-  "version": "1.20.0",
+  "version": "1.21.0",
   "description": "Locking Down Networks, Unlocking Confidence™ | Security, Networking, Privacy — Network Pro Strategies",
   "keywords": [
     "advisory",
@@ -63,11 +63,11 @@
     "coverage:client": "node scripts/openReport.js client",
     "coverage:server": "node scripts/openReport.js server",
     "coverage:open": "npm run coverage:client && npm run coverage:server",
-    "lint": "eslint . --ext .mjs,.js,.svelte",
-    "lint:fix": "eslint . --ext .mjs,.js,.svelte --fix",
-    "lint:jsdoc": "eslint . --ext .js,.mjs,.svelte --max-warnings=0",
+    "lint": "eslint . --ext .js,.cjs,.mjs,.svelte",
+    "lint:fix": "eslint . --ext .js,.cjs,.mjs,.svelte --fix",
+    "lint:jsdoc": "eslint . --ext .js,.cjs,.mjs,.svelte --max-warnings=0",
     "lint:css": "stylelint \"**/*.{css,svelte}\" --ignore-path .stylelintignore",
-    "lint:md": "npx markdownlint-cli2 \"**/*.{md,markdown}\" \"#node_modules/**\" \"#build/**\" \"#playwright-report/**\" \"#test-results/**\"",
+    "lint:md": "npx markdownlint-cli2 \"**/*.{md,markdown}\" \"#node_modules/**\" \"#playwright-report/**\" \"#test-results/**\"",
     "lint:all": "npm run lint && npm run lint:md && npm run lint:css && npm run format",
     "format": "prettier --check .",
     "format:fix": "prettier --write .",

package/src/lib/pages/HomeContent.svelte

@@ -69,6 +69,8 @@ This file is part of Network Pro.
   </em>
 </p>
 
+<div class="spacer"></div>
+
 <p class={classCenter}>
   <strong>{COMPANY_INFO.NAME}</strong><br />
   📞 <strong>Phone:</strong>

package/src/lib/registerServiceWorker.js

@@ -6,7 +6,7 @@ SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.
 ========================================================================== */
 
-// cspell:ignore nosw beforeinstallprompt
+import { unregisterServiceWorker } from '$lib/unregisterServiceWorker';
 
 /**
  * Registers the service worker and handles update lifecycle, install prompt,
@@ -34,11 +34,11 @@ export function registerServiceWorker() {
 
   if ('serviceWorker' in navigator) {
     const isFirefox = navigator.userAgent.includes('Firefox');
-    const isDevelopment =
-      location.hostname === 'localhost' || location.hostname === '127.0.0.1';
+    const isDevMode = import.meta.env.MODE === 'development';
 
-    if (isFirefox && isDevelopment) {
-      console.log('🛑 SW registration skipped in Firefox development mode');
+    if (isFirefox && isDevMode) {
+      console.info('[SW] Dev mode in Firefox — unregistering existing service workers.');
+      unregisterServiceWorker();
       return;
     }
 
@@ -107,3 +107,5 @@ export function registerServiceWorker() {
     });
   }
 }
+
+// cspell:ignore nosw beforeinstallprompt

package/src/lib/stores/posthog.js

@@ -42,40 +42,50 @@ let ph = null;
  */
 export async function initPostHog() {
   if (initialized || typeof window === 'undefined') return;
+  const isDev = import.meta.env.MODE === 'development';
+  if (isDev) {
+    console.info('[PostHog] Skipping init in development mode.');
+    return;
+  }
+
   initialized = true;
 
   const { enabled } = get(trackingPreferences);
   trackingEnabled.set(enabled);
-  showReminder.set(get(remindUserToReconsent)); // ✅ use derived store instead
+  showReminder.set(get(remindUserToReconsent)); // use derived store instead
 
   if (!enabled) {
     console.log('[PostHog] Tracking is disabled — skipping init.');
     return;
   }
 
-  const posthogModule = await import('posthog-js');
-  ph = posthogModule.default;
-
-  // cspell:disable-next-line
-  ph.init('phc_Qshfo6AXzh4pS7aPigfqyeo4qj1qlyh7gDuHDeVMSR0', {
-    api_host: '/relay-MSR0/',
-    ui_host: 'https://us.posthog.com',
-    autocapture: true,
-    capture_pageview: false,
-    person_profiles: 'identified_only',
-    loaded: (phInstance) => {
-      if (!enabled) {
-        console.log(
-          '[PostHog] ⛔ User opted out — calling opt_out_capturing()',
-        );
-        phInstance.opt_out_capturing();
-      } else {
-        console.log('[PostHog] ✅ Tracking enabled');
-      }
-    },
-  });
-
-  ph.capture('$pageview');
+  try {
+    const posthogModule = await import('posthog-js');
+    ph = posthogModule.default;
+
+    // cspell:disable-next-line
+    ph.init('phc_Qshfo6AXzh4pS7aPigfqyeo4qj1qlyh7gDuHDeVMSR0', {
+      api_host: '/relay-MSR0/',
+      ui_host: 'https://us.posthog.com',
+      autocapture: true,
+      capture_pageview: false,
+      person_profiles: 'identified_only',
+      loaded: (phInstance) => {
+        if (!enabled) {
+          console.log(
+            '[PostHog] ⛔ User opted out — calling opt_out_capturing()',
+          );
+          phInstance.opt_out_capturing();
+        } else {
+          console.log('[PostHog] ✅ Tracking enabled');
+        }
+      },
+    });
+
+    ph.capture('$pageview');
+  } catch (err) {
+    console.warn('[PostHog] Failed to initialize:', err);
+  }
 }
 
 /**
@@ -84,8 +94,13 @@ export async function initPostHog() {
  * @param {Record<string, any>} [properties={}] - Optional event properties
  */
 export function capture(event, properties = {}) {
-  if (ph !== null && get(trackingEnabled)) {
+  const isDev = import.meta.env.MODE === 'development';
+  if (isDev || ph === null || !get(trackingEnabled)) return;
+
+  try {
     ph.capture(event, properties);
+  } catch (err) {
+    console.warn(`[PostHog] capture(${event}) failed:`, err);
   }
 }
 
@@ -95,8 +110,13 @@ export function capture(event, properties = {}) {
  * @param {Record<string, any>} [properties={}] - Optional user traits
  */
 export function identify(id, properties = {}) {
-  if (ph !== null && get(trackingEnabled)) {
+  const isDev = import.meta.env.MODE === 'development';
+  if (isDev || ph === null || !get(trackingEnabled)) return;
+
+  try {
     ph.identify(id, properties);
+  } catch (err) {
+    console.warn(`[PostHog] identify(${id}) failed:`, err);
   }
 }
 

package/src/lib/unregisterServiceWorker.js

@@ -8,12 +8,20 @@ This file is part of Network Pro.
 
 /**
  * Allows for manual toggling of the service worker
+ * DEV USE ONLY
+ * @internal
  */
 export function unregisterServiceWorker() {
   if ('serviceWorker' in navigator) {
     navigator.serviceWorker.getRegistrations().then((registrations) => {
-      registrations.forEach((reg) => reg.unregister());
-      console.log('🧹 All service workers unregistered.');
+      if (registrations.length === 0) {
+        console.log('🧼 No service workers to unregister.');
+      } else {
+        registrations.forEach((reg) => {
+          console.log(`🧹 Unregistering SW: ${reg.scope}`);
+          reg.unregister();
+        });
+      }
     });
   }
 }

package/src/lib/utils/initAnalytics.js

@@ -0,0 +1,75 @@
+/* ==========================================================================
+src/lib/utils/initAnalytics.js
+
+Copyright © 2025 Network Pro Strategies (Network Pro™)
+SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
+This file is part of Network Pro.
+========================================================================== */
+
+/**
+ * @file initAnalytics.js
+ * @description Helper utility for initializing analytics.
+ *
+ * @module src/lib/utils
+ * @author Scott Lopez
+ * @updated 2025-10-17
+ */
+
+import { browser } from '$app/environment';
+import { afterNavigate } from '$app/navigation';
+import { appleTouchIcon, faviconSvg, logoPng, logoWbp } from '$lib';
+import { registerServiceWorker } from '$lib/registerServiceWorker.js';
+import { capture, initPostHog } from '$lib/stores/posthog';
+
+/**
+ * Initializes analytics and telemetry (e.g., PostHog tracking, asset preload).
+ * Should be called once per app mount (e.g., from +layout.svelte).
+ *
+ * @returns {() => void} Cleanup function to unregister global event listeners
+ */
+export function initAnalytics() {
+  if (!browser) return () => {};
+
+  console.log('[APP] initAnalytics() running');
+
+  registerServiceWorker();
+  initPostHog();
+
+  afterNavigate(() => {
+    capture('$pageview');
+  });
+
+  // Track $pageleave
+  let hasFiredLeave = false;
+  const sendPageLeave = () => {
+    if (hasFiredLeave) return;
+    hasFiredLeave = true;
+    capture('$pageleave');
+  };
+
+  window.addEventListener('pagehide', sendPageLeave);
+  window.addEventListener('beforeunload', sendPageLeave);
+
+  // Debug toggle logic
+  const isDev = import.meta.env.MODE === 'development';
+  const urlParams = new URLSearchParams(window.location.search);
+  const debug = urlParams.get('debug') === 'true';
+
+  if (isDev || debug) {
+    console.log('ENV MODE =', import.meta.env.MODE);
+    console.log('isDev =', isDev);
+    console.log('debug param =', debug);
+  }
+
+  // Preload logo assets
+  [logoPng, logoWbp, faviconSvg, appleTouchIcon].forEach((src) => {
+    const img = new Image();
+    img.src = src;
+  });
+
+  // Clean up listeners when component is destroyed
+  return () => {
+    window.removeEventListener('pagehide', sendPageLeave);
+    window.removeEventListener('beforeunload', sendPageLeave);
+  };
+}

package/src/routes/+layout.js

@@ -21,7 +21,7 @@ import { meta as routeMeta } from '$lib/meta.js'; // Import meta from $lib/meta.
 const fallbackMeta = {
   title: 'Security, Networking, Privacy — Network Pro™',
   description:
-    'Locking Down Networks, Unlocking Confidence™ | Security, Networking, Privacy — Network Pro™',
+    'Locking Down Networks, Unlocking Confidence™ | Security, Networking, Privacy — Network Pro Strategies',
 };
 
 export const prerender = 'auto';

package/src/routes/+layout.svelte

@@ -10,13 +10,11 @@ This file is part of Network Pro.
   export let data;
 
   import { onMount } from 'svelte';
-  import { afterNavigate } from '$app/navigation';
-  import { initPostHog, showReminder, capture } from '$lib/stores/posthog';
-  import { registerServiceWorker } from '$lib/registerServiceWorker.js';
-  import { browser } from '$app/environment';
-  import { logoPng, logoWbp, faviconSvg, appleTouchIcon } from '$lib';
+  import { initAnalytics } from '$lib/utils/initAnalytics';
+  import { showReminder } from '$lib/stores/posthog';
   import { ContainerSection, PWAInstallButton } from '$lib/components';
   import { Footer, HeaderDefault, HeaderHome } from '$lib/components/layout';
+  import { appleTouchIcon, faviconSvg, logoPng, logoWbp } from '$lib';
 
   import '$lib/styles/global.min.css';
   import '$lib/styles/fa-global.css';
@@ -24,35 +22,8 @@ This file is part of Network Pro.
   $: shouldShowReminder = $showReminder;
 
   onMount(() => {
-    console.log('[APP] onMount triggered in +layout.svelte');
-
-    registerServiceWorker();
-    initPostHog();
-
-    // Register navigation tracking only on client
-    afterNavigate(() => {
-      capture('$pageview');
-    });
-
-    if (browser) {
-      const isDev = import.meta.env.MODE === 'development';
-
-      // Check for ?debug=true in URL (no persistence)
-      const urlParams = new URLSearchParams(window.location.search);
-      const debug = urlParams.get('debug') === 'true';
-
-      if (isDev || debug) {
-        console.log('ENV MODE =', import.meta.env.MODE);
-        console.log('isDev =', isDev);
-        console.log('debug param =', debug);
-      }
-
-      // Preload logo assets
-      [logoPng, logoWbp, appleTouchIcon].forEach((src) => {
-        const img = new Image();
-        img.src = src;
-      });
-    }
+    const cleanup = initAnalytics();
+    return cleanup;
   });
 
   // fallback values if data.meta not set
@@ -60,7 +31,7 @@ This file is part of Network Pro.
     data?.meta?.title || 'Security, Networking, Privacy — Network Pro™';
   const metaDescription =
     data?.meta?.description ||
-    'Locking Down Networks, Unlocking Confidence™ | Security, Networking, Privacy — Network Pro™';
+    'Locking Down Networks, Unlocking Confidence™ | Security, Networking, Privacy — Network Pro Strategies';
 </script>
 
 <svelte:head>

package/src/service-worker.js

@@ -28,7 +28,7 @@ const CACHE = `cache-${version}`;
 const excludedAssets = [];
 
 const IGNORE_PATHS = new Set([
-  '/.well-known/security.txt.asc',
+  '/.well-known/security.txt.sig',
   '/img/banner-1280x640.png',
   '/img/logo-transparent.png',
   '/img/logo.png',

package/static/manifest.json

@@ -27,7 +27,7 @@
       "src": "/icon-512x512-maskable.png",
       "type": "image/png",
       "sizes": "512x512",
-      "purpose": "any maskable"
+      "purpose": "maskable"
     },
     {
       "src": "/icon-splash.png",