Files
odysseus/tests/test_document_editor_background_static.py
T
Léo e3eb7137b7 refactor(css): move document, gallery and image-editor styles to their own file
static/style.css is 51,425 lines and holds every panel's styles, so two
people working on unrelated panels still edit the same file. This is the
first of three steps that give each panel group its own stylesheet. It moves
the document library, image gallery and image editor rules that can move
into static/css/documents-gallery-editor.css.

The new file is loaded eagerly from index.html immediately after style.css,
so the cascade is the concatenation of the two in that order, which is the
order those rules already had. Nothing is deferred and nothing renders
differently.

Rules moved verbatim. A rule stays in style.css when its selector group
covers more than one panel, when the class is shared design language used
from modules outside the panel, or when moving it would flip which of two
equally specific rules wins on an element the markup puts both classes on.
That last rule is what keeps this change small: most panel-prefixed rules on
this branch compete with a shared component rule somewhere later in the file.

Nineteen tests read static/style.css directly and go red the moment a rule
they assert on moves, which says nothing about the page. They now go through
tests/helpers/stylesheets.app_css(), which concatenates the stylesheets in
the order index.html loads them. The helper also exposes the <link> markup
for tests that build a synthetic page through Playwright.
2026-09-23 16:12:51 +02:00

75 lines
2.9 KiB
Python

from pathlib import Path
import re
from tests.helpers.stylesheets import app_css
CSS = app_css()
def rule_for(selector: str) -> str:
match = re.search(rf"(?m)^{re.escape(selector)}\s*(.*?)\n\}}", CSS, re.DOTALL)
assert match, f"missing CSS rule for {selector}"
return match.group(1)
def test_document_editor_uses_main_background_at_rest_and_during_interaction():
base_rule = CSS.split(".doc-editor-textarea {", 1)[1].split("}", 1)[0]
interaction_rule = CSS.split(".doc-editor-textarea:hover,", 1)[1].split("}", 1)[0]
assert "background: var(--bg) !important;" in base_rule
assert "background: var(--bg) !important;" in interaction_rule
def test_document_editor_surfaces_do_not_bleed_sidebar_background():
for selector in (".doc-editor-wrap {", ".doc-line-numbers {", ".doc-email-richbody.richtext-mode {"):
rule = rule_for(selector)
assert "background: var(--bg);" in rule
assert "sidebar-bg" not in rule
highlight_rule = rule_for(".doc-editor-highlight {")
assert "background: var(--bg) !important;" in highlight_rule
def test_saved_document_button_uses_regular_foreground_color():
saved_rule = CSS.split('.doc-save-button[data-save-state="saved"]', 1)[1].split("}", 1)[0]
assert "color: var(--fg);" in saved_rule
assert "success" not in saved_rule
def test_compact_email_type_picker_is_left_aligned():
rule = CSS.split(".doc-langpicker-trigger.doc-langpicker-email-compact {", 1)[1].split("}", 1)[0]
assert "justify-content: flex-start;" in rule
assert "padding: 0 0 0 6px;" in rule
def test_active_markdown_view_tabs_use_main_background():
active_rule = rule_for(".md-view-toggle .md-view-opt.active {")
write_rule = rule_for(".doc-md-toolbar.md-write-active #doc-md-view-toggle .md-view-opt.active {")
assert "background: var(--bg) !important;" in active_rule
assert "background: var(--bg) !important;" in write_rule
assert "sidebar-bg" not in write_rule
preview_surface_rule = rule_for(".doc-md-preview.md-preview-active {")
assert "background: var(--bg);" in preview_surface_rule
assert "border-top: 0;" in preview_surface_rule
first_tab_rule = rule_for(".md-view-toggle .md-view-opt:first-child,")
last_tab_rule = rule_for(".md-view-toggle .md-view-opt:last-child,")
assert "background: var(--sidebar-bg, var(--panel)) !important;" in first_tab_rule
assert "background: var(--sidebar-bg, var(--panel)) !important;" in last_tab_rule
toolbar_rule = rule_for(".doc-md-toolbar {")
assert "border-bottom: 1px solid var(--border);" in toolbar_rule
assert "background: var(--sidebar-bg, var(--panel));" in toolbar_rule
def test_rich_text_highlight_icon_uses_toolbar_accent_styling():
rule = rule_for(".rich-highlight-icon {")
assert "display: block;" in rule
assert "flex-shrink: 0;" in rule
assert "color: var(--accent-primary, var(--red));" in rule
assert "#fff" not in rule