All verification is complete — this pass needed no code changes. Final report: **Phase 91 — Admin Theme tab: final verification pass (all 6 tasks already in `complete/`)** - Verified pre-paint theming end-to-end: `ui_settings` store + resolver, admin `GET/PUT /api/ui-settings`, `CachingMiddleware` inline-`<style id="bor-theme">` injection before `</head>` (incl. `/shared/<token>` prefix branch, unit-pinned), CSP sha256 exemption for the inline tag, Theme tab shell + `theme.js` editor, CSS-file theming fully retired. - No defects found; zero changes made — working tree left exactly as the task executors left it. - Tests: `uv run pytest --cov=app` → 1841 passed, 0 failed (TOTAL coverage **99%**; theming/ui_settings/caching all 100%); `uv run pytest tests/e2e/test_admin_theme_tab.py -v --no-cov` → **5 passed** in isolation. - Lint/types: `uv run ruff check .` → All checks passed; `uv run pyright` → 0 errors, 0 warnings. - Criteria: (1) unset deployment byte-identical, no `#bor-theme` anywhere — ✓ (unit no-op test + E2E reset byte-compare); `rg "BOR_THEME|themes/"` → single hit is the permitted doc-history comment in `frontend/index.html`. (2) admin-only gate + 403s for anonymous and token users — ✓ (E2E test 3). (3) saved theme inline before `</head>` on every page incl. `/shared/<token>`, computed `--brand` on first paint for admin + anonymous — ✓ (E2E test 2 + unit). (4) reset → byte-identical; 5 contrast pairs warn <4.5:1, non-blocking — ✓ (E2E tests 4–5). (5) suite green, >90% coverage, lint clean — ✓. (6) commit deferred to harness per rules. - Notable: `.agents/PLAN.md` is absent from the repo — the phase overview's Design section was used as the binding spec; no deviation resulted. - Next pending phase: **none** — 91 is the last phase in `todo/`.
208 lines
8.4 KiB
Python
208 lines
8.4 KiB
Python
"""Unit: the 2x reading column on wide desktops (phase 58, task 01).
|
|
|
|
The measured-width browser proof is E2E-gated by the phase-58 story
|
|
suite (task 02); like the other frontend-adjacent unit files (the
|
|
test_save_chat_ui.py pattern), this module pins the styles.css markers
|
|
the wide-column contract depends on, so a silent regression is caught
|
|
without a browser:
|
|
|
|
* the ``--chat-column`` custom property in ``:root`` — 46rem base
|
|
(the PLAN §7 column lineage) with the provenance comment (owner
|
|
instruction 2026-08-31, TODO L5 / D2);
|
|
* the ``@media (min-width: 1500px)`` block at the bottom of the
|
|
responsive region — the SINGLE place that doubles the token to
|
|
92rem (2x);
|
|
* the four reading-column selectors — ``.chat-shell``,
|
|
``.shared-shell``, ``.doc-md``, ``.doc-summary:has(+ .doc-md)`` —
|
|
each capped with ``max-width: var(--chat-column)`` and NOTHING else
|
|
in the file uses the token (exactly four rules);
|
|
* the negative pin — the form columns (``.tuning-shell``; and from
|
|
phase 59, task 06, ``.doc-edit-shell`` — forms, not reading
|
|
surfaces) are the only literal ``max-width: 46rem`` rules left in
|
|
the file, kept hard-coded so the wide-desktop doubling never
|
|
stretches a form;
|
|
* the "46rem column contract" block comments were updated to name the
|
|
base value + the wide override (the stale "≤46rem" contract claims
|
|
are gone from the reading-column comments).
|
|
"""
|
|
from __future__ import annotations
|
|
|
|
import re
|
|
from pathlib import Path
|
|
|
|
FRONTEND = Path(__file__).resolve().parents[2] / "frontend"
|
|
STYLES_CSS = FRONTEND / "assets" / "styles.css"
|
|
|
|
|
|
def _css() -> str:
|
|
return STYLES_CSS.read_text(encoding="utf-8")
|
|
|
|
|
|
def _rule_block(css: str, selector: str) -> str:
|
|
"""The declaration block of a top-level (or nested) rule: the
|
|
``{…}`` following ``selector`` via balanced-brace counting."""
|
|
m = re.search(rf"^{re.escape(selector)} \{{", css, re.MULTILINE)
|
|
assert m, f"styles.css must define a rule for {selector}"
|
|
start = css.index("{", m.start())
|
|
depth = 0
|
|
for i in range(start, len(css)):
|
|
if css[i] == "{":
|
|
depth += 1
|
|
elif css[i] == "}":
|
|
depth -= 1
|
|
if depth == 0:
|
|
return css[start : i + 1]
|
|
raise AssertionError(f"unbalanced braces in the {selector} rule")
|
|
|
|
|
|
# ---------- the --chat-column token ----------
|
|
|
|
|
|
def test_root_declares_chat_column_46rem_base() -> None:
|
|
""":root declares --chat-column: 46rem (the PLAN §7 base) with the
|
|
owner-provenance comment (instruction 2026-08-31, TODO L5)."""
|
|
css = _css()
|
|
root = _rule_block(css, ":root")
|
|
assert "--chat-column: 46rem" in root, (
|
|
":root must declare the --chat-column base (46rem)"
|
|
)
|
|
pre = css[: css.index("--chat-column: 46rem")]
|
|
comment = pre[pre.rindex("/*") : pre.rindex("*/")]
|
|
assert "owner instruction 2026-08-31" in comment, (
|
|
"the token's comment must cite the owner instruction "
|
|
"(2026-08-31, TODO L5)"
|
|
)
|
|
|
|
|
|
def test_wide_media_block_doubles_the_token() -> None:
|
|
"""A @media (min-width: 1500px) block sets --chat-column: 92rem on
|
|
:root — the single wide override (2x the base)."""
|
|
css = _css()
|
|
m = re.search(r"@media \(min-width: 1500px\) \{", css)
|
|
assert m, "styles.css must carry the @media (min-width: 1500px) block"
|
|
start = css.index("{", m.start())
|
|
depth = 0
|
|
for i in range(start, len(css)):
|
|
if css[i] == "{":
|
|
depth += 1
|
|
elif css[i] == "}":
|
|
depth -= 1
|
|
if depth == 0:
|
|
block = css[m.start() : i + 1]
|
|
break
|
|
else:
|
|
raise AssertionError("unbalanced braces in the wide media block")
|
|
assert ":root { --chat-column: 92rem; }" in block, (
|
|
"the wide block must set :root { --chat-column: 92rem; }"
|
|
)
|
|
# The wide block is the ONLY min-width:1500 media in the file and
|
|
# the only place 92rem is assigned to the token.
|
|
assert css.count("@media (min-width: 1500px)") == 1
|
|
assert css.count("--chat-column: 92rem") == 1
|
|
|
|
|
|
def test_wide_block_lives_in_the_bottom_responsive_region() -> None:
|
|
"""The min-width sibling sits alongside the max-width responsive
|
|
blocks at the bottom of the file (after the <=640px block)."""
|
|
css = _css()
|
|
wide = css.index("@media (min-width: 1500px)")
|
|
mobile = css.rindex("@media (max-width: 640px)")
|
|
assert wide > mobile, (
|
|
"the wide override belongs in the bottom media-query region"
|
|
)
|
|
|
|
|
|
# ---------- the four reading-column selectors ----------
|
|
|
|
|
|
def test_the_four_reading_columns_use_the_token() -> None:
|
|
""".chat-shell, .shared-shell, .doc-md and
|
|
.doc-summary:has(+ .doc-md) each cap with
|
|
max-width: var(--chat-column) — and exactly those four rules use
|
|
the token (no other selector)."""
|
|
css = _css()
|
|
for selector in (
|
|
".chat-shell",
|
|
".shared-shell",
|
|
".doc-md",
|
|
".doc-summary:has(+ .doc-md)",
|
|
):
|
|
assert "max-width: var(--chat-column)" in _rule_block(css, selector), (
|
|
f"{selector} must cap with max-width: var(--chat-column)"
|
|
)
|
|
assert css.count("max-width: var(--chat-column)") == 4, (
|
|
"exactly the four reading-column selectors use the token"
|
|
)
|
|
|
|
|
|
def test_shared_shell_keeps_the_centered_column_comment() -> None:
|
|
""".shared-shell's inline comment keeps the "centered chat column"
|
|
wording and notes the wide override (task 01 work item)."""
|
|
css = _css()
|
|
rule = css[css.index(".shared-shell {") : css.index(".shared-shell {") + 400]
|
|
assert "the PLAN §7 centered chat column" in rule
|
|
assert "92rem at >=1500px" in rule, "the comment must note the wide override"
|
|
|
|
|
|
def test_doc_md_keeps_width_100_under_the_cap() -> None:
|
|
""".doc-md stays width:100% under the token cap (the modal's
|
|
1100px panel remains its effective ceiling there)."""
|
|
assert "width: 100%" in _rule_block(_css(), ".doc-md")
|
|
|
|
|
|
# ---------- the negative pins ----------
|
|
|
|
|
|
def test_tuning_shell_stays_hardcoded_46rem() -> None:
|
|
""".tuning-shell (the form column, out of scope) keeps its
|
|
hard-coded max-width: 46rem at every width — it never widens."""
|
|
css = _css()
|
|
tuning = _rule_block(css, ".tuning-shell")
|
|
assert "max-width: 46rem" in tuning, (
|
|
".tuning-shell must stay hard-coded 46rem (negative pin)"
|
|
)
|
|
assert "var(--chat-column)" not in tuning, (
|
|
".tuning-shell must NOT reference the reading-column token"
|
|
)
|
|
|
|
|
|
def test_no_other_hardcoded_46rem_rule_remains() -> None:
|
|
"""After the switch, the form columns are the ONLY rules with a
|
|
literal max-width: 46rem: .tuning-shell (phase 27),
|
|
.doc-edit-shell (phase 59, task 06 — the doc edit screen is a
|
|
FORM column, not a reading column, so it must not ride
|
|
--chat-column and phase 58's wide-desktop doubling must never
|
|
stretch the form), and .theme-shell (phase 91 task 04 — the
|
|
admin Theme editor is a form column too: the palette grid +
|
|
fieldsets must never ride the wide-desktop doubling). Every
|
|
reading column rides the token (the --chat-column base
|
|
declaration is the other non-rule occurrence of 46rem)."""
|
|
css = _css()
|
|
assert css.count("max-width: 46rem") == 3, (
|
|
"only the form columns (.tuning-shell, .doc-edit-shell, "
|
|
".theme-shell) may keep a literal max-width: 46rem"
|
|
)
|
|
assert "max-width: 46rem" in _rule_block(css, ".tuning-shell")
|
|
assert "max-width: 46rem" in _rule_block(css, ".doc-edit-shell")
|
|
assert "max-width: 46rem" in _rule_block(css, ".theme-shell")
|
|
|
|
|
|
def test_comments_cite_the_wide_override_with_provenance() -> None:
|
|
"""The block comments that claimed the "46rem column contract" now
|
|
name base 46rem + the 2x wide override, with the owner
|
|
instruction (2026-08-31, TODO L5) as the provenance at the token
|
|
and the media block."""
|
|
css = _css()
|
|
# The stale "≤46rem" contract claims are gone from the file.
|
|
assert "≤46rem" not in css, (
|
|
"the stale '≤46rem' contract wording must be updated"
|
|
)
|
|
# Provenance at the two authoritative spots (token + wide block).
|
|
token_idx = css.index("--chat-column: 46rem")
|
|
wide_idx = css.index("@media (min-width: 1500px)")
|
|
assert "owner instruction 2026-08-31" in css[max(0, token_idx - 400) : token_idx]
|
|
assert "owner instruction 2026-08-31" in css[max(0, wide_idx - 500) : wide_idx]
|
|
# The chat-shell comment names base + override.
|
|
chat_comment = css[: css.index(".chat-shell {")]
|
|
assert "46rem base" in chat_comment and "92rem" in chat_comment
|