phase: 100_page_width_consistency
**Phase 100 — final verification pass: all green.** - Verified the shipped CSS contract directly: `--chat-column: 72rem` in `:root`; 0 literal `max-width: 46rem`; no `@media (min-width: 1500px)` block; exactly 4 token-capped reading columns; tuning/theme/doc-edit shells cap-free, structurally `.sources-shell`; `mock_llm.py` diff is comment-only. - Defect found & fixed (phase-93 suite): `test_theme_semantic_completion.py::test_reset_removes_tag_byte_identical` raced theme.js's post-PUT refetch — it asserted the `#bor-theme` tag was gone right after the result line, but tag removal lands in the reconcile after the re-fetch (failed ~1 in 5 runs after `test_chat_rag`, reproduced). Fixed with an auto-waiting `expect(...).to_have_count(0)` (settled-state wait, the file's existing house pattern). 6/6 clean on the repro loop after. - Tests/lint/coverage: `uv run pytest --cov=app --cov-report=term-missing` → 2052 passed, **99%** on `app/`; `uv run ruff check .` + `uv run pyright` → 0 errors. - E2E in isolation (all passed): `test_wide_desktop_column.py` 3 (the phase suite — chat==tuning==theme==RAG ±4px at 1280 & 1920, ≈1152px; shared ≈1152px; standalone doc ≈1112px; modal unchanged ≈1100px; 360px overflow-free), `test_ui_customization` 4, `test_admin_theme_tab` 5, `test_document_viewer` 7, `test_save_share_ux` 5, `test_sticky_navbar` 3, `test_markdown_tables` 6, `test_responsive_polish` 7, `test_chat_rag` 3, `test_theme_semantic_completion` 8. - Completion criteria: ① measured 72rem everywhere (≥~1200px, ±4px) + full-width below + 360px clean — **PASS** (E2E); ② zero 46rem rules / no 1500px block / four token selectors — **PASS** (grep + unit pins); ③ B4 byte-identical no-op + mobile squeeze — **PASS** (theme + responsive suites green); ④ full suite / coverage / lint — **PASS**; ⑤ atomic commit — left to the harness per executor protocol (all changes in the working tree, uncommitted). - Deviations: none from phase decisions; only change in this pass is the race fix above (test-only, behavior unchanged). - Next pending phase: `98_sync_summary_visibility` (numeric order in `todo/`; also pending: 99, 101–105).
This commit is contained in:
@@ -12,12 +12,13 @@ Test → story mapping:
|
||||
1. ``test_no_horizontal_overflow_at_viewports`` — 360/375/768/1280/1600 on
|
||||
both pages: ``documentElement.scrollWidth <= clientWidth``.
|
||||
2. ``test_chat_column_capped_and_centered`` — the reading column rides
|
||||
--chat-column (46rem base; 92rem at >=1500px, phase 58 / owner
|
||||
instruction 2026-08-31 TODO L5): at 1600px (a wide desktop) the
|
||||
``.chat-shell`` is 92rem (1472px, ±2%) and horizontally centered
|
||||
(±2%); at 1280px (below the wide breakpoint) it stays ≤ 46rem
|
||||
(736px, +2%); at 768px the column uses most of the width (no
|
||||
mid-column dead zones).
|
||||
--chat-column (72rem — EQUAL to the .container's cap at every
|
||||
viewport, phase 100 / owner instruction 2026-09-12: the 46rem base
|
||||
+ the >=1500px 92rem doubling are retired): at 1600px (a wide
|
||||
desktop) the ``.chat-shell`` is the 72rem container (1152px, ±2%)
|
||||
and horizontally centered (±2%); at 1280px the same 1152px (the
|
||||
container cap binds, not the viewport); at 768px the column is
|
||||
full-width (no mid-column dead zones).
|
||||
3. ``test_sources_table_full_width`` — at 1280px ``.table-wrap`` ≥ 80% of
|
||||
the container; below 640px the table keeps its 640px min-width and the
|
||||
wrapper scrolls horizontally instead of squeezing.
|
||||
@@ -55,8 +56,11 @@ REPO = Path(__file__).resolve().parents[2]
|
||||
FIXTURES = REPO / "tests" / "fixtures" / "docs"
|
||||
|
||||
VIEWPORTS = ((360, 740), (375, 812), (768, 1024), (1280, 800), (1600, 900))
|
||||
CHAT_SHELL_CAP_PX = 46 * 16 # 736px — the --chat-column base (PLAN §7.1 lineage)
|
||||
CHAT_SHELL_WIDE_PX = 92 * 16 # 1472px — the 2x wide override (phase 58, >=1500px)
|
||||
# Phase 100: the ONE width — the 72rem container, border-box (the
|
||||
# 2×1.25rem gutters are inside the measured box). The 46rem base and
|
||||
# the 92rem wide-desktop doubling are retired (owner instruction
|
||||
# 2026-09-12: "match the width of the RAG page for all other pages").
|
||||
CHAT_SHELL_CONTAINER_PX = 72 * 16 # 1152px — the --chat-column = container cap
|
||||
|
||||
# Mock-LLM marker for a 3s pre-token window (see tests/e2e/mock_llm.py).
|
||||
SLOW_QUESTION = "pretend to think slowly, please"
|
||||
@@ -225,18 +229,19 @@ def test_no_horizontal_overflow_at_viewports(
|
||||
def test_chat_column_capped_and_centered(
|
||||
browser: Browser, app_url: str, db_ready: None
|
||||
) -> None:
|
||||
"""AC1 (phase 58 contract): the reading column doubles to 92rem on
|
||||
wide desktops (>=1500px — 1600px here), stays at the 46rem base
|
||||
below the breakpoint (1280px), and still uses most of the width on
|
||||
tablets (no mid-column dead zones)."""
|
||||
"""AC1 (phase 100 contract): the reading column is the 72rem
|
||||
container at every viewport — 1600px here (the cap binds, not the
|
||||
viewport) and 1280px alike (1152px, ±2%, centered), and still
|
||||
full-width on tablets (no mid-column dead zones). The phase-58
|
||||
46rem/92rem contract it used to pin is retired."""
|
||||
page = browser.new_page(viewport={"width": 1600, "height": 900})
|
||||
try:
|
||||
page.goto(f"{app_url}/")
|
||||
box = page.locator(".chat-shell").bounding_box()
|
||||
assert box is not None
|
||||
assert CHAT_SHELL_WIDE_PX * 0.98 <= box["width"] <= CHAT_SHELL_WIDE_PX * 1.02, (
|
||||
f"at 1600px (>=1500px) the chat column is {box['width']:.0f}px, "
|
||||
f"not the 92rem wide override (±2%)"
|
||||
assert CHAT_SHELL_CONTAINER_PX * 0.98 <= box["width"] <= CHAT_SHELL_CONTAINER_PX * 1.02, (
|
||||
f"at 1600px the chat column is {box['width']:.0f}px, "
|
||||
f"not the 72rem container (1152px, ±2%)"
|
||||
)
|
||||
center = box["x"] + box["width"] / 2
|
||||
assert abs(center - 1600 / 2) <= 0.02 * 1600, (
|
||||
@@ -250,9 +255,11 @@ def test_chat_column_capped_and_centered(
|
||||
narrow.goto(f"{app_url}/")
|
||||
box = narrow.locator(".chat-shell").bounding_box()
|
||||
assert box is not None
|
||||
assert box["width"] <= CHAT_SHELL_CAP_PX * 1.02, (
|
||||
f"at 1280px (<1500px) the chat column {box['width']:.0f}px exceeds "
|
||||
f"the 46rem base cap (+2%)"
|
||||
# 1280 > 1152: the container cap binds — the SAME 72rem width as
|
||||
# at 1600px (the cap no longer depends on the viewport at all).
|
||||
assert box["width"] <= CHAT_SHELL_CONTAINER_PX * 1.02, (
|
||||
f"at 1280px the chat column {box['width']:.0f}px exceeds "
|
||||
f"the 72rem container cap (+2%)"
|
||||
)
|
||||
finally:
|
||||
narrow.close()
|
||||
|
||||
Reference in New Issue
Block a user