fix: make full-bleed page metadata test non-vacuous

Co-Authored-By: Claude Opus 5.5 <[email protected]>

src/praisonaiui/server.py

@@ -3298,6 +3298,7 @@ def create_app(
             "group": "Agent",
             "description": "AI agent chat",
             "order": 1,
+            "layout": "full-bleed",
         },
         {
             "id": "chat-canvas",
@@ -3306,6 +3307,7 @@ def create_app(
             "group": "Agent",
             "description": "Chat with live A2UI preview panel",
             "order": 2,
+            "layout": "full-bleed",
         },
         {
             "id": "canvas",

src/praisonaiui/templates/frontend/plugins/dashboard.js

@@ -378,6 +378,9 @@ const DASHBOARD_STYLE = `
   .db-main { flex: 1; padding: 32px 40px; overflow-y: auto; min-width: 0; }
   .db-main.db-clean { padding: 0; display: flex; flex-direction: column; overflow: hidden; height: 100vh; }
   .db-main.db-clean > #db-page-content { flex: 1; display: flex; flex-direction: column; min-height: 0; }
+  /* Per-page full bleed (page.layout === 'full-bleed'): view fills the main column. */
+  .db-main.db-fill { display: flex; flex-direction: column; overflow: hidden; height: 100vh; box-sizing: border-box; }
+  .db-main.db-fill > #db-page-content { flex: 1; display: flex; flex-direction: column; min-height: 0; }
   .db-page-header { margin-bottom: 28px; }
   .db-page-title { font-size: 26px; font-weight: 700; letter-spacing: -0.02em; margin: 0 0 4px; }
   .db-page-icon svg, .db-nav-icon svg { display: inline-block; vertical-align: -0.125em; }
@@ -1992,8 +1995,12 @@ async function selectPage(pageId) {
     return;
   }
 
+  // Full-bleed pages (e.g. chat) fill the main column and carry their own chrome
+  const fullBleed = page.layout === 'full-bleed';
+  main.classList.toggle('db-fill', fullBleed);
+
   // Set page header (controlled by dashboard config protocol)
-  const showPageHeader = main.dataset.showPageHeader !== 'false';
+  const showPageHeader = main.dataset.showPageHeader !== 'false' && !fullBleed;
   const toolbarSlotId = `page:${pageId}:toolbar`;
   const headerHtml = showPageHeader ? `
     <div class="db-page-header">

src/praisonaiui/templates/frontend/plugins/views/chat-canvas.js

@@ -21,6 +21,7 @@ function injectStyles() {
       overflow: hidden;
     }
     .db-clean .chat-canvas-root { height: 100vh; }
+    .db-fill .chat-canvas-root { flex: 1; min-height: 0; height: auto; }
     .chat-canvas-chat {
       flex: 1 1 60%;
       min-width: 0;

src/praisonaiui/templates/frontend/plugins/views/chat.js

@@ -221,6 +221,11 @@ function injectStyles() {
   style.textContent = `
     .chat-root { display:flex; height:calc(100vh - 140px); gap:0; border-radius:12px; overflow:hidden; border:1px solid var(--db-border); background:var(--db-card-bg); }
     .db-clean .chat-root { height:100%; border-radius:0; border:none; }
+    .db-fill .chat-root { flex:1; min-height:0; height:auto; }
+    @media (max-width:900px) {
+      .db-fill .chat-root { flex-direction:column; }
+      .db-fill .chat-sidebar-panel { width:100%; min-width:0; max-height:40vh; border-right:none; border-bottom:1px solid var(--db-border); }
+    }
     .chat-root.focus-mode .chat-sidebar-panel { display:none; }
     .chat-root.focus-mode .chat-main-panel { border-left:none; }
 

tests/unit/test_chat_full_bleed_layout.py

@@ -0,0 +1,54 @@
+"""Regression tests for #322 — Chat must fill the dashboard main column.
+
+Chat pages declare ``layout: "full-bleed"``; ``selectPage()`` then adds
+``db-fill`` to ``#db-main-content`` and skips the duplicate page header, and
+``.chat-root`` sizes from flex allocation instead of ``calc(100vh - 140px)``.
+"""
+
+from __future__ import annotations
+
+import re
+from pathlib import Path
+
+PLUGINS = (
+    Path(__file__).resolve().parents[2]
+    / "src" / "praisonaiui" / "templates" / "frontend" / "plugins"
+)
+
+
+def _select_page_body() -> str:
+    src = (PLUGINS / "dashboard.js").read_text(encoding="utf-8")
+    m = re.search(r"async function selectPage\(pageId\)\s*\{(.*?)^}", src, re.DOTALL | re.MULTILINE)
+    assert m
+    return m.group(1)
+
+
+def test_chat_pages_declare_full_bleed():
+    from starlette.testclient import TestClient
+
+    from praisonaiui.server import create_app, reset_state
+
+    reset_state()  # isolate from page whitelists set by other tests
+    pages = {p["id"]: p for p in TestClient(create_app()).get("/api/pages").json()["pages"]}
+    for pid in ("chat", "chat-canvas"):
+        assert pages[pid].get("layout") == "full-bleed"
+    assert pages["overview"].get("layout") is None
+
+
+def test_select_page_toggles_fill_and_skips_header():
+    body = _select_page_body()
+    assert "page.layout === 'full-bleed'" in body
+    assert "classList.toggle('db-fill'" in body
+    assert re.search(r"showPageHeader = .*&& !fullBleed", body)
+
+
+def test_fill_css_defined():
+    src = (PLUGINS / "dashboard.js").read_text(encoding="utf-8")
+    assert ".db-main.db-fill > #db-page-content" in src
+
+
+def test_chat_root_fills_column_in_fill_mode():
+    chat = (PLUGINS / "views" / "chat.js").read_text(encoding="utf-8")
+    assert re.search(r"\.db-fill \.chat-root \{[^}]*flex:1;[^}]*min-height:0", chat)
+    canvas = (PLUGINS / "views" / "chat-canvas.js").read_text(encoding="utf-8")
+    assert ".db-fill .chat-canvas-root" in canvas