Resolve GA issues

package.json

@@ -8,9 +8,9 @@
         "build": "vite build && node scripts/minify-static-assets.mjs && node scripts/externalize-inline-script.mjs",
         "build:bio": "CONTENT_VARIANT=bio vite build && node scripts/minify-static-assets.mjs && node scripts/externalize-inline-script.mjs",
         "build:dev": "CONTENT_VARIANT=dev vite build && node scripts/minify-static-assets.mjs && node scripts/externalize-inline-script.mjs",
-        "build:full": "vite build && pnpm run critical-css && node scripts/minify-static-assets.mjs && node scripts/externalize-inline-script.mjs",
-        "build:full:bio": "CONTENT_VARIANT=bio vite build && pnpm run critical-css && node scripts/minify-static-assets.mjs && node scripts/externalize-inline-script.mjs",
-        "build:full:dev": "CONTENT_VARIANT=dev vite build && pnpm run critical-css && node scripts/minify-static-assets.mjs && node scripts/externalize-inline-script.mjs",
+        "build:full": "vite build && node scripts/minify-static-assets.mjs && node scripts/externalize-inline-script.mjs && pnpm run critical-css",
+        "build:full:bio": "CONTENT_VARIANT=bio vite build && node scripts/minify-static-assets.mjs && node scripts/externalize-inline-script.mjs && pnpm run critical-css",
+        "build:full:dev": "CONTENT_VARIANT=dev vite build && node scripts/minify-static-assets.mjs && node scripts/externalize-inline-script.mjs && pnpm run critical-css",
         "preview": "vite preview",
         "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
         "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
@@ -65,7 +65,7 @@
     "dependencies": {
         "@lucide/svelte": "^0.563.1"
     },
-    "packageManager": "pnpm@10.28.2",
+    "packageManager": "pnpm@10.29.1+sha512.48dae233635a645768a3028d19545cacc1688639eeb1f3734e42d6d6b971afbf22aa1ac9af52a173d9c3a20c15857cfa400f19994d79a2f626fcc73fccda9bbc",
     "repository": {
         "type": "git",
         "url": "https://git.mifi.dev/mifi-holdings/mifi-links.git"

scripts/critical-css.mjs

@@ -6,23 +6,57 @@
  * Usage: node scripts/critical-css.mjs [buildDir]
  *   buildDir: path to build output (default: "build"). Use from repo root.
  */
-import { readFileSync, writeFileSync } from 'node:fs';
+import { existsSync, readdirSync, readFileSync, writeFileSync } from 'node:fs';
+import { homedir, platform } from 'node:os';
 import { join } from 'node:path';
 import { cwd } from 'node:process';
 
 const buildDir = join(cwd(), process.argv[2] || 'build');
 const htmlPath = join(buildDir, 'index.html');
 
-// critical/penthouse use a nested puppeteer; point it at our installed Chrome
+// critical/penthouse use a nested puppeteer; point at an installed Chrome/Chromium.
+// Only set PUPPETEER_EXECUTABLE_PATH if the path exists. Prefer Playwright's Chromium
+// on arm64 so we use the native binary (Puppeteer's default can be x86 on ARM hosts e.g. OrbStack).
+function getPlaywrightChromePath() {
+    const cacheBase =
+        process.env.PLAYWRIGHT_BROWSERS_PATH || join(homedir(), '.cache', 'ms-playwright');
+    if (!existsSync(cacheBase)) return null;
+    const dirs = readdirSync(cacheBase, { withFileTypes: true });
+    for (const d of dirs) {
+        if (!d.isDirectory() || !d.name.startsWith('chromium-')) continue;
+        const sub = join(cacheBase, d.name);
+        const rel =
+            platform() === 'win32'
+                ? 'chrome-win\\chrome.exe'
+                : platform() === 'darwin'
+                  ? 'chrome-mac/Chromium.app/Contents/MacOS/Chromium'
+                  : 'chrome-linux/chrome';
+        const candidate = join(sub, rel);
+        if (existsSync(candidate)) return candidate;
+    }
+    return null;
+}
+async function resolveChromePath() {
+    const isArm64 = process.arch === 'arm64';
+    if (isArm64) {
+        const pw = getPlaywrightChromePath();
+        if (pw) return pw;
+    }
     try {
         const puppeteer = await import('puppeteer');
-    const executablePath = puppeteer.default?.executablePath?.();
-    if (executablePath) {
-        process.env.PUPPETEER_EXECUTABLE_PATH = executablePath;
-    }
+        const path = puppeteer.default?.executablePath?.();
+        if (path && existsSync(path)) return path;
     } catch {
-    // no top-level puppeteer or no executable; rely on env or default
+        // ignore
     }
+    if (!isArm64) {
+        const pw = getPlaywrightChromePath();
+        if (pw) return pw;
+    }
+    return null;
+}
+const chromePath = await resolveChromePath();
+if (chromePath) process.env.PUPPETEER_EXECUTABLE_PATH = chromePath;
 
 try {
     const { generate } = await import('critical');
@@ -45,9 +79,16 @@ try {
 } catch (err) {
     const msg = err instanceof Error ? err.message : String(err);
     console.error('Critical CSS step failed:', msg);
-    if (msg.includes('Browser is not downloaded')) {
+    if (
+        msg.includes('Browser is not downloaded') ||
+        msg.includes('did not find any executable') ||
+        msg.includes('Could not find Chrome')
+    ) {
         console.error('Install Chromium first: pnpm run critical-css:install');
-        console.error('Or run "pnpm run build" without critical CSS.');
+        console.error(
+            '(Dev container: Playwright Chromium is also used if present in ~/.cache/ms-playwright.)',
+        );
+        console.error('Or run "pnpm run build" (without critical CSS) for a working build.');
     }
     process.exit(1);
 }

scripts/minify-static-assets.mjs

@@ -1,5 +1,6 @@
 /**
  * Post-build: minify JS and CSS under build/assets (files copied from static/).
+ * Includes static/assets/js/*.js (e.g. ga-init.js, bootstrap.js) and assets/*.css.
  * Usage: node scripts/minify-static-assets.mjs [buildDir]
  */
 import { existsSync, readdirSync, readFileSync, writeFileSync } from 'node:fs';

src/app.html

@@ -3,6 +3,7 @@
     <head>
         <meta charset="utf-8" />
         <meta name="viewport" content="width=device-width, initial-scale=1" />
+
         <script src="/assets/js/bootstrap.js"></script>
         %sveltekit.head%
     </head>

src/routes/+layout.svelte

@@ -37,6 +37,10 @@
 </script>
 
 <svelte:head>
+    <!-- Google tag (gtag.js): ID passed via data-ga-id for CSP (no inline script) -->
+    <script async src="https://www.googletagmanager.com/gtag/js?id={data.gaMeasurementId}"></script>
+    <script defer src="/assets/js/ga-init.js" data-ga-id={data.gaMeasurementId}></script>
+
     <link rel="stylesheet" href="/assets/tokens-{data.variant}.css" />
 
     <link

static/assets/js/ga-init.js

@@ -0,0 +1,11 @@
+(function () {
+    var script = document.currentScript;
+    var id = script && script.getAttribute('data-ga-id');
+    if (!id) return;
+    window.dataLayer = window.dataLayer || [];
+    function gtag() {
+        window.dataLayer.push(arguments);
+    }
+    gtag('js', new Date());
+    gtag('config', id, { anonymize_ip: true });
+})();