test: add glossary i18n, E2E, and visual Playwright tests (#158)

Unit tests verify glossary keys present in all 4 languages.
E2E tests verify popover open/close/dismiss behavior.
Visual tests capture screenshots for desktop, mobile, light theme.

Author: itsDNNS

tests/e2e/test_glossary.py

@@ -0,0 +1,105 @@
+"""E2E tests for in-app glossary tooltips."""
+
+import pytest
+from playwright.sync_api import expect
+
+
+class TestGlossaryPresence:
+    """Verify glossary hint icons are rendered on the dashboard."""
+
+    def test_snr_card_has_glossary_hint(self, demo_page):
+        hint = demo_page.locator('#view-dashboard .metric-card .glossary-hint').first
+        expect(hint).to_be_visible()
+
+    def test_glossary_hint_has_info_icon(self, demo_page):
+        icon = demo_page.locator('#view-dashboard .glossary-hint svg').first
+        expect(icon).to_be_visible()
+
+    def test_multiple_glossary_hints_on_dashboard(self, demo_page):
+        hints = demo_page.locator('#view-dashboard .glossary-hint')
+        assert hints.count() >= 4, f"Expected at least 4 glossary hints, got {hints.count()}"
+
+
+class TestGlossaryPopover:
+    """Verify popover open/close behavior."""
+
+    def test_popover_hidden_by_default(self, demo_page):
+        popover = demo_page.locator('#view-dashboard .glossary-popover').first
+        expect(popover).not_to_be_visible()
+
+    def test_click_opens_popover(self, demo_page):
+        hint = demo_page.locator('#view-dashboard .glossary-hint').first
+        hint.click()
+        popover = hint.locator('.glossary-popover')
+        expect(popover).to_be_visible()
+
+    def test_popover_has_text_content(self, demo_page):
+        hint = demo_page.locator('#view-dashboard .glossary-hint').first
+        hint.click()
+        popover = hint.locator('.glossary-popover')
+        text = popover.text_content()
+        assert len(text) > 20, f"Popover text too short: {text}"
+
+    def test_click_outside_closes_popover(self, demo_page):
+        hint = demo_page.locator('#view-dashboard .glossary-hint').first
+        hint.click()
+        popover = hint.locator('.glossary-popover')
+        expect(popover).to_be_visible()
+        demo_page.locator('body').click(position={"x": 10, "y": 10})
+        expect(popover).not_to_be_visible()
+
+    def test_escape_closes_popover(self, demo_page):
+        hint = demo_page.locator('#view-dashboard .glossary-hint').first
+        hint.click()
+        popover = hint.locator('.glossary-popover')
+        expect(popover).to_be_visible()
+        demo_page.keyboard.press("Escape")
+        expect(popover).not_to_be_visible()
+
+    def test_clicking_second_hint_closes_first(self, demo_page):
+        hints = demo_page.locator('#view-dashboard .glossary-hint')
+        first = hints.nth(0)
+        second = hints.nth(1)
+        first.click()
+        expect(first.locator('.glossary-popover')).to_be_visible()
+        second.click()
+        expect(first.locator('.glossary-popover')).not_to_be_visible()
+        expect(second.locator('.glossary-popover')).to_be_visible()
+
+
+class TestGlossaryChannels:
+    """Verify glossary hints in channel tables."""
+
+    def test_ds_channel_group_has_glossary_hint(self, demo_page):
+        demo_page.locator('a.nav-item[data-view="channels"]').click()
+        demo_page.wait_for_timeout(500)
+        hint = demo_page.locator('#view-channels .docsis-group-header .glossary-hint').first
+        expect(hint).to_be_visible()
+
+    def test_channel_glossary_popover_works(self, demo_page):
+        demo_page.locator('a.nav-item[data-view="channels"]').click()
+        demo_page.wait_for_timeout(500)
+        hint = demo_page.locator('#view-channels .docsis-group-header .glossary-hint').first
+        hint.click()
+        popover = hint.locator('.glossary-popover')
+        expect(popover).to_be_visible()
+        text = popover.text_content()
+        assert len(text) > 20
+
+
+class TestGlossaryModulation:
+    """Verify glossary hints on modulation KPI cards."""
+
+    def test_modulation_kpi_has_glossary_hints(self, demo_page):
+        demo_page.locator('a.nav-item[data-view="modulation"]').click()
+        demo_page.wait_for_timeout(2000)
+        hints = demo_page.locator('#view-modulation .glossary-hint')
+        assert hints.count() >= 3, f"Expected 3 modulation glossary hints, got {hints.count()}"
+
+    def test_health_index_popover(self, demo_page):
+        demo_page.locator('a.nav-item[data-view="modulation"]').click()
+        demo_page.wait_for_timeout(2000)
+        hint = demo_page.locator('#view-modulation .glossary-hint').first
+        hint.click()
+        popover = hint.locator('.glossary-popover')
+        expect(popover).to_be_visible()

tests/e2e/test_glossary_visual.py

@@ -0,0 +1,109 @@
+"""Visual QA tests for in-app glossary feature.
+
+Screenshots saved to tests/e2e/screenshots/glossary/ for manual review.
+"""
+
+import os
+
+import pytest
+from playwright.sync_api import expect
+
+
+SCREENSHOT_DIR = os.path.join(os.path.dirname(__file__), "screenshots", "glossary")
+
+
+@pytest.fixture(autouse=True, scope="module")
+def ensure_screenshot_dir():
+    """Create screenshot output directory."""
+    os.makedirs(SCREENSHOT_DIR, exist_ok=True)
+
+
+class TestGlossaryVisualDesktop:
+    """Desktop screenshots of glossary popovers."""
+
+    def test_screenshot_dashboard_with_hints(self, demo_page):
+        demo_page.screenshot(
+            path=os.path.join(SCREENSHOT_DIR, "dashboard_hints.png"),
+            full_page=False,
+        )
+        hints = demo_page.locator('#view-dashboard .glossary-hint')
+        assert hints.count() >= 4
+
+    def test_screenshot_popover_open(self, demo_page):
+        hint = demo_page.locator('#view-dashboard .glossary-hint').first
+        hint.click()
+        demo_page.wait_for_timeout(300)
+        expect(hint.locator('.glossary-popover')).to_be_visible()
+        demo_page.screenshot(
+            path=os.path.join(SCREENSHOT_DIR, "popover_open.png"),
+            full_page=False,
+        )
+
+    def test_screenshot_channel_popover(self, demo_page):
+        demo_page.locator('a.nav-item[data-view="channels"]').click()
+        demo_page.wait_for_timeout(500)
+        hint = demo_page.locator('#view-channels .docsis-group-header .glossary-hint').first
+        hint.click()
+        demo_page.wait_for_timeout(300)
+        demo_page.screenshot(
+            path=os.path.join(SCREENSHOT_DIR, "channel_popover.png"),
+            full_page=False,
+        )
+
+    def test_screenshot_modulation_popovers(self, demo_page):
+        demo_page.locator('a.nav-item[data-view="modulation"]').click()
+        demo_page.wait_for_timeout(2000)
+        hint = demo_page.locator('#view-modulation .glossary-hint').first
+        hint.click()
+        demo_page.wait_for_timeout(300)
+        demo_page.screenshot(
+            path=os.path.join(SCREENSHOT_DIR, "modulation_popover.png"),
+            full_page=False,
+        )
+
+
+class TestGlossaryVisualMobile:
+    """Mobile viewport screenshots of glossary popovers."""
+
+    @pytest.fixture()
+    def mobile_page(self, page, live_server):
+        page.set_viewport_size({"width": 375, "height": 812})
+        page.goto(live_server)
+        page.wait_for_load_state("networkidle")
+        return page
+
+    def test_screenshot_mobile_dashboard(self, mobile_page):
+        mobile_page.screenshot(
+            path=os.path.join(SCREENSHOT_DIR, "mobile_dashboard.png"),
+            full_page=False,
+        )
+
+    def test_screenshot_mobile_popover(self, mobile_page):
+        hint = mobile_page.locator('#view-dashboard .glossary-hint').first
+        hint.click()
+        mobile_page.wait_for_timeout(300)
+        mobile_page.screenshot(
+            path=os.path.join(SCREENSHOT_DIR, "mobile_popover.png"),
+            full_page=False,
+        )
+
+
+class TestGlossaryVisualLightTheme:
+    """Light theme screenshots."""
+
+    @pytest.fixture()
+    def light_page(self, page, live_server):
+        page.goto(live_server)
+        page.wait_for_load_state("networkidle")
+        page.evaluate("document.documentElement.setAttribute('data-theme', 'light')")
+        page.wait_for_timeout(300)
+        return page
+
+    def test_screenshot_light_popover(self, light_page):
+        hint = light_page.locator('#view-dashboard .glossary-hint').first
+        hint.click()
+        light_page.wait_for_timeout(300)
+        light_page.screenshot(
+            path=os.path.join(SCREENSHOT_DIR, "light_popover.png"),
+            full_page=False,
+        )

tests/test_glossary_i18n.py

@@ -0,0 +1,51 @@
+"""Tests for glossary i18n key completeness."""
+
+import json
+import os
+
+import pytest
+
+I18N_DIR = os.path.join(os.path.dirname(__file__), "..", "app", "i18n")
+MOD_I18N_DIR = os.path.join(
+    os.path.dirname(__file__), "..", "app", "modules", "modulation", "i18n"
+)
+
+CORE_GLOSSARY_KEYS = [
+    "glossary_snr",
+    "glossary_power",
+    "glossary_correctable",
+    "glossary_uncorrectable",
+    "glossary_scqam",
+    "glossary_ofdm",
+    "glossary_modulation",
+    "glossary_docsis",
+    "glossary_gaming_index",
+]
+
+MOD_GLOSSARY_KEYS = [
+    "glossary_health_index",
+    "glossary_low_qam",
+    "glossary_sample_density",
+]
+
+LANGUAGES = ["en", "de", "fr", "es"]
+
+
+@pytest.mark.parametrize("lang", LANGUAGES)
+def test_core_glossary_keys_present(lang):
+    path = os.path.join(I18N_DIR, f"{lang}.json")
+    with open(path, encoding="utf-8") as f:
+        data = json.load(f)
+    for key in CORE_GLOSSARY_KEYS:
+        assert key in data, f"Missing {key} in {lang}.json"
+        assert len(data[key]) > 10, f"Empty/too-short value for {key} in {lang}.json"
+
+
+@pytest.mark.parametrize("lang", LANGUAGES)
+def test_modulation_glossary_keys_present(lang):
+    path = os.path.join(MOD_I18N_DIR, f"{lang}.json")
+    with open(path, encoding="utf-8") as f:
+        data = json.load(f)
+    for key in MOD_GLOSSARY_KEYS:
+        assert key in data, f"Missing {key} in modulation/{lang}.json"
+        assert len(data[key]) > 10, f"Empty/too-short value for {key} in modulation/{lang}.json"