"""Structural and Playwright tests for the generated order form."""
from __future__ import annotations
import base64
import json
import re
import sys
from pathlib import Path
import pytest
REPO_ROOT = Path(__file__).resolve().parents[1]
SERVER_DIR = REPO_ROOT / "src" / "server"
FIXTURES = Path(__file__).resolve().parent / "fixtures"
sys.path.insert(0, str(SERVER_DIR))
from generate_form import generate_form # noqa: E402
EXPECTED_CONFIG_KEYS = {
"authMode",
"meals",
"roster",
"week",
"submitUrl",
"statusUrl",
"rosterUrl",
"adminUrl",
"adminPdfUrl",
"apiKey",
"bulkDiscount",
"companySubsidy",
"googleClientId",
"deadline",
"scrapedAt",
"hasDiscount",
}
def _load_fixtures():
menu = json.loads((FIXTURES / "menu.json").read_text())
config = json.loads((FIXTURES / "config.json").read_text())
return menu, config
def _extract_config(html: str) -> dict:
match = re.search(
r"window\.CONFIG\s*=\s*(\{.*?\});",
html,
flags=re.DOTALL,
)
assert match, "window.CONFIG blob not found"
return json.loads(match.group(1))
def _render(*, google: bool = False, api_key: str = "test-key") -> str:
menu, config = _load_fixtures()
return generate_form(
menu,
config,
api_url="https://api.example.com",
api_key=api_key,
bulk_discount=10,
company_subsidy=50,
google_client_id="google-client.apps.googleusercontent.com" if google else "",
)
def _google_credential() -> str:
payload = json.dumps(
{
"name": "Test Admin",
"email": "test-admin@example.com",
"picture": (
"data:image/svg+xml,"
""
),
}
).encode()
encoded = base64.urlsafe_b64encode(payload).decode().rstrip("=")
return f"e30.{encoded}.signature"
class TestGenerateFormStructural:
def test_local_and_google_render(self):
local = _render(google=False)
google = _render(google=True)
assert "FORM_HTML_MARKER" in local
assert "FORM_HTML_MARKER" in google
assert 'id="emp-name"' in local
assert 'id="emp-name"' not in google
assert "accounts.google.com/gsi/client" in google
assert "accounts.google.com/gsi/client" not in local
assert 'id="auth-overlay"' in google
assert 'id="auth-overlay"' not in local
def test_single_config_blob_and_keys(self):
for google in (False, True):
html = _render(google=google)
assert html.count("window.CONFIG =") == 1
cfg = _extract_config(html)
assert EXPECTED_CONFIG_KEYS <= set(cfg.keys())
assert cfg["authMode"] == ("google" if google else "local")
if google:
assert cfg["googleClientId"]
else:
assert cfg["googleClientId"] == ""
assert cfg["bulkDiscount"] == 10
assert cfg["companySubsidy"] == 50
assert cfg["hasDiscount"] is True
def test_no_legacy_const_injections(self):
html = _render(google=True)
for pattern in (
r"\bconst MEALS\s*=",
r"\bconst ROSTER\s*=",
r"\bconst SUBMIT_URL\s*=",
r"\bconst STATUS_URL\s*=",
r"\bconst ROSTER_URL\s*=",
r"\bconst ADMIN_URL\s*=",
r"\bconst ADMIN_PDF_URL\s*=",
r"\bconst API_KEY\s*=",
r"\bconst GOOGLE_CLIENT_ID\s*=",
):
# Locals derived from CONFIG inside form.js are fine; generator must not
# inject the seven top-level const lines before the inlined scripts.
pre_js = html.split("/* FORM_JS_MARKER */")[0]
assert not re.search(pattern, pre_js), pattern
def test_template_markers_inlined(self):
html = _render()
assert "FORM_CSS_MARKER" in html
assert "--color-brand" in html
assert "FORM_JS_MARKER" in html
assert "ADMIN_JS_MARKER" in html
assert "FORM_HTML_MARKER" in html
assert '" not in html
cfg_match = re.search(r"window\.CONFIG\s*=\s*(\{.*?\});", html, flags=re.DOTALL)
assert cfg_match
blob = cfg_match.group(1)
# Literal inside the CONFIG script would terminate early.
assert "" not in blob
# Parsed JSON still contains the hostile meal name.
cfg = json.loads(blob)
assert any(
m["name"] == "" for m in cfg["meals"]
)
def test_hostile_names_present_in_config(self):
cfg = _extract_config(_render())
names = {m["name"] for m in cfg["meals"]}
assert "Luis' Lomo Saltado" in names
assert 'Meal with "quotes"' in names
assert "" in names
assert "" in names
def test_meal_card_template_and_qty_input(self):
html = _render()
assert 'id="meal-card-tpl"' in html
assert 'type="number"' in html
assert "data-meal-index" in html
assert "data-qty-delta" in html
def test_design_tokens_only_in_definitions(self):
css = (SERVER_DIR / "templates" / "form.css").read_text()
# Strip :root block, then assert brand/muted/border hexes are gone
without_root = re.sub(r":root\s*\{[^}]*\}", "", css, count=1)
assert "#1a1a2e" not in without_root
assert "#6b7280" not in without_root
assert "#d1d5db" not in without_root
def test_python_has_no_html_js_fragments(self):
src = (SERVER_DIR / "generate_form.py").read_text()
assert "auth_section_html" not in src
assert "google_auth_js" not in src
assert "submit_order_js" not in src
assert "origLoadWeekOrders" not in src
class TestGenerateFormPlaywright:
@pytest.fixture
def browser_page(self, tmp_path_factory):
sync_api = pytest.importorskip("playwright.sync_api")
sync_playwright = sync_api.sync_playwright
html = _render(google=False, api_key="")
# Stub status/roster so the page does not hang on network; roster fallback
# in loadRoster still applies if fetch fails — intercept to be deterministic.
out = tmp_path_factory.mktemp("form") / "order-form.html"
out.write_text(html)
with sync_playwright() as p:
try:
browser = p.chromium.launch(headless=True)
except Exception as exc:
raise RuntimeError(
"Chromium is required for form Playwright tests. "
"Run: playwright install --with-deps chromium"
) from exc
try:
page = browser.new_page()
page.route(
"**/api/form-status/**",
lambda route: route.fulfill(
status=200,
content_type="application/json",
body='{"status":"open"}',
),
)
page.route(
"**/api/roster**",
lambda route: route.fulfill(
status=200,
content_type="application/json",
body=json.dumps(
{
"employees": [
{
"name": "Ada Lovelace",
"email": "ada@example.com",
}
]
}
),
),
)
page.goto(out.as_uri())
page.wait_for_selector('[data-meal-index="0"]')
yield page
finally:
browser.close()
def test_admin_bundle_loads(self, browser_page):
assert browser_page.evaluate("typeof window.loadWeekOrders") == "function"
def test_qty_plus_updates_total_without_list_teardown(self, browser_page):
page = browser_page
card = page.locator('[data-meal-index="0"]')
card_handle = card.element_handle()
assert card_handle is not None
page.locator('[data-meal-index="0"] [data-qty-delta="1"]').click()
page.wait_for_function(
"() => document.getElementById('total-display').textContent !== '$0.00'"
)
assert page.locator("#total-display").inner_text() == "$5.40"
assert page.locator("#count-display").inner_text() == "1 meal"
assert page.locator('[data-meal-index="0"] .qty').input_value() == "1"
assert "selected" in (card.get_attribute("class") or "")
# Same DOM node — partial update, not full list teardown
page.evaluate(
"""() => {
const el = document.querySelector('[data-meal-index="0"]');
el.dataset.teardownProbe = '1';
}"""
)
page.locator('[data-meal-index="0"] [data-qty-delta="1"]').click()
page.wait_for_function(
"() => document.querySelector('[data-meal-index=\"0\"] .qty').value === '2'"
)
assert (
page.locator('[data-meal-index="0"]').get_attribute("data-teardown-probe")
== "1"
)
assert page.locator("#count-display").inner_text() == "2 meals"
assert page.locator("#total-display").inner_text() == "$10.80"
def test_qty_typein_clamps_negative(self, browser_page):
page = browser_page
# Reset first card via type-in
qty = page.locator('[data-meal-index="0"] .qty')
qty.fill("-3")
qty.blur()
page.wait_for_function(
"() => document.querySelector('[data-meal-index=\"0\"] .qty').value === '0'"
)
assert qty.input_value() == "0"
qty.fill("2")
qty.blur()
page.wait_for_function(
"() => document.getElementById('count-display').textContent === '2 meals'"
)
assert page.locator("#total-display").inner_text() == "$10.80"
@pytest.mark.parametrize("width", [320, 375, 479])
def test_local_roster_has_no_horizontal_overflow(self, browser_page, width):
page = browser_page
page.set_viewport_size({"width": width, "height": 800})
dimensions = page.evaluate(
"""() => ({
scrollWidth: document.documentElement.scrollWidth,
clientWidth: document.documentElement.clientWidth,
})"""
)
assert dimensions["scrollWidth"] == dimensions["clientWidth"]
class TestGenerateFormGooglePlaywright:
@pytest.fixture(scope="class")
@classmethod
def signed_in_admin_page(cls, tmp_path_factory):
try:
from playwright.sync_api import sync_playwright
except ImportError as exc: # pragma: no cover
raise RuntimeError(
"playwright package is required; install requirements.txt"
) from exc
out = tmp_path_factory.mktemp("google-form") / "order-form.html"
out.write_text(_render(google=True, api_key=""))
with sync_playwright() as p:
try:
browser = p.chromium.launch(headless=True)
except Exception as exc:
raise RuntimeError(
"Chromium is required for form Playwright tests. "
"Run: playwright install --with-deps chromium"
) from exc
try:
page = browser.new_page()
page.add_init_script(
"""window.google = {
accounts: {
id: {
initialize() {},
renderButton() {},
disableAutoSelect() {},
},
},
};"""
)
page.route(
"https://accounts.google.com/gsi/client",
lambda route: route.abort(),
)
def handle_api(route):
if "/api/form-status/" in route.request.url:
route.fulfill(
status=200,
content_type="application/json",
body='{"status":"open"}',
)
elif "/api/admin/orders" in route.request.url:
route.fulfill(
status=200,
content_type="application/json",
body='{"weeks":["2026-W30"]}',
)
else:
route.fulfill(
status=404,
content_type="application/json",
body="{}",
)
page.route("https://api.example.com/**", handle_api)
page.goto(out.as_uri(), wait_until="domcontentloaded")
page.evaluate(
"(credential) => handleCredentialResponse({ credential })",
_google_credential(),
)
page.locator("#admin-btn").wait_for(state="visible")
yield page
finally:
browser.close()
@pytest.mark.parametrize("width", [320, 375])
def test_signed_in_admin_user_bar_fits_phone_width(
self, signed_in_admin_page, width
):
page = signed_in_admin_page
page.set_viewport_size({"width": width, "height": 800})
for selector in (
"#user-avatar",
"#user-name",
"#user-email",
"#admin-btn",
"#sign-out-btn",
):
locator = page.locator(selector)
assert locator.is_visible()
bounds = locator.evaluate(
"""element => {
const rect = element.getBoundingClientRect();
return {
left: rect.left,
top: rect.top,
right: rect.right,
bottom: rect.bottom,
viewportWidth: window.innerWidth,
viewportHeight: window.innerHeight,
};
}"""
)
assert bounds["left"] >= 0
assert bounds["top"] >= 0
assert bounds["right"] <= bounds["viewportWidth"]
assert bounds["bottom"] <= bounds["viewportHeight"]
for selector in ("#user-name", "#user-email"):
assert page.locator(selector).evaluate(
"""element =>
element.scrollWidth <= element.clientWidth &&
element.scrollHeight <= element.clientHeight"""
)
assert page.locator("#admin-btn").is_enabled()
assert page.locator("#sign-out-btn").is_enabled()
dimensions = page.evaluate(
"""() => ({
scrollWidth: document.documentElement.scrollWidth,
clientWidth: document.documentElement.clientWidth,
})"""
)
assert dimensions["scrollWidth"] == dimensions["clientWidth"]
def test_user_bar_stays_single_row_at_480(self, signed_in_admin_page):
page = signed_in_admin_page
page.set_viewport_size({"width": 480, "height": 800})
assert (
page.locator(".user-bar").evaluate(
"(element) => getComputedStyle(element).flexWrap"
)
== "nowrap"
)
dimensions = page.evaluate(
"""() => ({
scrollWidth: document.documentElement.scrollWidth,
clientWidth: document.documentElement.clientWidth,
})"""
)
assert dimensions["scrollWidth"] == dimensions["clientWidth"]
def test_user_bar_wraps_below_shared_mobile_breakpoint(self, signed_in_admin_page):
page = signed_in_admin_page
page.set_viewport_size({"width": 479, "height": 800})
assert (
page.locator(".user-bar").evaluate(
"(element) => getComputedStyle(element).flexWrap"
)
== "wrap"
)