From 104db110c906582bf6f662ac7d3c7141e8d55764 Mon Sep 17 00:00:00 2001
From: dborup <kontakt@meshview.dk>
Date: Sun, 4 Oct 2026 06:37:52 +0000
Subject: [PATCH 1/2] test(analytics): reproduce Scopes/Wardriving view state
 missing from the URL (#205)

Unit tests (vm harness) and a Playwright E2E for ?sub=, ?swin= and
?wdwin=: URL wins over sessionStorage, unknown values fall back to the
defaults, default URLs unchanged, clicks write the URL, reload and
back/forward restore the view. Red on master.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .github/workflows/deploy.yml                  |   1 +
 test-all.sh                                   |   1 +
 test-analytics-subtab-deeplinks-205.js        | 535 ++++++++++++++++++
 ...ssue-205-analytics-subtab-deeplinks-e2e.js | 203 +++++++
 4 files changed, 740 insertions(+)
 create mode 100644 test-analytics-subtab-deeplinks-205.js
 create mode 100644 test-issue-205-analytics-subtab-deeplinks-e2e.js

diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
index bc13dfdaa..a4528b4e3 100644
--- a/.github/workflows/deploy.yml
+++ b/.github/workflows/deploy.yml
@@ -495,6 +495,7 @@ jobs:
           CHROMIUM_REQUIRE=1 BASE_URL=http://localhost:13581 node test-drag-manager-e2e.js 2>&1 | tee -a e2e-output.txt
           CHROMIUM_REQUIRE=1 BASE_URL=http://localhost:13581 node test-issue-1567-corner-clears-drag-e2e.js 2>&1 | tee -a e2e-output.txt
           CHROMIUM_REQUIRE=1 BASE_URL=http://localhost:13581 node test-issue-1306-collisions-terminology-e2e.js 2>&1 | tee -a e2e-output.txt
+          CHROMIUM_REQUIRE=1 BASE_URL=http://localhost:13581 node test-issue-205-analytics-subtab-deeplinks-e2e.js 2>&1 | tee -a e2e-output.txt
           CHROMIUM_REQUIRE=1 BASE_URL=http://localhost:13581 node test-issue-1374-route-map-a11y-e2e.js 2>&1 | tee -a e2e-output.txt
           CHROMIUM_REQUIRE=1 BASE_URL=http://localhost:13581 node test-channels-list-render-e2e.js 2>&1 | tee -a e2e-output.txt
           CHROMIUM_REQUIRE=1 BASE_URL=http://localhost:13581 node test-channels-selection-flow-e2e.js 2>&1 | tee -a e2e-output.txt
diff --git a/test-all.sh b/test-all.sh
index edea7f19a..7062e38b4 100755
--- a/test-all.sh
+++ b/test-all.sh
@@ -145,6 +145,7 @@ run test-packet-filter-time.js
 run test-confidence-indicator.js
 run test-1659-analytics-warmup.js
 run test-analytics-tab-state-and-query.js
+run test-analytics-subtab-deeplinks-205.js
 run test-channels-merge-1498-unit.js
 run test-issue-1518-home-url.js
 run test-live-region-filter.js
diff --git a/test-analytics-subtab-deeplinks-205.js b/test-analytics-subtab-deeplinks-205.js
new file mode 100644
index 000000000..15cd65fc4
--- /dev/null
+++ b/test-analytics-subtab-deeplinks-205.js
@@ -0,0 +1,535 @@
+/* test-analytics-subtab-deeplinks-205.js
+ *
+ * #205: the Scopes tab's sub-tab (Overview / Hop Depth / Regions / Hygiene)
+ * and its 1h/24h/7d window, and the Wardriving tab's window, lived only in
+ * sessionStorage, so a link to e.g. Hop Depth could not be shared. They are
+ * now in the hash next to ?tab=:
+ *
+ *   sub=<overview|hopdepth|regions|hygiene>   Scopes sub-tab
+ *   swin=<1h|24h|7d>                          Scopes window
+ *   wdwin=<1h|24h|7d>                         Wardriving window
+ *
+ * (?window= stays the global analytics time picker; it has other values and
+ * drives the shared loads, so the tabs get keys of their own.)
+ *
+ * Contract pinned here:
+ * - a URL value wins over sessionStorage, and is stored for the next plain
+ *   visit of the tab;
+ * - without a URL value the stored value is used and written to the URL;
+ * - an unknown or hostile URL value falls back to the default (never to the
+ *   stored value), never throws and never reaches a selector (#193/#194);
+ * - the default view keeps today's URL (no sub/swin/wdwin);
+ * - clicks write the URL; switching to another tab drops these keys.
+ *
+ * Runs the REAL app.js api(), url-state.js and analytics page in one vm with
+ * a fake fetch and a small fake DOM whose buttons come from the markup the
+ * page writes.
+ */
+'use strict';
+
+const vm = require('vm');
+const fs = require('fs');
+const assert = require('assert');
+
+let passed = 0, failed = 0;
+function test(name, fn) {
+  return Promise.resolve()
+    .then(fn)
+    .then(() => { passed++; console.log('  ✅ ' + name); })
+    .catch((e) => { failed++; console.log('  ❌ ' + name + ': ' + (e && e.message || e)); });
+}
+
+// Real responses of the CI fixture server for the shared endpoints (#172).
+const REAL = JSON.parse(fs.readFileSync('test-fixtures/analytics-tabs-172.json', 'utf8'));
+
+const flush = async () => { for (let i = 0; i < 30; i++) await new Promise((r) => setImmediate(r)); };
+
+function fakeClassList(initial) {
+  const s = new Set(initial);
+  return {
+    add: (c) => s.add(c), remove: (c) => s.delete(c), contains: (c) => s.has(c),
+    toggle: (c, on) => { if (on === undefined ? !s.has(c) : on) s.add(c); else s.delete(c); },
+  };
+}
+
+const camel = (s) => s.replace(/-([a-z])/g, (_, c) => c.toUpperCase());
+
+// A fake element whose querySelector('#id') / querySelectorAll('[data-x]')
+// answer from the markup written to it, so the listeners the page attaches
+// are kept on the same button objects the test clicks.
+function fakeEl(id, byId) {
+  let html = '';
+  let listCache = {};
+  const listeners = {};
+  const self = {
+    id, value: '', style: {}, dataset: {}, parentElement: null,
+    get innerHTML() { return html; },
+    set innerHTML(v) { html = String(v); listCache = {}; },
+    classList: fakeClassList([]),
+    addEventListener(type, fn) { (listeners[type] = listeners[type] || []).push(fn); }, removeEventListener() {},
+    dispatch(type, ev) { for (const fn of listeners[type] || []) fn(ev); },
+    contains: () => true, closest: () => null,
+    querySelector(sel) {
+      const m = /^#([\w-]+)$/.exec(sel);
+      if (m && html.indexOf('id="' + m[1] + '"') >= 0) return byId(m[1]);
+      return null;
+    },
+    querySelectorAll(sel) {
+      const m = /^\[(data-[\w-]+)\]$/.exec(sel);
+      if (!m) return [];
+      if (!listCache[sel]) {
+        const re = new RegExp('<button class="tab-btn( active)?" ' + m[1] + '="([^"]*)"', 'g');
+        const out = [];
+        let r;
+        while ((r = re.exec(html))) {
+          const b = fakeEl('', byId);
+          b.dataset[camel(m[1].slice(5))] = r[2];
+          b.classList = fakeClassList(r[1] ? ['active'] : []);
+          b.closest = () => b;
+          out.push(b);
+        }
+        listCache[sel] = out;
+      }
+      return listCache[sel];
+    },
+    appendChild: (c) => c, insertBefore: (c) => c, setAttribute() {}, getAttribute: () => null, removeAttribute() {},
+  };
+  return self;
+}
+
+function storage(initial) {
+  const s = Object.assign({}, initial || {});
+  return {
+    data: s,
+    getItem: (k) => (Object.prototype.hasOwnProperty.call(s, k) ? s[k] : null),
+    setItem: (k, v) => { s[k] = String(v); },
+    removeItem: (k) => { delete s[k]; },
+  };
+}
+
+function pageEnv(opts) {
+  opts = opts || {};
+  const fetchLog = [];
+  const respond = (body) => ({
+    ok: true, status: 200, headers: { get: () => null },
+    json: async () => JSON.parse(JSON.stringify(body)),
+  });
+  const fetchImpl = async (url) => {
+    fetchLog.push(url);
+    const m = /\/api\/analytics\/(rf|topology|channels|hash-sizes|hash-collisions)(\?|$)/.exec(url);
+    const key = m && { rf: 'rfData', topology: 'topoData', channels: 'chanData', 'hash-sizes': 'hashData', 'hash-collisions': 'collisionData' }[m[1]];
+    return respond(key ? REAL[key] : {});
+  };
+
+  let els = {};
+  const byId = (id) => el(id);
+  const app = fakeEl('app', byId);
+  let appHtml = '';
+  Object.defineProperty(app, 'innerHTML', {
+    get: () => appHtml,
+    set: (v) => { appHtml = String(v); els = {}; buttons = null; },
+  });
+  let buttons = null;
+  const tabButtons = () => {
+    if (!buttons) {
+      buttons = [];
+      const re = /<button class="tab-btn( active)?" data-tab="([^"]+)"/g;
+      let m;
+      while ((m = re.exec(appHtml))) {
+        buttons.push({ dataset: { tab: m[2] }, classList: fakeClassList(m[1] ? ['active'] : []), setAttribute() {} });
+      }
+    }
+    return buttons;
+  };
+  function el(id) {
+    if (id === 'app') return app;
+    if (!els[id]) {
+      els[id] = fakeEl(id, byId);
+      if (id === 'analyticsTabs') els[id].querySelectorAll = (sel) => (sel === '.tab-btn' ? tabButtons() : []);
+    }
+    return els[id];
+  }
+
+  const hashLog = [];
+  const pages = {};
+  let initError = null;
+  const ctx = {
+    window: { addEventListener() {}, removeEventListener() {}, dispatchEvent() {} },
+    document: {
+      readyState: 'complete', body: { appendChild() {} }, head: { appendChild() {} },
+      createElement: () => fakeEl('', byId), getElementById: el, addEventListener() {},
+      querySelectorAll: (sel) => (sel === '.tab-btn' ? tabButtons() : []), querySelector: () => null,
+      documentElement: fakeEl('html', byId),
+    },
+    console: { log() {}, warn() {}, error() {} }, Date, Infinity, Math, Array, Object, String, Number,
+    JSON, RegExp, Error, TypeError, parseInt, parseFloat, isNaN, isFinite, encodeURIComponent, decodeURIComponent,
+    setTimeout: () => 0, clearTimeout() {}, setInterval: () => 0, clearInterval() {},
+    requestAnimationFrame: () => 0, cancelAnimationFrame() {},
+    fetch: fetchImpl, performance: { now: () => 0 },
+    localStorage: storage(),
+    sessionStorage: storage(opts.session),
+    location: { hash: '#/analytics' },
+    history: { replaceState(_s, _t, url) { hashLog.push(url); ctx.location.hash = url; } },
+    CustomEvent: class CustomEvent {}, Map, Set, Promise, URLSearchParams,
+    getComputedStyle: () => ({ getPropertyValue: () => '' }),
+    timeAgo: () => 'x ago', initTabBar() {}, makeColumnsResizable() {},
+    onWS() {}, offWS() {}, connectWS() {}, invalidateApiCache() {}, IATA_COORDS_GEO: {},
+    fetchAllNodes: async () => ({ nodes: [] }),
+    RegionFilter: { init() {}, onChange() {}, regionQueryString: () => '' },
+    AreaFilter: { init() {}, onChange() {}, areaQueryString: () => '' },
+  };
+  vm.createContext(ctx);
+  const load = (f) => { vm.runInContext(fs.readFileSync(f, 'utf8'), ctx); for (const k of Object.keys(ctx.window)) ctx[k] = ctx.window[k]; };
+  load('public/payload-labels.js');
+  load('public/roles.js');
+  load('public/url-state.js');
+  try { load('public/app.js'); } catch (e) { /* DOM-only tail */ }
+  ctx.registerPage = (name, obj) => { pages[name] = obj; };   // app.js defines its own
+  ctx.fetchAllNodes = async () => ({ nodes: [] });
+  load('public/analytics.js');
+  const page = pages.analytics;
+
+  const content = () => el('analyticsContent');
+  const activeOf = (attr) => {
+    const re = new RegExp('<button class="tab-btn active" ' + attr + '="([^"]*)"', 'g');
+    const out = [];
+    let m;
+    while ((m = re.exec(content().innerHTML))) out.push(m[1]);
+    return out;
+  };
+
+  return {
+    ctx, fetchLog, hashLog,
+    session: ctx.sessionStorage.data,
+    async mount(hash) {
+      ctx.location.hash = hash;
+      hashLog.length = 0;
+      initError = null;
+      page.init(app).catch((e) => { initError = e; });
+      await flush();
+    },
+    initError: () => initError,
+    destroy: () => page.destroy(),
+    hash: () => ctx.location.hash,
+    params: () => Object.fromEntries(new URLSearchParams(ctx.location.hash.split('?')[1] || '')),
+    clickTab: async (tab) => {
+      const btn = tabButtons().find((b) => b.dataset.tab === tab);
+      el('analyticsTabs').dispatch('click', { target: { closest: () => btn } });
+      await flush();
+    },
+    // Scopes: the active sub-tab button(s), the visible panel(s), the active window button(s).
+    activeSubtabs: () => activeOf('data-subtab'),
+    visiblePanels: () => {
+      const re = /id="scopes-panel-([\w-]+)" style="display:([^"]*)"/g;
+      const out = [];
+      let m;
+      while ((m = re.exec(content().innerHTML))) if (m[2] === '') out.push(m[1]);
+      return out;
+    },
+    activeScopesWindows: () => activeOf('data-win'),
+    activeWardrivingWindows: () => activeOf('data-wdwin'),
+    clickSubtab: async (key) => {
+      const bar = content().querySelector('#scopesSubtabs');
+      assert.ok(bar, 'no #scopesSubtabs');
+      const btn = bar.querySelectorAll('[data-subtab]').find((b) => b.dataset.subtab === key)
+        || { dataset: { subtab: key }, closest() { return this; } };
+      // The bar's buttons live in the content markup; the listener sits on the bar.
+      bar.dispatch('click', { target: { closest: () => btn } });
+      await flush();
+    },
+    clickScopesWindow: async (w) => {
+      const btn = content().querySelectorAll('[data-win]').find((b) => b.dataset.win === w);
+      assert.ok(btn, 'no [data-win="' + w + '"] button');
+      btn.dispatch('click', {});
+      await flush();
+    },
+    clickWardrivingWindow: async (w) => {
+      const btn = content().querySelectorAll('[data-wdwin]').find((b) => b.dataset.wdwin === w);
+      assert.ok(btn, 'no [data-wdwin="' + w + '"] button');
+      btn.dispatch('click', {});
+      await flush();
+    },
+    scopeStatsUrls: () => fetchLog.filter((u) => /\/api\/scope-stats/.test(u)),
+    wardrivingUrls: () => fetchLog.filter((u) => /\/api\/analytics\/wardriving/.test(u)),
+    globalWindow: () => el('analyticsTimeWindow').value,
+    content: () => content().innerHTML,
+    resolveViewParam: ctx._analyticsResolveViewParam,
+  };
+}
+
+(async () => {
+  console.log('\n=== #205: resolveViewParam(urlValue, storedValue, allowed, dflt) ===');
+
+  await test('resolveViewParam is exposed for the test', async () => {
+    assert.strictEqual(typeof pageEnv().resolveViewParam, 'function', 'window._analyticsResolveViewParam missing');
+  });
+
+  const SUBS = ['overview', 'hopdepth', 'regions', 'hygiene'];
+  const RV = [
+    // urlValue, storedValue, expected
+    [null, null, 'overview'],
+    [null, 'regions', 'regions'],
+    [null, 'bogus', 'overview'],
+    [null, '', 'overview'],
+    ['hopdepth', null, 'hopdepth'],
+    ['hopdepth', 'regions', 'hopdepth'],
+    ['bogus', 'regions', 'overview'],
+    ['', 'regions', 'overview'],
+    ['x"]', 'regions', 'overview'],
+    ['x"],[data-subtab="hygiene', null, 'overview'],
+    ['__proto__', null, 'overview'],
+    ['constructor', null, 'overview'],
+    ['HOPDEPTH', null, 'overview'],
+    [' hopdepth', null, 'overview'],
+  ];
+  for (const [u, s, want] of RV) {
+    await test('resolveViewParam(' + JSON.stringify(u) + ', ' + JSON.stringify(s) + ') = ' + JSON.stringify(want), async () => {
+      assert.strictEqual(pageEnv().resolveViewParam(u, s, SUBS, 'overview'), want);
+    });
+  }
+
+  console.log('\n=== #205: Scopes sub-tab from the URL ===');
+
+  for (const sub of SUBS) {
+    await test('#/analytics?tab=scopes&sub=' + sub + ' opens ' + sub, async () => {
+      const env = pageEnv();
+      await env.mount('#/analytics?tab=scopes&sub=' + sub);
+      assert.strictEqual(env.initError(), null, 'init() threw');
+      assert.deepStrictEqual(env.activeSubtabs(), [sub], 'active sub-tab button');
+      assert.deepStrictEqual(env.visiblePanels(), [sub], 'visible panel');
+    });
+  }
+
+  await test('the URL sub-tab wins over sessionStorage and is stored', async () => {
+    const env = pageEnv({ session: { scopes_subtab: 'regions' } });
+    await env.mount('#/analytics?tab=scopes&sub=hygiene');
+    assert.deepStrictEqual(env.activeSubtabs(), ['hygiene']);
+    assert.deepStrictEqual(env.visiblePanels(), ['hygiene']);
+    assert.strictEqual(env.session.scopes_subtab, 'hygiene', 'sessionStorage not updated');
+    assert.strictEqual(env.params().sub, 'hygiene', 'sub= lost');
+  });
+
+  await test('without sub=, the stored sub-tab opens and is written to the URL', async () => {
+    const env = pageEnv({ session: { scopes_subtab: 'regions' } });
+    await env.mount('#/analytics?tab=scopes');
+    assert.deepStrictEqual(env.activeSubtabs(), ['regions']);
+    assert.strictEqual(env.hash(), '#/analytics?tab=scopes&sub=regions');
+  });
+
+  const hostileSubs = ['x"', 'x"],[data-subtab="hygiene', 'hopdepth"]', '\\', '', '__proto__', 'constructor', 'toString', 'Overview', '<img src=x onerror=alert(1)>'];
+  for (const value of hostileSubs) {
+    await test('?sub=' + JSON.stringify(value) + ' falls back to Overview (not the stored sub-tab), no exception', async () => {
+      const env = pageEnv({ session: { scopes_subtab: 'regions' } });
+      await env.mount('#/analytics?tab=scopes&sub=' + encodeURIComponent(value));
+      assert.strictEqual(env.initError(), null, 'init() threw: ' + (env.initError() && env.initError().message));
+      assert.deepStrictEqual(env.activeSubtabs(), ['overview'], 'active sub-tab button');
+      assert.deepStrictEqual(env.visiblePanels(), ['overview'], 'visible panel');
+      assert.strictEqual(env.hash(), '#/analytics?tab=scopes', 'URL not canonical');
+      assert.ok(env.content().indexOf('onerror') < 0, 'URL value reached the markup');
+    });
+  }
+
+  await test('a garbage stored sub-tab falls back to Overview', async () => {
+    const env = pageEnv({ session: { scopes_subtab: 'x"]' } });
+    await env.mount('#/analytics?tab=scopes');
+    assert.deepStrictEqual(env.activeSubtabs(), ['overview']);
+    assert.deepStrictEqual(env.visiblePanels(), ['overview']);
+    assert.strictEqual(env.hash(), '#/analytics?tab=scopes');
+  });
+
+  console.log('\n=== #205: Scopes window from the URL (swin=) ===');
+
+  for (const w of ['1h', '24h', '7d']) {
+    await test('#/analytics?tab=scopes&swin=' + w + ' selects ' + w + ' and loads scope-stats?window=' + w, async () => {
+      const env = pageEnv();
+      await env.mount('#/analytics?tab=scopes&swin=' + w);
+      assert.deepStrictEqual(env.activeScopesWindows(), [w, w], 'active window buttons (Overview + Hop Depth copies)');
+      assert.deepStrictEqual(env.scopeStatsUrls(), ['/api/scope-stats?window=' + w]);
+    });
+  }
+
+  await test('the URL window wins over sessionStorage and is stored', async () => {
+    const env = pageEnv({ session: { scopes_window: '1h' } });
+    await env.mount('#/analytics?tab=scopes&swin=7d');
+    assert.deepStrictEqual(env.scopeStatsUrls(), ['/api/scope-stats?window=7d']);
+    assert.strictEqual(env.session.scopes_window, '7d');
+  });
+
+  await test('without swin=, the stored window is used and written to the URL', async () => {
+    const env = pageEnv({ session: { scopes_window: '1h' } });
+    await env.mount('#/analytics?tab=scopes');
+    assert.deepStrictEqual(env.scopeStatsUrls(), ['/api/scope-stats?window=1h']);
+    assert.strictEqual(env.hash(), '#/analytics?tab=scopes&swin=1h');
+  });
+
+  for (const value of ['30d', '', 'x"]', '__proto__', '24H', '1h&sub=hygiene']) {
+    await test('?swin=' + JSON.stringify(value) + ' falls back to 24h, no exception', async () => {
+      const env = pageEnv({ session: { scopes_window: '1h' } });
+      await env.mount('#/analytics?tab=scopes&swin=' + encodeURIComponent(value));
+      assert.strictEqual(env.initError(), null, 'init() threw');
+      assert.deepStrictEqual(env.activeScopesWindows(), ['24h', '24h']);
+      assert.deepStrictEqual(env.scopeStatsUrls(), ['/api/scope-stats?window=24h']);
+      assert.strictEqual(env.hash(), '#/analytics?tab=scopes');
+    });
+  }
+
+  // Writing one key rebuilds the hash and drops an empty key the next read
+  // would still see, so every key of the tab is read before any is written.
+  for (const hash of ['#/analytics?tab=scopes&swin=&sub=hopdepth', '#/analytics?tab=scopes&sub=hopdepth&swin=', '#/analytics?tab=scopes&swin=7d&sub=']) {
+    await test(hash + ': an empty key does not disturb the other one', async () => {
+      const env = pageEnv({ session: { scopes_subtab: 'regions', scopes_window: '1h' } });
+      await env.mount(hash);
+      const q = new URLSearchParams(hash.split('?')[1]);
+      const wantSub = q.get('sub') || 'overview', wantWin = q.get('swin') || '24h';
+      assert.deepStrictEqual(env.activeSubtabs(), [wantSub], 'sub-tab');
+      assert.deepStrictEqual(env.scopeStatsUrls(), ['/api/scope-stats?window=' + wantWin], 'window');
+    });
+  }
+
+  await test('?window= stays the global picker: window=7d&swin=1h sets each on its own', async () => {
+    const env = pageEnv();
+    await env.mount('#/analytics?tab=scopes&window=7d&swin=1h');
+    assert.strictEqual(env.globalWindow(), '7d', 'global picker');
+    assert.deepStrictEqual(env.scopeStatsUrls(), ['/api/scope-stats?window=1h']);
+    assert.deepStrictEqual(env.params(), { tab: 'scopes', window: '7d', swin: '1h' });
+  });
+
+  console.log('\n=== #205: default URLs do not change ===');
+
+  for (const hash of ['#/analytics?tab=scopes', '#/analytics?tab=wardriving', '#/analytics', '#/analytics?tab=topology&window=7d']) {
+    await test(hash + ' with nothing stored is left as it is', async () => {
+      const env = pageEnv();
+      await env.mount(hash);
+      assert.strictEqual(env.hash(), hash);
+      assert.deepStrictEqual(env.hashLog.filter((h) => h !== hash), [], 'URL rewritten');
+    });
+  }
+
+  await test('the explicit defaults (sub=overview&swin=24h) are dropped from the URL', async () => {
+    const env = pageEnv();
+    await env.mount('#/analytics?tab=scopes&sub=overview&swin=24h');
+    assert.deepStrictEqual(env.activeSubtabs(), ['overview']);
+    assert.strictEqual(env.hash(), '#/analytics?tab=scopes');
+  });
+
+  console.log('\n=== #205: clicks write the URL ===');
+
+  await test('clicking a sub-tab writes sub=, clicking Overview drops it', async () => {
+    const env = pageEnv();
+    await env.mount('#/analytics?tab=scopes');
+    await env.clickSubtab('hopdepth');
+    assert.strictEqual(env.hash(), '#/analytics?tab=scopes&sub=hopdepth');
+    assert.strictEqual(env.session.scopes_subtab, 'hopdepth');
+    await env.clickSubtab('regions');
+    assert.strictEqual(env.hash(), '#/analytics?tab=scopes&sub=regions');
+    await env.clickSubtab('overview');
+    assert.strictEqual(env.hash(), '#/analytics?tab=scopes');
+  });
+
+  await test('clicking a window writes swin=, clicking 24h drops it; sub= is kept', async () => {
+    const env = pageEnv();
+    await env.mount('#/analytics?tab=scopes&sub=hopdepth');
+    await env.clickScopesWindow('7d');
+    assert.strictEqual(env.hash(), '#/analytics?tab=scopes&sub=hopdepth&swin=7d');
+    assert.strictEqual(env.session.scopes_window, '7d');
+    assert.ok(env.scopeStatsUrls().includes('/api/scope-stats?window=7d'), env.scopeStatsUrls().join(', '));
+    await env.clickScopesWindow('24h');
+    assert.strictEqual(env.hash(), '#/analytics?tab=scopes&sub=hopdepth');
+  });
+
+  await test('a click, leave and a remount from the written URL (reload / back / forward) restores the view', async () => {
+    const env = pageEnv();
+    await env.mount('#/analytics?tab=scopes');
+    await env.clickSubtab('hygiene');
+    await env.clickScopesWindow('1h');
+    const url = env.hash();
+    env.destroy();
+    await env.mount('#/packets');
+    const env2 = pageEnv();   // fresh document, nothing in sessionStorage
+    await env2.mount(url);
+    assert.deepStrictEqual(env2.activeSubtabs(), ['hygiene']);
+    assert.deepStrictEqual(env2.visiblePanels(), ['hygiene']);
+    assert.deepStrictEqual(env2.scopeStatsUrls(), ['/api/scope-stats?window=1h']);
+    assert.strictEqual(env2.hash(), url);
+  });
+
+  await test('switching from Scopes to another tab drops sub= and swin=, keeps window=', async () => {
+    const env = pageEnv();
+    await env.mount('#/analytics?tab=scopes&sub=hopdepth&swin=7d&window=24h');
+    await env.clickTab('topology');
+    assert.strictEqual(env.hash(), '#/analytics?tab=topology&window=24h');
+  });
+
+  await test('switching back to Scopes restores the stored view into the URL', async () => {
+    const env = pageEnv();
+    await env.mount('#/analytics?tab=scopes&sub=hopdepth&swin=7d');
+    await env.clickTab('topology');
+    await env.clickTab('scopes');
+    assert.deepStrictEqual(env.params(), { tab: 'scopes', sub: 'hopdepth', swin: '7d' });
+  });
+
+  await test('rf-health keys are still dropped when leaving rf-health (unchanged)', async () => {
+    const env = pageEnv();
+    await env.mount('#/analytics?tab=rf-health&range=7d&observer=X');
+    await env.clickTab('scopes');
+    assert.strictEqual(env.hash(), '#/analytics?tab=scopes');
+  });
+
+  console.log('\n=== #205: Wardriving window (wdwin=) ===');
+
+  for (const w of ['1h', '24h', '7d']) {
+    await test('#/analytics?tab=wardriving&wdwin=' + w + ' selects ' + w, async () => {
+      const env = pageEnv();
+      await env.mount('#/analytics?tab=wardriving&wdwin=' + w);
+      assert.deepStrictEqual(env.activeWardrivingWindows(), [w]);
+      assert.ok(env.wardrivingUrls().length > 0 && env.wardrivingUrls().every((u) => u.indexOf('window=' + w) >= 0), env.wardrivingUrls().join(', '));
+    });
+  }
+
+  await test('the URL wardriving window wins over sessionStorage', async () => {
+    const env = pageEnv({ session: { wardriving_window: '1h' } });
+    await env.mount('#/analytics?tab=wardriving&wdwin=7d');
+    assert.deepStrictEqual(env.activeWardrivingWindows(), ['7d']);
+    assert.strictEqual(env.session.wardriving_window, '7d');
+  });
+
+  await test('without wdwin=, the stored wardriving window is written to the URL', async () => {
+    const env = pageEnv({ session: { wardriving_window: '1h' } });
+    await env.mount('#/analytics?tab=wardriving');
+    assert.deepStrictEqual(env.activeWardrivingWindows(), ['1h']);
+    assert.strictEqual(env.hash(), '#/analytics?tab=wardriving&wdwin=1h');
+  });
+
+  for (const value of ['30d', 'x"]', '__proto__', '']) {
+    await test('?wdwin=' + JSON.stringify(value) + ' falls back to 24h, no exception', async () => {
+      const env = pageEnv({ session: { wardriving_window: '1h' } });
+      await env.mount('#/analytics?tab=wardriving&wdwin=' + encodeURIComponent(value));
+      assert.strictEqual(env.initError(), null, 'init() threw');
+      assert.deepStrictEqual(env.activeWardrivingWindows(), ['24h']);
+      assert.strictEqual(env.hash(), '#/analytics?tab=wardriving');
+    });
+  }
+
+  await test('clicking a wardriving window writes wdwin=, 24h drops it; leaving the tab drops it', async () => {
+    const env = pageEnv();
+    await env.mount('#/analytics?tab=wardriving');
+    await env.clickWardrivingWindow('7d');
+    assert.strictEqual(env.hash(), '#/analytics?tab=wardriving&wdwin=7d');
+    await env.clickWardrivingWindow('24h');
+    assert.strictEqual(env.hash(), '#/analytics?tab=wardriving');
+    await env.clickWardrivingWindow('1h');
+    await env.clickTab('scopes');
+    assert.strictEqual(env.hash(), '#/analytics?tab=scopes');
+  });
+
+  await test('Scopes and Wardriving windows are independent', async () => {
+    const env = pageEnv();
+    await env.mount('#/analytics?tab=scopes&swin=7d');
+    await env.clickTab('wardriving');
+    assert.deepStrictEqual(env.activeWardrivingWindows(), ['24h']);
+    assert.strictEqual(env.hash(), '#/analytics?tab=wardriving');
+  });
+
+  console.log('\n' + passed + ' passed, ' + failed + ' failed');
+  if (failed > 0) process.exit(1);
+})();
diff --git a/test-issue-205-analytics-subtab-deeplinks-e2e.js b/test-issue-205-analytics-subtab-deeplinks-e2e.js
new file mode 100644
index 000000000..03f14634a
--- /dev/null
+++ b/test-issue-205-analytics-subtab-deeplinks-e2e.js
@@ -0,0 +1,203 @@
+#!/usr/bin/env node
+/**
+ * E2E (#205): the Scopes tab's sub-tab and window, and the Wardriving tab's
+ * window, are deep-linked as ?sub=, ?swin= and ?wdwin= next to ?tab=.
+ *
+ * - #/analytics?tab=scopes&sub=hopdepth opens Hop Depth on a cold load and
+ *   when navigated to from another page;
+ * - clicks write the URL, reload and back/forward restore the view;
+ * - a URL value wins over the sessionStorage one;
+ * - a hostile ?sub= falls back to Overview without a page error;
+ * - the default view keeps the URL it had before (#/analytics?tab=scopes),
+ *   and switching to another tab drops the keys.
+ *
+ * Usage: BASE_URL=http://localhost:13581 node test-issue-205-analytics-subtab-deeplinks-e2e.js
+ */
+'use strict';
+const { chromium } = require('playwright');
+
+const BASE = process.env.BASE_URL || 'http://localhost:13581';
+const SUBS = ['overview', 'hopdepth', 'regions', 'hygiene'];
+
+let passed = 0, failed = 0;
+async function step(name, fn) {
+  try { await fn(); passed++; console.log('  ✓ ' + name); }
+  catch (e) { failed++; console.error('  ✗ ' + name + ': ' + e.message); }
+}
+function assert(c, m) { if (!c) throw new Error(m || 'assertion failed'); }
+
+const hash = (page) => page.evaluate(() => location.hash);
+
+// The active sub-tab button(s), the visible panel(s) and the active window
+// button(s) of the visible panel, as the visitor sees them.
+function scopesView(page) {
+  return page.evaluate((subs) => {
+    const active = Array.from(document.querySelectorAll('#scopesSubtabs [data-subtab].active')).map((b) => b.dataset.subtab);
+    const visible = subs.filter((k) => {
+      const p = document.getElementById('scopes-panel-' + k);
+      return p && p.style.display !== 'none' && p.offsetParent !== null;
+    });
+    const win = Array.from(document.querySelectorAll('[id^="scopes-panel-"] [data-win].active'))
+      .filter((b) => b.offsetParent !== null).map((b) => b.dataset.win);
+    return { active, visible, win };
+  }, SUBS);
+}
+
+async function waitScopes(page, sub) {
+  await page.waitForSelector('#scopesSubtabs [data-subtab].active', { timeout: 15000 });
+  try {
+    await page.waitForFunction((s) => {
+      const b = document.querySelector('#scopesSubtabs [data-subtab].active');
+      return b && b.dataset.subtab === s;
+    }, sub, { timeout: 8000 });
+  } catch (_) {
+    throw new Error('sub-tab ' + sub + ' not active; view ' + JSON.stringify(await scopesView(page)) + ', hash ' + await hash(page));
+  }
+}
+
+async function expectScopes(page, sub, win) {
+  await waitScopes(page, sub);
+  const v = await scopesView(page);
+  assert(JSON.stringify(v.active) === JSON.stringify([sub]), 'active sub-tab ' + JSON.stringify(v.active));
+  assert(JSON.stringify(v.visible) === JSON.stringify([sub]), 'visible panel ' + JSON.stringify(v.visible));
+  if (win) assert(JSON.stringify(v.win) === JSON.stringify([win]), 'active window ' + JSON.stringify(v.win));
+}
+
+// A full page load, then the one theme-refresh it fires (app.js), so the
+// test does not race the re-render.
+async function coldLoad(page, path) {
+  await page.goto('about:blank');
+  await page.goto(BASE + '/' + path, { waitUntil: 'load' });
+  await page.waitForFunction(() => window.__themeRefreshed, null, { timeout: 8000 }).catch(() => {});
+}
+
+(async () => {
+  const requireChromium = process.env.CHROMIUM_REQUIRE === '1';
+  let browser;
+  try {
+    browser = await chromium.launch({
+      headless: true,
+      executablePath: process.env.CHROMIUM_PATH || undefined,
+      args: ['--no-sandbox', '--disable-gpu', '--disable-dev-shm-usage'],
+    });
+  } catch (err) {
+    if (requireChromium) {
+      console.error('test-issue-205-analytics-subtab-deeplinks-e2e.js: FAIL — Chromium required but unavailable: ' + err.message);
+      process.exit(1);
+    }
+    console.log('test-issue-205-analytics-subtab-deeplinks-e2e.js: SKIP (Chromium unavailable: ' + err.message.split('\n')[0] + ')');
+    process.exit(0);
+  }
+
+  const ctx = await browser.newContext({ viewport: { width: 1400, height: 1000 } });
+  await ctx.addInitScript(() => {
+    window.addEventListener('theme-refresh', () => { window.__themeRefreshed = true; }, { once: true });
+  });
+  const page = await ctx.newPage();
+  page.setDefaultTimeout(15000);
+  const pageErrors = [];
+  page.on('pageerror', (e) => { pageErrors.push(e.message); console.error('[pageerror]', e.message); });
+
+  console.log('\n=== #205 analytics sub-tab deep links E2E against ' + BASE + ' ===');
+
+  await step('cold load #/analytics?tab=scopes&sub=hopdepth opens Hop Depth, URL unchanged', async () => {
+    await coldLoad(page, '#/analytics?tab=scopes&sub=hopdepth');
+    await expectScopes(page, 'hopdepth', '24h');
+    assert(await hash(page) === '#/analytics?tab=scopes&sub=hopdepth', 'hash ' + await hash(page));
+  });
+
+  await step('clicking sub-tabs and a window writes sub= and swin=', async () => {
+    await page.click('#scopesSubtabs [data-subtab="regions"]');
+    await expectScopes(page, 'regions');
+    assert(await hash(page) === '#/analytics?tab=scopes&sub=regions', 'after Regions: ' + await hash(page));
+    await page.click('#scopesSubtabs [data-subtab="hopdepth"]');
+    const req = page.waitForRequest((r) => r.url().includes('/api/scope-stats?window=7d'), { timeout: 8000 });
+    await page.click('#scopes-panel-hopdepth [data-win="7d"]');
+    await req;
+    await expectScopes(page, 'hopdepth', '7d');
+    assert(await hash(page) === '#/analytics?tab=scopes&sub=hopdepth&swin=7d', 'after 7d: ' + await hash(page));
+  });
+
+  await step('reload keeps Hop Depth and 7d', async () => {
+    const req = page.waitForRequest((r) => r.url().includes('/api/scope-stats?window=7d'), { timeout: 15000 });
+    await page.reload({ waitUntil: 'load' });
+    await req;
+    await expectScopes(page, 'hopdepth', '7d');
+    assert(await hash(page) === '#/analytics?tab=scopes&sub=hopdepth&swin=7d', 'hash ' + await hash(page));
+  });
+
+  await step('back and forward across another page restore the view', async () => {
+    await page.evaluate(() => { location.hash = '#/nodes'; });
+    await page.waitForFunction(() => location.hash === '#/nodes' && !document.getElementById('scopesSubtabs'));
+    await page.goBack();
+    await expectScopes(page, 'hopdepth', '7d');
+    assert(await hash(page) === '#/analytics?tab=scopes&sub=hopdepth&swin=7d', 'after back: ' + await hash(page));
+    await page.goForward();
+    await page.waitForFunction(() => location.hash === '#/nodes' && !document.getElementById('scopesSubtabs'));
+    await page.goBack();
+    await expectScopes(page, 'hopdepth', '7d');
+  });
+
+  await step('navigating from another page to ?sub=regions: the URL wins over sessionStorage (hopdepth)', async () => {
+    assert(await page.evaluate(() => sessionStorage.getItem('scopes_subtab')) === 'hopdepth', 'precondition: stored sub-tab');
+    await page.evaluate(() => { location.hash = '#/nodes'; });
+    await page.waitForFunction(() => !document.getElementById('scopesSubtabs'));
+    await page.evaluate(() => { location.hash = '#/analytics?tab=scopes&sub=regions'; });
+    await expectScopes(page, 'regions');
+    assert(await page.evaluate(() => sessionStorage.getItem('scopes_subtab')) === 'regions', 'stored sub-tab not updated');
+    // The stored window (7d) still applies without swin= and is written back.
+    await page.waitForFunction(() => location.hash === '#/analytics?tab=scopes&sub=regions&swin=7d');
+  });
+
+  await step('switching to another tab drops sub= and swin=; the Scopes tab brings them back', async () => {
+    await page.click('#analyticsTabs [data-tab="topology"]');
+    await page.waitForFunction(() => location.hash === '#/analytics?tab=topology');
+    await page.click('#analyticsTabs [data-tab="scopes"]');
+    await expectScopes(page, 'regions');
+    assert(await hash(page) === '#/analytics?tab=scopes&sub=regions&swin=7d', 'hash ' + await hash(page));
+  });
+
+  await step('a hostile ?sub= falls back to Overview without a page error', async () => {
+    const before = pageErrors.length;
+    await page.evaluate(() => { location.hash = '#/nodes'; });
+    await page.waitForFunction(() => !document.getElementById('scopesSubtabs'));
+    await page.evaluate(() => { location.hash = '#/analytics?tab=scopes&sub=' + encodeURIComponent('x"],[data-subtab="hygiene') + '&swin=24h'; });
+    await expectScopes(page, 'overview', '24h');
+    assert(await hash(page) === '#/analytics?tab=scopes', 'hash not canonical: ' + await hash(page));
+    assert(pageErrors.length === before, 'page errors: ' + pageErrors.slice(before).join(' | '));
+  });
+
+  await step('default view keeps today\'s URL (fresh context, Scopes clicked from Overview)', async () => {
+    const ctx2 = await browser.newContext({ viewport: { width: 1400, height: 1000 } });
+    const p2 = await ctx2.newPage();
+    try {
+      await p2.goto(BASE + '/#/analytics', { waitUntil: 'load' });
+      await p2.click('#analyticsTabs [data-tab="scopes"]');
+      await expectScopes(p2, 'overview', '24h');
+      await p2.waitForTimeout(500);
+      assert(await hash(p2) === '#/analytics?tab=scopes', 'hash ' + await hash(p2));
+    } finally {
+      await ctx2.close();
+    }
+  });
+
+  await step('cold load #/analytics?tab=wardriving&wdwin=7d selects 7d; clicking 1h writes wdwin=1h', async () => {
+    const req = page.waitForRequest((r) => /\/api\/analytics\/wardriving\?.*window=7d/.test(r.url()), { timeout: 15000 });
+    await coldLoad(page, '#/analytics?tab=wardriving&wdwin=7d');
+    await req;
+    await page.waitForSelector('[data-wdwin="7d"].active');
+    assert(await hash(page) === '#/analytics?tab=wardriving&wdwin=7d', 'hash ' + await hash(page));
+    await page.click('[data-wdwin="1h"]');
+    await page.waitForSelector('[data-wdwin="1h"].active');
+    assert(await hash(page) === '#/analytics?tab=wardriving&wdwin=1h', 'after 1h: ' + await hash(page));
+  });
+
+  await browser.close();
+
+  console.log('\n' + passed + ' passed, ' + failed + ' failed');
+  if (failed > 0) {
+    console.error('test-issue-205-analytics-subtab-deeplinks-e2e.js: FAIL');
+    process.exit(1);
+  }
+  console.log('test-issue-205-analytics-subtab-deeplinks-e2e.js: PASS');
+})();

From 6b6ceca608f432a5ee685a394f0e0907aa8f4bd1 Mon Sep 17 00:00:00 2001
From: dborup <kontakt@meshview.dk>
Date: Sun, 4 Oct 2026 06:37:52 +0000
Subject: [PATCH 2/2] feat(analytics): deep-link Scopes sub-tabs and window,
 Wardriving window (#205)

The Scopes sub-tab and window and the Wardriving window lived only in
sessionStorage. They are now in the hash as ?sub=, ?swin= and ?wdwin=
(?window= stays the global time picker). A URL value wins, an unknown
one falls back to the default, and values are only compared with ===.
Without a URL value the stored one is used and written back; defaults
are left out, so today's URLs are unchanged. All keys of a tab are read
before any is written, since rebuilding the hash drops an empty key.
_updateAnalyticsUrl drops other tabs' keys through one map (rf-health
folded in).

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 public/analytics.js | 92 +++++++++++++++++++++++++++++++++++++--------
 1 file changed, 77 insertions(+), 15 deletions(-)

diff --git a/public/analytics.js b/public/analytics.js
index b362bf106..fce9f4bc2 100644
--- a/public/analytics.js
+++ b/public/analytics.js
@@ -223,11 +223,11 @@
         window: twElNow && twElNow.value ? twElNow.value : ''
       };
       // Drop any subview-specific keys that don't belong to the active tab
-      // so switching tabs gives a clean URL. (rf-health uses 'range', 'observer', 'from', 'to')
-      if (_currentTab !== 'rf-health') {
-        var cleared = ['range', 'observer', 'from', 'to'];
-        for (var i = 0; i < cleared.length; i++) updates[cleared[i]] = '';
-      }
+      // so switching tabs gives a clean URL.
+      Object.keys(TAB_URL_PARAMS).forEach(function (t) {
+        if (t === _currentTab) return;
+        TAB_URL_PARAMS[t].forEach(function (k) { updates[k] = ''; });
+      });
       var newHash = URLState.updateHashParams(updates, location.hash);
       if (newHash !== location.hash) history.replaceState(null, '', newHash);
     }
@@ -340,6 +340,68 @@
     return q ? path + (path.indexOf('?') < 0 ? '?' : '&') + q : path;
   }
 
+  // #205 — a tab's inner view state (Scopes sub-tab and window, Wardriving
+  // window) lives in the hash next to ?tab=, with sessionStorage as the
+  // fallback for a plain visit of the tab. ?window= is the global time
+  // picker above the tab bar (other values, and it drives the shared
+  // loads), so each tab window gets a key of its own.
+  var SCOPES_SUBTAB = { param: 'sub', storageKey: 'scopes_subtab', allowed: ['overview', 'hopdepth', 'regions', 'hygiene'], dflt: 'overview' };
+  var SCOPES_WINDOW = { param: 'swin', storageKey: 'scopes_window', allowed: ['1h', '24h', '7d'], dflt: '24h' };
+  var WARDRIVING_WINDOW = { param: 'wdwin', storageKey: 'wardriving_window', allowed: ['1h', '24h', '7d'], dflt: '24h' };
+
+  // The hash keys each tab owns; _updateAnalyticsUrl drops them when
+  // another tab is selected.
+  var TAB_URL_PARAMS = {
+    'rf-health': ['range', 'observer', 'from', 'to'],
+    scopes: [SCOPES_SUBTAB.param, SCOPES_WINDOW.param],
+    wardriving: [WARDRIVING_WINDOW.param],
+  };
+
+  // A value from the URL wins; an unknown one falls back to the default,
+  // not to the stored value. Values are only compared with ===, never put
+  // in a selector or markup (#193/#194). Without a URL value, the stored
+  // value is used while it is still a known one.
+  function resolveViewParam(urlValue, storedValue, allowed, dflt) {
+    if (urlValue != null) return allowed.indexOf(urlValue) >= 0 ? urlValue : dflt;
+    return storedValue != null && allowed.indexOf(storedValue) >= 0 ? storedValue : dflt;
+  }
+
+  function _sessionGet(key) {
+    try { return typeof sessionStorage !== 'undefined' ? sessionStorage.getItem(key) : null; } catch (e) { return null; }
+  }
+
+  // Stores the values and writes them to the hash in one go. A default is
+  // left out, so a tab in its default view keeps the URL it had before #205.
+  function _writeViewParams(specs, values) {
+    var updates = {};
+    specs.forEach(function (spec, i) {
+      try { if (typeof sessionStorage !== 'undefined') sessionStorage.setItem(spec.storageKey, values[i]); } catch (e) { /* storage blocked */ }
+      updates[spec.param] = values[i] === spec.dflt ? '' : values[i];
+    });
+    if (!window.URLState) return;
+    // replaceState can throw (Safari throttles it); the view has already
+    // changed by then, so a failed URL sync must not break the tab (#1914).
+    try {
+      var newHash = URLState.updateHashParams(updates, location.hash);
+      if (newHash !== location.hash) history.replaceState(null, '', newHash);
+    } catch (e) { /* URL sync is best effort */ }
+  }
+
+  function setViewParam(spec, value) { _writeViewParams([spec], [value]); }
+
+  // Read on render: resolve every value of the tab from the same hash first,
+  // then store them and write them back. Writing one value rebuilds the
+  // hash, which drops an empty key ("?sub=") the next read would still see.
+  function restoreViewParams(specs) {
+    var hash = typeof location !== 'undefined' ? String(location.hash || '') : '';
+    var params = new URLSearchParams(hash.split('?')[1] || '');
+    var values = specs.map(function (spec) {
+      return resolveViewParam(params.get(spec.param), _sessionGet(spec.storageKey), spec.allowed, spec.dflt);
+    });
+    _writeViewParams(specs, values);
+    return values;
+  }
+
   async function loadAnalytics(startedAt) {
     _cancelLoadRetry();
     const gen = _loadGen;
@@ -3159,6 +3221,7 @@ function destroy() { _stopRolesRefresh(); _stopScopesRefresh(); _stopForeignTraf
   if (typeof window !== 'undefined') {
     window._analyticsAssignTableIds = assignAnalyticsTableIds;
     window._analyticsWithQuery = withQuery;
+    window._analyticsResolveViewParam = resolveViewParam;
     window._analyticsDecorateChannels = decorateAnalyticsChannels;
     window._analyticsSortChannels = sortChannels;
     window._analyticsLoadChannelSort = loadChannelSort;
@@ -4955,8 +5018,10 @@ function destroy() { _stopRolesRefresh(); _stopScopesRefresh(); _stopForeignTraf
 
   // ===================== SCOPES =====================
   async function renderScopesTab(el) {
-    var winKey = 'scopes_window';
-    var selectedWindow = (typeof sessionStorage !== 'undefined' && sessionStorage.getItem(winKey)) || '24h';
+    // Both views are deep-linked: ?sub= and ?swin= (#205).
+    var scopesView = restoreViewParams([SCOPES_SUBTAB, SCOPES_WINDOW]);
+    var selectedSubtab = scopesView[0];
+    var selectedWindow = scopesView[1];
 
     // #1852: the tab grew to stacked sections (windowed adoption stats,
     // all-time region breakdowns, all-time node/repeater hygiene lists) —
@@ -4970,8 +5035,6 @@ function destroy() { _stopRolesRefresh(); _stopScopesRefresh(); _stopForeignTraf
     // windowed panel gets its own copy of the picker buttons rather than
     // one shared control above the sub-tab bar — every button still
     // drives the same selectedWindow/load(), see the click listener below.
-    var subtabKey = 'scopes_subtab';
-    var selectedSubtab = (typeof sessionStorage !== 'undefined' && sessionStorage.getItem(subtabKey)) || 'overview';
 
     // Role/text/geo filter for the "Nodes Without a Default Scope" section
     // below. Lives at this scope (not inside updateData) so it survives
@@ -5058,9 +5121,9 @@ function destroy() { _stopRolesRefresh(); _stopScopesRefresh(); _stopForeignTraf
           var btn = e.target.closest('[data-subtab]');
           if (!btn) return;
           selectedSubtab = btn.dataset.subtab;
-          if (typeof sessionStorage !== 'undefined') sessionStorage.setItem(subtabKey, selectedSubtab);
+          setViewParam(SCOPES_SUBTAB, selectedSubtab);
           subtabsEl.querySelectorAll('[data-subtab]').forEach(function(b) { b.classList.toggle('active', b.dataset.subtab === selectedSubtab); });
-          ['overview', 'hopdepth', 'regions', 'hygiene'].forEach(function(key) {
+          SCOPES_SUBTAB.allowed.forEach(function(key) {
             var panel = document.getElementById('scopes-panel-' + key);
             if (panel) panel.style.display = key === selectedSubtab ? '' : 'none';
           });
@@ -5071,7 +5134,7 @@ function destroy() { _stopRolesRefresh(); _stopScopesRefresh(); _stopForeignTraf
       el.querySelectorAll('[data-win]').forEach(function(btn) {
         btn.addEventListener('click', function() {
           selectedWindow = btn.dataset.win;
-          if (typeof sessionStorage !== 'undefined') sessionStorage.setItem(winKey, selectedWindow);
+          setViewParam(SCOPES_WINDOW, selectedWindow);
           el.querySelectorAll('[data-win]').forEach(function(b) { b.classList.toggle('active', b.dataset.win === selectedWindow); });
           load(selectedWindow);
         });
@@ -6376,8 +6439,7 @@ function destroy() { _stopRolesRefresh(); _stopScopesRefresh(); _stopForeignTraf
   // and which observer stations — fixed, known locations — actually
   // heard the traffic (Coverage).
   async function renderWardrivingTab(el) {
-    var winKey = 'wardriving_window';
-    var selectedWindow = (typeof sessionStorage !== 'undefined' && sessionStorage.getItem(winKey)) || '24h';
+    var selectedWindow = restoreViewParams([WARDRIVING_WINDOW])[0];   // ?wdwin= (#205)
 
     function pct(n, total) {
       if (!total) return '—';
@@ -6659,7 +6721,7 @@ function destroy() { _stopRolesRefresh(); _stopScopesRefresh(); _stopForeignTraf
       el.querySelectorAll('[data-wdwin]').forEach(function(btn) {
         btn.addEventListener('click', function() {
           selectedWindow = btn.dataset.wdwin;
-          if (typeof sessionStorage !== 'undefined') sessionStorage.setItem(winKey, selectedWindow);
+          setViewParam(WARDRIVING_WINDOW, selectedWindow);
           load(selectedWindow);
         });
       });