feat(ui): one consistent navbar on every page (TODO.md L3)
This commit is contained in:
+170
-78
@@ -3,10 +3,13 @@
|
||||
The browser behavior is E2E-covered (tests/e2e/test_sync_button.py,
|
||||
task 03); here we pin the source-level wiring — the anonymous-safe
|
||||
ship-hidden button markup, the header.js admin reveal on the SAME
|
||||
cached whoami (no extra fetch), the sources.js sync state machine
|
||||
(2 s poll, 202 start / 409 adoption / 403 hide, terminal labels,
|
||||
the aria-live result, the single-poll-loop guard, no client-side hard
|
||||
timeout), the §7.4 never-stale CSS (spin + reduced-motion opt-out,
|
||||
cached whoami (no extra fetch), the header.js sync state machine
|
||||
(moved here from sources.js in phase 34 task 02: 2 s poll, 202 start
|
||||
/ 409 adoption / 403 hide, terminal labels, the "bor:sync-status"
|
||||
event with the status object as detail, the single-poll-loop guard, no
|
||||
client-side hard timeout), the Sources page's event-driven
|
||||
#sync-result line + #sync-error-banner, and the §7.4 never-stale CSS
|
||||
(spin + reduced-motion opt-out,
|
||||
disabled state, 44px floor, contrast pair) — so a silent regression is
|
||||
caught without a browser.
|
||||
"""
|
||||
@@ -117,103 +120,114 @@ def test_sources_page_stays_cdn_free() -> None:
|
||||
|
||||
def test_header_reveals_sync_btn_on_the_admin_branch() -> None:
|
||||
"""initSharedHeader reveals #sync-btn in the SAME admin branch as
|
||||
#nav-sources (querySelector + hidden = !admin) — one cached whoami,
|
||||
no extra whoami call; anonymous users never leave the hidden
|
||||
default."""
|
||||
#nav-sources (hidden = !admin) — one cached whoami, no extra
|
||||
whoami call; anonymous users never leave the hidden default. The
|
||||
ref is the module-level one — the state machine shares it."""
|
||||
js = _text(HEADER_JS)
|
||||
assert 'querySelector("#sync-btn")' in js, "module-level #sync-btn ref"
|
||||
fn = js.find("function initSharedHeader")
|
||||
assert fn != -1
|
||||
body = js[fn : js.find("\n}", fn)]
|
||||
assert 'querySelector("#sync-btn")' in body, "#sync-btn must join the admin reveal"
|
||||
assert "syncBtn.hidden = !admin" in body
|
||||
assert "syncBtn.hidden = !admin" in body, "#sync-btn must join the admin reveal"
|
||||
# The reveal must not introduce a second whoami call site.
|
||||
assert js.count('fetch("/api/whoami")') == 1
|
||||
|
||||
|
||||
# ---------- sources.js: the sync state machine ----------
|
||||
# ---------- header.js: the sync state machine (moved here from
|
||||
# ---------- sources.js in phase 34 task 02) ----------
|
||||
|
||||
|
||||
def test_sources_js_calls_the_sync_api() -> None:
|
||||
def test_header_js_owns_the_sync_button_elements() -> None:
|
||||
"""The button refs are module-level and null-safe: #sync-btn,
|
||||
#sync-label, the .sync-icon inside the button — a page without the
|
||||
markup is a complete no-op, exactly like the rest of the module."""
|
||||
js = _text(HEADER_JS)
|
||||
assert 'querySelector("#sync-btn")' in js
|
||||
assert 'querySelector("#sync-label")' in js
|
||||
assert 'syncBtn.querySelector(".sync-icon")' in js
|
||||
|
||||
|
||||
def test_header_js_calls_the_sync_api() -> None:
|
||||
"""The click posts to POST /api/sync and the poll loop GETs
|
||||
/api/sync/status — both through the same-origin API (A10)."""
|
||||
js = _text(SOURCES_JS)
|
||||
js = _text(HEADER_JS)
|
||||
assert 'fetch("/api/sync", { method: "POST" })' in js
|
||||
assert 'fetch("/api/sync/status")' in js
|
||||
|
||||
|
||||
def test_sources_js_polls_every_2000ms() -> None:
|
||||
def test_header_js_polls_every_2000ms() -> None:
|
||||
"""The feedback loop is a 2000 ms poll of the status endpoint,
|
||||
re-scheduled one tick at a time (setTimeout, not setInterval — an
|
||||
in-flight fetch can never overlap the next tick)."""
|
||||
js = _text(SOURCES_JS)
|
||||
js = _text(HEADER_JS)
|
||||
assert "SYNC_POLL_MS = 2000" in js
|
||||
assert "setTimeout(tick, SYNC_POLL_MS)" in js
|
||||
assert "setInterval" not in js
|
||||
|
||||
|
||||
def test_sources_js_adopts_409_and_starts_on_202() -> None:
|
||||
def test_header_js_adopts_409_and_starts_on_202() -> None:
|
||||
"""202 (started) and 409 (a run started elsewhere — e.g. a second
|
||||
tab) both enter the running state and start polling: the UI never
|
||||
starts a second run, it adopts the in-flight one."""
|
||||
js = _text(SOURCES_JS)
|
||||
js = _text(HEADER_JS)
|
||||
assert "r.status === 202 || r.status === 409" in js
|
||||
idx = js.find("r.status === 202 || r.status === 409")
|
||||
branch = js[idx : idx + 200]
|
||||
assert "enterRunningState()" in branch
|
||||
branch = js[idx : idx + 400]
|
||||
assert "enterSyncRunningState()" in branch
|
||||
assert "startSyncPolling()" in branch
|
||||
|
||||
|
||||
def test_sources_js_hides_the_button_on_403() -> None:
|
||||
"""A 403 anywhere (POST or poll) is treated as not-admin: the
|
||||
button hides — defense in depth behind header.js's whoami reveal."""
|
||||
js = _text(SOURCES_JS)
|
||||
for occurrence in re.finditer(r"r\.status === 403", js):
|
||||
window = js[occurrence.start() : occurrence.start() + 400]
|
||||
assert "syncBtn.hidden = true" in window, "every 403 branch must hide the button"
|
||||
def test_header_js_hides_the_button_on_403() -> None:
|
||||
"""A 403 anywhere (POST, the status poll, the load re-attach) is
|
||||
treated as not-admin: the button hides — defense in depth behind
|
||||
the whoami reveal (the primary gate)."""
|
||||
js = _text(HEADER_JS)
|
||||
assert len(re.findall(r"r\.status === 403", js)) >= 3, (
|
||||
"POST, the status poll, and the load re-attach must all handle 403"
|
||||
)
|
||||
assert js.count("syncBtn.hidden = true") >= 3, (
|
||||
"every 403 branch must hide the button"
|
||||
)
|
||||
|
||||
|
||||
def test_sources_js_running_state_is_never_stale() -> None:
|
||||
def test_header_js_running_state_is_never_stale() -> None:
|
||||
"""Entering the running state disables the button, sets aria-busy,
|
||||
spins the icon, and swaps the label to 'Syncing…' (the §7.4
|
||||
feedback while the poll waits)."""
|
||||
js = _text(SOURCES_JS)
|
||||
fn = js.find("function enterRunningState")
|
||||
assert fn != -1
|
||||
body = js[fn : js.find("\n}", fn)]
|
||||
feedback while the poll waits) — and a fresh run starts clean: the
|
||||
previous failure's title / aria-label / .is-error come off NOW,
|
||||
not when the run settles."""
|
||||
js = _text(HEADER_JS)
|
||||
body = _body(js, "enterSyncRunningState")
|
||||
assert "syncBtn.disabled = true" in body
|
||||
assert 'syncBtn.setAttribute("aria-busy", "true")' in body
|
||||
assert 'syncBtn.removeAttribute("title")' in body
|
||||
assert 'syncBtn.setAttribute("aria-label", "Sync sources")' in body
|
||||
assert "syncBtn.classList.remove(\"is-error\")" in body
|
||||
assert "syncIcon.classList.add(\"is-spinning\")" in body
|
||||
assert '"Syncing…"' in body
|
||||
|
||||
|
||||
def test_sources_js_terminal_states() -> None:
|
||||
def test_header_js_terminal_states() -> None:
|
||||
"""Terminal rendering: success → enabled + 'Synced HH:MM' (local
|
||||
time of finished_at) + the last-result counts ('added' always
|
||||
announced, zero terms omitted — a no-op re-sync reads '0 added ·
|
||||
1 unchanged', never an empty live region) + a live catalog refresh
|
||||
(the KB just changed — never a stale table); failed → enabled +
|
||||
retry-ready 'Sync sources' label + the role='alert' banner with
|
||||
the error; the result is cleared on a failure."""
|
||||
js = _text(SOURCES_JS)
|
||||
time of finished_at); failed → enabled + retry-ready 'Sync sources'
|
||||
label + the sanitized error in the button's title + aria-label +
|
||||
the .is-error class (non-Sources pages: that is where the failure
|
||||
is visible). The counts formatting (fmtSyncResult) lives here and
|
||||
is EXPORTED for the Sources page ('added' always announced, zero
|
||||
terms omitted — a no-op re-sync reads '0 added · 1 unchanged')."""
|
||||
js = _text(HEADER_JS)
|
||||
|
||||
success = _body(js, "applySyncSuccess")
|
||||
assert '"Synced"' in success and "fmtSyncTime(status.finished_at)" in success
|
||||
assert "fmtSyncResult(status.detail)" in success
|
||||
# A successful sync just changed the KB: the catalog re-fetches live
|
||||
# (table / stats / empty state never sit stale under "Synced").
|
||||
assert "loadDocs()" in success
|
||||
|
||||
failure = _body(js, "applySyncFailure")
|
||||
assert 'settleSyncButton("Sync sources")' in failure # retry-ready
|
||||
assert "showSyncError(status.error)" in failure
|
||||
assert "syncBtn.title = error" in failure
|
||||
assert 'syncBtn.setAttribute("aria-label", error)' in failure
|
||||
assert "syncBtn.classList.add(\"is-error\")" in failure
|
||||
assert "sanitizeSyncError(status.error)" in failure
|
||||
|
||||
result = _body(js, "fmtSyncResult")
|
||||
# "added" is the always-announced headline term; "unchanged" covers
|
||||
# the no-op case ("0 added · 1 unchanged"); updated/pruned are
|
||||
# zero-omitted.
|
||||
assert "added" in result and "unchanged" in result
|
||||
assert " · " in result
|
||||
assert "> 0" in result, "zero terms must be omitted"
|
||||
@@ -222,26 +236,38 @@ def test_sources_js_terminal_states() -> None:
|
||||
assert "getHours()" in time and "getMinutes()" in time, "local HH:MM of finished_at"
|
||||
|
||||
|
||||
def test_sources_js_settles_the_button_on_terminal() -> None:
|
||||
"""settleSyncButton re-enables the control, drops aria-busy, and
|
||||
un-spins the icon — the button can never sit disabled after a run
|
||||
reaches a terminal state (failed included: retry-ready)."""
|
||||
js = _text(SOURCES_JS)
|
||||
fn = js.find("function settleSyncButton")
|
||||
assert fn != -1
|
||||
body = js[fn : js.find("\n}", fn)]
|
||||
def test_header_js_failed_error_is_sanitized() -> None:
|
||||
"""The button's title/aria-label error is sanitized for the
|
||||
attributes: the server already masks credentials (sync.py
|
||||
_sanitize_error); the module collapses whitespace to a single line
|
||||
and caps the length, and a missing error still names a failure."""
|
||||
js = _text(HEADER_JS)
|
||||
body = _body(js, "sanitizeSyncError")
|
||||
assert "replace(/\\s+/g, \" \")" in body, "single line for the attributes"
|
||||
assert "200" in body, "long errors (chatty git stderr) are capped"
|
||||
assert '"The sync failed."' in body
|
||||
|
||||
|
||||
def test_header_js_settles_the_button_on_terminal() -> None:
|
||||
"""settleSyncButton re-enables the control, drops aria-busy, the
|
||||
title, and the failed affordances, and un-spins the icon — the
|
||||
button can never sit disabled after a run reaches a terminal state
|
||||
(failed included: retry-ready)."""
|
||||
js = _text(HEADER_JS)
|
||||
body = _body(js, "settleSyncButton")
|
||||
assert "syncBtn.disabled = false" in body
|
||||
assert 'syncBtn.removeAttribute("aria-busy")' in body
|
||||
assert 'syncBtn.removeAttribute("title")' in body
|
||||
assert 'syncBtn.setAttribute("aria-label", "Sync sources")' in body
|
||||
assert "syncIcon.classList.remove(\"is-spinning\")" in body
|
||||
|
||||
|
||||
def test_sources_js_never_starts_a_second_poll_loop() -> None:
|
||||
def test_header_js_never_starts_a_second_poll_loop() -> None:
|
||||
"""startSyncPolling is guarded by the module-level timer: a 409
|
||||
adoption, a reload re-attach, or a stray call can never run two
|
||||
poll loops at once (phase completion criterion)."""
|
||||
js = _text(SOURCES_JS)
|
||||
js = _text(HEADER_JS)
|
||||
fn = js.find("function startSyncPolling")
|
||||
assert fn != -1
|
||||
head = js[fn : js.find("const tick", fn)]
|
||||
assert re.search(r"if\s*\(\s*syncPollTimer\s*!==\s*null\s*\)\s*return", head), (
|
||||
"the single-loop guard must be the first statement"
|
||||
@@ -249,37 +275,103 @@ def test_sources_js_never_starts_a_second_poll_loop() -> None:
|
||||
assert "clearTimeout(syncPollTimer)" in _body(js, "stopSyncPolling")
|
||||
|
||||
|
||||
def test_sources_js_has_no_client_side_hard_timeout() -> None:
|
||||
"""Phase locked decision: a sync can legitimately run for minutes,
|
||||
so there is NO client-side hard timeout — the 2 s poll is the
|
||||
feedback loop and the server state is authoritative (the 120 s
|
||||
LLM-turn guard must not leak into the sync path)."""
|
||||
js = _text(SOURCES_JS)
|
||||
def test_header_js_has_no_client_side_hard_timeout() -> None:
|
||||
"""Phase locked decision: a sync can legitimately run for minutes
|
||||
(and outlive the page), so there is NO client-side hard timeout —
|
||||
the 2 s poll is the feedback loop and the server state is
|
||||
authoritative (the 120 s LLM-turn guard must not leak into the
|
||||
sync path)."""
|
||||
js = _text(HEADER_JS)
|
||||
assert "TURN_TIMEOUT" not in js
|
||||
assert "120" not in js[js.find("Phase 32") :], (
|
||||
"no turn-timeout constant in the sync section"
|
||||
)
|
||||
sync_start = js.find("sync sources (phase 32")
|
||||
assert sync_start != -1, "the sync section marker comment"
|
||||
assert "120" not in js[sync_start:]
|
||||
|
||||
|
||||
def test_sources_js_reattaches_on_load() -> None:
|
||||
"""initSyncButton (run from the IIFE on the admin path, after
|
||||
initSharedHeader) fetches the status once and re-enters the running
|
||||
state on 'running' (reload mid-sync) or renders the last result on
|
||||
a terminal state; the click binding wires startSync to the button."""
|
||||
js = _text(SOURCES_JS)
|
||||
def test_header_js_reattaches_on_load_admin_only() -> None:
|
||||
"""initSyncButton (run at module import, button pages only) awaits
|
||||
the SAME cached whoami — ADMIN ONLY (non-admins never poll, the
|
||||
status endpoint is admin-only): a running run re-enters the
|
||||
running state (reload mid-sync), a terminal run renders its last
|
||||
result, idle settles retry-ready; the click binding wires
|
||||
startSync to the button."""
|
||||
js = _text(HEADER_JS)
|
||||
fn = js.find("function initSyncButton")
|
||||
assert fn != -1
|
||||
body = js[fn : js.find("\n}\n", fn)]
|
||||
assert "await fetchIsAdmin()" in body, "admin-only boot (no extra fetch)"
|
||||
assert 'fetch("/api/sync/status")' in body
|
||||
assert 'status.state === "running"' in body
|
||||
assert 'status.state === "success"' in body
|
||||
assert 'status.state === "failed"' in body
|
||||
assert "syncBtn.addEventListener(\"click\", startSync)" in js
|
||||
# The IIFE runs it on the admin path only (after the whoami gate).
|
||||
iife = js[js.find("(async () => {") :]
|
||||
admin_idx = iife.find("await isAdmin()")
|
||||
init_idx = iife.find("initSyncButton();")
|
||||
assert -1 < admin_idx < init_idx, "re-attach must run only for the admin"
|
||||
tail = js[js.rfind("if (syncBtn)") :]
|
||||
assert "initSyncButton()" in tail, "boot re-attach runs at module import"
|
||||
|
||||
|
||||
def test_header_js_emits_bor_sync_status_on_state_changes() -> None:
|
||||
"""Every state change dispatches window 'bor:sync-status' with the
|
||||
status object as detail — the channel the Sources page's
|
||||
banner/result line subscribe to. The click path emits the
|
||||
synthetic running frame IMMEDIATELY (no 2 s poll lag — the exact
|
||||
old enterRunningState clear behavior, now event-driven)."""
|
||||
js = _text(HEADER_JS)
|
||||
assert (
|
||||
'window.dispatchEvent(new CustomEvent("bor:sync-status", { detail: status }))'
|
||||
in js
|
||||
)
|
||||
for fn in ("applySyncSuccess", "applySyncFailure", "applySyncIdle"):
|
||||
assert "emitSyncStatus" in _body(js, fn), f"{fn} must emit its frame"
|
||||
# the running frame: synthetic on click, the real object on boot
|
||||
assert 'emitSyncStatus({ state: "running" })' in js
|
||||
assert "emitSyncStatus(status)" in _body(js, "initSyncButton")
|
||||
|
||||
|
||||
# ---------- sources.js: the event-driven result line + banner ----------
|
||||
|
||||
|
||||
def test_sources_js_renders_off_the_sync_status_event() -> None:
|
||||
"""The Sources page keeps ONLY its page-specific rendering:
|
||||
#sync-result (aria-live) + #sync-error-banner (role=alert), driven
|
||||
by the module's 'bor:sync-status' event (detail = the status
|
||||
object): running → clear + hide; success → the counts (the
|
||||
imported fmtSyncResult) + a live catalog refresh; failed → the
|
||||
banner with the error; idle → hide + clear."""
|
||||
js = _text(SOURCES_JS)
|
||||
assert 'window.addEventListener("bor:sync-status"' in js
|
||||
assert 'status.state === "running"' in js
|
||||
assert 'status.state === "success"' in js
|
||||
assert 'status.state === "failed"' in js
|
||||
assert "fmtSyncResult(status.detail)" in js
|
||||
assert "loadDocs()" in js, "the catalog re-fetches live on a successful sync"
|
||||
assert "showSyncError(status.error)" in js
|
||||
assert "syncResult.textContent" in js
|
||||
|
||||
|
||||
def test_sources_js_no_longer_owns_the_sync_machine() -> None:
|
||||
"""The state machine is GONE from sources.js (header.js owns it):
|
||||
no button refs, no POST, no status poll, no button-state helpers,
|
||||
no click binding, no load re-attach."""
|
||||
js = _text(SOURCES_JS)
|
||||
for gone in (
|
||||
"SYNC_POLL_MS",
|
||||
"syncPollTimer",
|
||||
"startSyncPolling",
|
||||
"stopSyncPolling",
|
||||
"enterRunningState",
|
||||
"settleSyncButton",
|
||||
"applySyncSuccess",
|
||||
"applySyncFailure",
|
||||
"applySyncIdle",
|
||||
"initSyncButton",
|
||||
"startSync",
|
||||
'fetch("/api/sync", { method: "POST" })',
|
||||
'fetch("/api/sync/status")',
|
||||
'querySelector("#sync-btn")',
|
||||
'querySelector("#sync-label")',
|
||||
'querySelector(".sync-icon")',
|
||||
):
|
||||
assert gone not in js, f"{gone!r} must be gone from sources.js (header.js owns it)"
|
||||
|
||||
|
||||
# ---------- styles.css: the §7.4 states ----------
|
||||
|
||||
Reference in New Issue
Block a user