Pull requests / #2556

#2556 web: the header pill's live region says the state when it changes, not the speed every second

closed · @qiuzan2001 · 0 comentarios · En GitHub

BenchmarksServer & APISecurity

Descripción

**What it changes.** The status pill in the header was `role="status" aria-live="polite"`, and `render()` rewrote its text on every one-second poll of `/metrics`, with a number that changes each time while a request runs ("Generating · 45.3 tok/s", "Reading prompt · 37%"). A screen reader read the pill about once a second for the whole answer. Now:

- the live region is a visually hidden span (`#pill-say`, `role="status" aria-live="polite"`) that gets only the state: the text before " · " ("Generating", "Reading prompt", "Idle", "2 queued", "API key needed", "Server not reachable"), and only when it changes;
- `render()` sets the pill once per poll: it set the state and then "N queued" over it, so with a queue the region changed twice a second;
- a `.st-sr` rule (the usual clip pattern) in `app.css`.

**What it leaves alone.** What the pill shows and its colour states; its text stays in the page and readable on demand. On phones, where `#pill-text` is hidden (`display: none` below 640 px), the old live region announced nothing; the new one announces the state there too.

**How it was checked.**
- Headless Chromium (Playwright) with `/health` and `/metrics` faked in the page (no server load): 3 s idle, 6 s generating with tok/s changing every poll, then idle, with a MutationObserver on every `role="status"` element for 12.5 s:
  - before: 12 changes (one per poll, idle included), 6 different "Generating · N tok/s" texts;
  - after: 2 changes ("Generating", "Idle"); with 2 requests queued for 4 s: 4 changes (Generating, 2 queued, Generating, Idle).
- Header screenshots before and after are byte-identical at 1280 x 800 and 390 x 800; no horizontal scroll at either width.
- New `WebApp.test_the_status_pill_announces_states_not_numbers`. `python -m unittest serve.test_server serve.test_security serve.test_frontend serve.test_request_hardening serve.test_monitor serve.test_runconfig`: all pass.

Independent of #2546 (the Sampling drawer's focus); the two touch different lines.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

En el sitio

Enlaces a install, modelos, releases.