diff --git a/tests/test_issue2246_question_jump.py b/tests/test_issue2246_question_jump.py index dbf8cb59..20bd238f 100644 --- a/tests/test_issue2246_question_jump.py +++ b/tests/test_issue2246_question_jump.py @@ -48,13 +48,13 @@ def test_question_jump_expands_windowed_history_and_highlights_question(): assert "msg-question-highlight" in UI_JS -def test_question_jump_button_is_quiet_and_hidden_on_mobile(): +def test_question_jump_button_is_quiet_and_compact_on_mobile(): assert ".msg-question-jump-btn" in STYLE_CSS assert "margin-left: auto;" in STYLE_CSS assert ".msg-question-highlight .msg-body" in STYLE_CSS assert "@keyframes question-highlight-pulse" in STYLE_CSS assert "@media (max-width: 600px)" in STYLE_CSS - assert ".msg-question-jump-btn { display: none; }" in STYLE_CSS + assert ".msg-question-jump-btn { padding: 3px 4px; }" in STYLE_CSS def test_question_jump_text_is_localized(): diff --git a/tests/test_issue3851_jump_to_question_mobile.py b/tests/test_issue3851_jump_to_question_mobile.py index e215647a..b020f75f 100644 --- a/tests/test_issue3851_jump_to_question_mobile.py +++ b/tests/test_issue3851_jump_to_question_mobile.py @@ -4,18 +4,15 @@ Ensures that .msg-question-jump-btn remains visible on mobile screens instead of being completely hidden with display: none. """ import re -import pytest +from pathlib import Path + +_CSS_PATH = Path(__file__).resolve().parents[1] / "static" / "style.css" def test_msg_question_jump_btn_mobile_not_display_none(): """Assert the mobile media query for .msg-question-jump-btn does NOT hide it.""" - css_path = 'static/style.css' + css_content = _CSS_PATH.read_text(encoding='utf-8') - with open(css_path, 'r', encoding='utf-8') as f: - css_content = f.read() - - # Find the mobile media query that contains .msg-question-jump-btn - # Pattern: @media (max-width: 600px) { ... .msg-question-jump-btn ... } mobile_pattern = r'@media\s*\([^)]*max-width\s*:\s*600px[^)]*\)\s*\{[^}]*\.msg-question-jump-btn[^}]*\}' mobile_match = re.search(mobile_pattern, css_content, re.DOTALL) @@ -24,8 +21,6 @@ def test_msg_question_jump_btn_mobile_not_display_none(): ) mobile_rule = mobile_match.group(0) - - # Check that it does NOT contain display: none or display:none assert 'display: none' not in mobile_rule and 'display:none' not in mobile_rule, ( f"Mobile rule for .msg-question-jump-btn should not have display: none. " f"Found: {mobile_rule}" @@ -33,45 +28,25 @@ def test_msg_question_jump_btn_mobile_not_display_none(): def test_msg_question_jump_btn_mobile_has_visible_styling(): - """Assert the mobile media query provides visible styling for the button.""" - css_path = 'static/style.css' + """Assert the mobile media query provides compact visible styling for the button.""" + css_content = _CSS_PATH.read_text(encoding='utf-8') - with open(css_path, 'r', encoding='utf-8') as f: - css_content = f.read() + pattern = r'@media\s*\([^)]*max-width\s*:\s*600px[^)]*\)\s*\{[^}]*\.msg-question-jump-btn\s*\{([^}]*)\}' + match = re.search(pattern, css_content, re.DOTALL) - # Find the mobile media query that contains .msg-question-jump-btn - mobile_pattern = r'@media\s*\([^)]*max-width\s*:\s*600px[^)]*\)\s*\{[^}]*\.msg-question-jump-btn[^}]*\}' - mobile_match = re.search(mobile_pattern, css_content, re.DOTALL) + assert match is not None, "No .msg-question-jump-btn rule inside a mobile media query" - assert mobile_match is not None, ( - "No mobile media query found for .msg-question-jump-btn" - ) - - mobile_rule = mobile_match.group(0) - - # Check that it has some styling (padding, gap, or other properties) - # but specifically that it's not just setting display: none - has_padding = 'padding' in mobile_rule - has_gap = 'gap' in mobile_rule - has_height = 'height' in mobile_rule - has_width = 'width' in mobile_rule - has_some_property = has_padding or has_gap or has_height or has_width - - assert has_some_property, ( - f"Mobile rule for .msg-question-jump-btn should have visible styling " - f"(padding, gap, height, or width). Found: {mobile_rule}" + rule_body = match.group(1) + assert 'padding' in rule_body, ( + f"Mobile .msg-question-jump-btn rule should have padding for compact styling. " + f"Found: {rule_body.strip()}" ) def test_msg_question_jump_btn_text_span_hidden_on_mobile(): """Assert that the text span (second child) is hidden on mobile.""" - css_path = 'static/style.css' + css_content = _CSS_PATH.read_text(encoding='utf-8') - with open(css_path, 'r', encoding='utf-8') as f: - css_content = f.read() - - # Find the mobile media query that hides the text span inside .msg-question-jump-btn - # Look for the pattern: span:last-child { display: none; } span_hide_pattern = r'\.msg-question-jump-btn\s+span:last-child\s*\{\s*display\s*:\s*none\s*;\s*\}' span_hide_match = re.search(span_hide_pattern, css_content, re.DOTALL)