fix(webui): allow hiding mobile canvas rail

Let Alpine's x-show inline display state override the mobile rail layout rule while preserving flex layout when visible. Add a focused regression test for the CSS cascade contract.\n\nRefs #1810

er-s-an committed Aug 14, 2026 at 02:49 UTC 09c5452f6d04ddb4bb9ac62ea57b463ae15a6195
2 files changed +17 -1
tests/test_ui_control_visibility.py
+16
@@ -1,5 +1,6 @@
1 import json
2 from pathlib import Path
3 +import re
4 import subprocess
5 import sys
6
@@ -43,6 +44,21 @@ def test_ui_controls_have_independent_mobile_and_desktop_visibility() -> None:
44 assert "isUiControlVisible('rightCanvasRail')" in canvas
45
46
47 +def test_mobile_canvas_rail_respects_visibility_preference() -> None:
48 + canvas = read("webui/components/canvas/right-canvas.html")
49 + canvas_css = read("webui/components/canvas/right-canvas.css")
50 + mobile_rail_rule = re.search(
51 + r"body\.right-canvas-mobile-mode \.right-canvas-rail \{([^}]*)\}",
52 + canvas_css,
53 + re.S,
54 + )
55 +
56 + assert 'x-show="$store.preferences.isUiControlVisible(\'rightCanvasRail\')"' in canvas
57 + assert mobile_rail_rule is not None
58 + assert re.search(r"^\s*display:\s*flex;\s*$", mobile_rail_rule.group(1), re.M)
59 + assert "!important" not in mobile_rail_rule.group(1)
60 +
61 +
62 def test_ui_control_visibility_settings_are_normalized() -> None:
63 result = subprocess.run(
64 [
webui/components/canvas/right-canvas.css
+1 -1
@@ -344,7 +344,7 @@ body.right-canvas-mobile-mode .right-canvas-rail {
344 position: fixed;
345 top: 50%;
346 right: max(0px, env(safe-area-inset-right));
347 - display: flex !important;
347 + display: flex;
348 transform: translateY(-50%);
349 pointer-events: auto;
350 }