feat: dynamically set PWA start_url

apps/client/index.html

@@ -9,8 +9,7 @@
     <meta name="ontime" content="ontime - time keeping for live events" />
     <link rel="apple-touch-icon" href="/ontime-logo.png" />
     <link rel="icon" type="image/png" href="/ontime-logo.png" />
-    <link rel="manifest" href="/site.webmanifest" />
-    <link rel="manifest" href="/manifest.json" />
+    <link rel="manifest" href="/manifest.webmanifest" />
     <meta name="robots" content="noindex" />
     <title>ontime</title>
     <style>

apps/client/public/manifest.webmanifest

@@ -0,0 +1,15 @@
+{
+  "name": "ontime",
+  "short_name": "ontime",
+  "icons": [
+    {
+      "src": "/ontime-logo.png",
+      "sizes": "295x295",
+      "type": "image/png"
+    }
+  ],
+  "scope": "/",
+  "display": "standalone",
+  "theme_color": "#2B5ABC",
+  "background_color": "#101010"
+}

apps/server/src/app.ts

@@ -8,6 +8,8 @@ import serverTiming from 'server-timing';
 import cookieParser from 'cookie-parser';
 
 // import utils
+import { readFileSync } from 'node:fs';
+import { join } from 'node:path';
 import { publicDir, srcDir } from './setup/index.js';
 import { environment, isProduction } from './setup/environment.js';
 import { updateRouterPrefix } from './externals.js';
@@ -98,6 +100,23 @@ app.use(`${prefix}/user`, express.static(publicDir.userDir, { etag: false, lastM
 
 // Base route for static files
 app.use(`${prefix}`, authenticateAndRedirect, compressedStatic);
+
+app.get(`${prefix}/manifest.webmanifest`, (req, res) => {
+  // get the referer, if it doesnt exist, we send the default manifest
+  const referer = req.headers.referer || '/';
+
+  // read the manifest file
+  const manifest = JSON.parse(
+    readFileSync(join(publicDir.root, 'manifest.webmanifest'), 'utf-8'),
+  );
+
+  // set the start_url to the referer
+  manifest.start_url = referer;
+
+  // send the manifest
+  res.json(manifest);
+});
+
 app.use(`${prefix}/*splat`, authenticateAndRedirect, compressedStatic);
 
 // Implement catch all

e2e/tests/features/214-pwa-install.spec.ts

@@ -0,0 +1,37 @@
+import { test, expect } from '@playwright/test';
+
+test('manifest start_url is correct for cuesheet', async ({ page }) => {
+  await page.goto('/cuesheet');
+  const manifestUrl = await page.evaluate(() => {
+    const link = document.querySelector('link[rel="manifest"]');
+    if (!link) {
+      return null;
+    }
+    return (link as HTMLLinkElement).href;
+  });
+
+  expect(manifestUrl).not.toBeNull();
+
+  const response = await page.request.get(manifestUrl!);
+  const manifest = await response.json();
+
+  expect(manifest.start_url).toContain('/cuesheet');
+});
+
+test('manifest start_url is correct for op', async ({ page }) => {
+  await page.goto('/op');
+  const manifestUrl = await page.evaluate(() => {
+    const link = document.querySelector('link[rel="manifest"]');
+    if (!link) {
+      return null;
+    }
+    return (link as HTMLLinkElement).href;
+  });
+
+  expect(manifestUrl).not.toBeNull();
+
+  const response = await page.request.get(manifestUrl!);
+  const manifest = await response.json();
+
+  expect(manifest.start_url).toContain('/op');
+});

package.json

@@ -51,5 +51,8 @@
     "turbo": "^2.3.3",
     "typescript": "catalog:"
   },
-  "packageManager": "pnpm@10.11.0+sha512.6540583f41cc5f628eb3d9773ecee802f4f9ef9923cc45b69890fb47991d4b092964694ec3a4f738a420c918a333062c8b925d312f42e4f0c263eb603551f977"
+  "packageManager": "pnpm@10.11.0+sha512.6540583f41cc5f628eb3d9773ecee802f4f9ef9923cc45b69890fb47991d4b092964694ec3a4f738a420c918a333062c8b925d312f42e4f0c263eb603551f977",
+  "dependencies": {
+    "tsx": "^4.20.3"
+  }
 }