next into main (#73 )

Reviewed-on: #73
2026-09-29 12:04:30 +02:00
6 changed files with 18 additions and 99 deletions
@@ -52,8 +52,8 @@ halves, so the root `make check` fails if either one is broken. We provide:
 - `script/fmt` — format all files (writes): prettier, then gofmt over `backend/`
 - `script/fmt-check` — check formatting (read-only): prettier, then gofmt
 - `script/check` — run test, lint, and fmt-check
- `script/frontend-test` — run the unit tests in `test/unit/` with Node's
-  built-in test runner, then the production build
+- `script/frontend-test` — run the production build as the frontend's test (no
+  unit tests yet)
 - `script/frontend-lint` — run prettier in check mode
 - `script/frontend-fmt` — format everything prettier understands (writes)
 - `script/frontend-fmt-check` — check prettier formatting (read-only)
@@ -136,11 +136,8 @@ Local hosts are tracked separately from WAN stats.
 ### Latency measurement

 HEAD requests with `mode: 'no-cors'` and `cache: 'no-store'`, timed with
-`performance.now()`. Each check times out after 80% of the refresh interval (24
-seconds at 30 seconds) and is then recorded as a timeout, so a round's checks
-have all finished before the next round is due. A round due while the last one
-is still waiting, which happens only after an interval change or when the
-recovery probe starts one, is skipped. IPv4 only.
+`performance.now()`. 1-second timeout; anything over 1000ms is clamped to
+unreachable. IPv4 only.

 ### Color coding

@@ -23,13 +23,6 @@ latest run passes.

 # Completed Steps

- 2026-09-29: each target check times out after 80% of the refresh interval
-  (issue #78), 24 seconds at 30 seconds, where it was capped at 3 seconds. A
-  round due while the last one's checks are still waiting is skipped, so rounds
-  never overlap, and the recovery probe starts no new checks while its last ones
-  are waiting. The frontend has its first unit tests, run by
-  `script/frontend-test` with Node's built-in test runner; for them,
-  `index.html` now links `src/styles.css`, which `src/main.js` used to import
 - 2026-09-29: the container sets up its own data directory (issue #75):
  `bin/entrypoint.sh`, still as root, creates `DATA_DIR` if missing and gives it
  and `/data` to the `netwatch` user with mode 750 before starting the backend
@@ -9,9 +9,6 @@
            type="image/svg+xml"
            href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>📡</text></svg>"
        />
-        <!-- Linked here, not imported by src/main.js, so the unit tests can
-             import that module in Node, which cannot import CSS. -->
-        <link rel="stylesheet" href="/src/styles.css" />
    </head>
    <body class="bg-gray-900 text-white min-h-screen">
        <div id="app"></div>
@@ -1,14 +1,13 @@
 #!/bin/sh
-# script/frontend-test: run the frontend test suite: the unit tests in
-# test/unit/ with Node's built-in test runner, then the production
-# build, which fails on broken code.
+# script/frontend-test: run the frontend test suite. The frontend has no
+# unit tests; the production build serves as the test (fails on broken
+# code).
 set -eu

 ROOT="$(cd "$(dirname "$0")/.." && pwd -P)"

 main() {
    cd "$ROOT"
-    timeout 30 node --test test/unit/*.test.js
    timeout 30 yarn build
 }

@@ -1,14 +1,14 @@
+import "./styles.css";
+
 // --- Configuration -----------------------------------------------------------

-// Timing, axis labels, and display constants. A target check times out
-// after requestTimeout, 80% of updateInterval, so a round's checks have
-// all finished before the next round is due; latency above maxLatency is
-// recorded as a timeout. The sparkline Y-axis is capped at
+// Timing, axis labels, and display constants. Latency above maxLatency is
+// clamped to "unreachable". The sparkline Y-axis is capped at
 // graphMaxLatency — values above it pin to the top of the chart but still
 // display their real value in the latency figure. The history buffer holds
 // maxHistoryPoints samples (historyDuration / updateInterval).
 // reportInterval is how often collected samples are POSTed to the backend.
-export const CONFIG = {
+const CONFIG = {
    updateInterval: 3000,
    maxHistoryPoints: 100,
    reportInterval: 60000,
@@ -16,7 +16,7 @@ export const CONFIG = {
        return (this.maxHistoryPoints * this.updateInterval) / 1000;
    },
    get requestTimeout() {
-        return this.updateInterval * 0.8;
+        return Math.min(this.updateInterval - 100, 3000);
    },
    get maxLatency() {
        return this.requestTimeout;
@@ -503,7 +503,7 @@ class Reporter {

 // --- Latency Measurement -----------------------------------------------------

-export async function measureLatency(url) {
+async function measureLatency(url) {
    const controller = new AbortController();
    const timeoutId = setTimeout(
        () => controller.abort(),
@@ -1181,16 +1181,11 @@ function startRecoveryProbe(state, triggerTick) {
    log.notice(
        `Recovery probe started (${canaries.map((h) => h.name).join(", ")})`,
    );
-    // A check can wait up to CONFIG.requestTimeout, far longer than
-    // 500ms, so no new checks start while the last ones are waiting.
-    let checking = false;
    state._recoveryProbeId = setInterval(async () => {
-        if (state.paused || checking) return;
-        checking = true;
+        if (state.paused) return;
        const results = await Promise.all(
            canaries.map((h) => measureLatency(h.url)),
        );
-        checking = false;
        if (results.some((r) => r.error === null)) {
            log.notice("Recovery probe: connectivity detected");
            stopRecoveryProbe(state);
@@ -1379,18 +1374,8 @@ async function init() {
    updateClocks();
    setInterval(updateClocks, 1000);

-    // A round waits up to CONFIG.requestTimeout for its checks. A round
-    // asked for while one is still waiting, after an interval change or
-    // by the recovery probe, is skipped, so rounds never overlap.
-    let roundRunning = false;
-    async function doTick() {
-        if (roundRunning) return;
-        roundRunning = true;
-        try {
-            await tick(state, () => startRecoveryProbe(state, doTick));
-        } finally {
-            roundRunning = false;
-        }
+    function doTick() {
+        tick(state, () => startRecoveryProbe(state, doTick));
    }

    doTick();
@@ -1459,7 +1444,7 @@ async function init() {

 // Bootstrap only when loaded as the page: a real DOM containing the #app
 // mount point this module renders into. Importing the module in a unit test
-// (which has no #app) runs nothing, so its exports can be tested in isolation.
+// (which has no #app) runs nothing, so buildReport can be tested in isolation.
 if (typeof document !== "undefined" && document.getElementById("app")) {
    if (document.readyState === "loading") {
        document.addEventListener("DOMContentLoaded", init);
@@ -1,52 +0,0 @@
-// Unit tests for src/main.js, run by script/frontend-test with Node's
-// built-in test runner. Importing the module does not start the page.
-
-import { after, before, test } from "node:test";
-import assert from "node:assert/strict";
-import { createServer } from "node:http";
-import { CONFIG, measureLatency } from "../../src/main.js";
-
-// measureLatency writes timeouts to the debug log, which looks for its
-// panel in the page. There is no page here.
-globalThis.document = { getElementById: () => null };
-
-// A target that answers after the number of milliseconds in the path,
-// e.g. /600.
-let server;
-let target;
-
-before(async () => {
-    server = createServer((req, res) => {
-        const delay = Number(new URL(req.url, "http://x").pathname.slice(1));
-        setTimeout(() => res.end(), delay);
-    });
-    await new Promise((resolve) => server.listen(0, "127.0.0.1", resolve));
-    target = `http://127.0.0.1:${server.address().port}`;
-});
-
-after(() => {
-    server.closeAllConnections();
-    server.close();
-});
-
-test("the timeout is 80% of the refresh interval", () => {
-    CONFIG.updateInterval = 30000;
-    assert.equal(CONFIG.requestTimeout, 24000);
-    CONFIG.updateInterval = 3000;
-    assert.equal(CONFIG.requestTimeout, 2400);
-});
-
-test("an answer within the timeout is recorded with its real time, a later one as a timeout", async () => {
-    // 600ms is past the 400ms timeout of a 500ms interval...
-    CONFIG.updateInterval = 500;
-    assert.deepEqual(await measureLatency(`${target}/600`), {
-        latency: null,
-        error: "timeout",
-    });
-
-    // ...and within the 1200ms timeout of a 1500ms interval.
-    CONFIG.updateInterval = 1500;
-    const { latency, error } = await measureLatency(`${target}/600`);
-    assert.equal(error, null);
-    assert.ok(latency >= 600 && latency < 1200, `latency ${latency}ms`);
-});