From f02186387bf2bd0eefec637ac3fbe8d3825b353d Mon Sep 17 00:00:00 2001
From: vyctorbrzezowski <krzyszchweski@gmail.com>
Date: Wed, 12 Aug 2026 04:29:15 -0300
Subject: [PATCH] fix(ui): preserve board runtime across rail modes

---
 ui/src/components/form-controls.browser.test.ts          | 2 --
 ui/src/e2e/chat-flow.navigation-presentation.e2e.test.ts | 3 ++-
 ui/src/pages/chat/chat-pane-render.ts                    | 9 +++++----
 ui/src/pages/chat/chat-responsive.browser.test.ts        | 2 +-
 4 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/ui/src/components/form-controls.browser.test.ts b/ui/src/components/form-controls.browser.test.ts
index 4a567d358113..79bab72bf8cc 100644
--- a/ui/src/components/form-controls.browser.test.ts
+++ b/ui/src/components/form-controls.browser.test.ts
@@ -380,7 +380,6 @@ describeBrowserLayout("app chrome interaction styles", () => {
             <span class="sidebar-agent-card__name">Agent</span>
             <span class="settings-sidebar__item-label">Settings</span>
             <span class="sidebar-file-view__path">workspace/file.ts</span>
-            <span class="chat-workbench__dock-zone">Dock here</span>
             <span class="chat-workspace-rail__file-badge">3 files</span>
             <span class="session-menu__shortcut">⌘K</span>
             <div class="file-view__search">
@@ -412,7 +411,6 @@ describeBrowserLayout("app chrome interaction styles", () => {
         ".sidebar-agent-card__name",
         ".settings-sidebar__item-label",
         ".sidebar-file-view__path",
-        ".chat-workbench__dock-zone",
         ".chat-workspace-rail__file-badge",
         ".session-menu__shortcut",
         ".file-view__search-counter",
diff --git a/ui/src/e2e/chat-flow.navigation-presentation.e2e.test.ts b/ui/src/e2e/chat-flow.navigation-presentation.e2e.test.ts
index 77fa87798196..7cb5af289ab3 100644
--- a/ui/src/e2e/chat-flow.navigation-presentation.e2e.test.ts
+++ b/ui/src/e2e/chat-flow.navigation-presentation.e2e.test.ts
@@ -300,7 +300,8 @@ suite.define(() => {
           targetHeader.evaluate((header) => {
             const owner = header.closest("openclaw-chat-pane");
             return (
-              owner === header.parentElement && owner?.classList.contains("chat-split-view__pane")
+              header.parentElement?.classList.contains("chat-main__conversation-column") === true &&
+              owner?.classList.contains("chat-split-view__pane") === true
             );
           }),
         )
diff --git a/ui/src/pages/chat/chat-pane-render.ts b/ui/src/pages/chat/chat-pane-render.ts
index 780ea293e2ea..42f2e524a576 100644
--- a/ui/src/pages/chat/chat-pane-render.ts
+++ b/ui/src/pages/chat/chat-pane-render.ts
@@ -607,10 +607,11 @@ export class ChatPane extends ChatPaneBrowserAnnotationRender {
     );
     const chat = renderChat({ ...props, header: board.face === "dashboard" ? nothing : header });
     const boardPrimary = this.renderBoardPrimary(board, chat);
-    const primary =
-      board.face === "dashboard"
-        ? html`<div class="chat-pane-primary-column">${header}${boardPrimary}</div>`
-        : boardPrimary;
+    // Keep this root stable across board face changes so the guarded board runtime
+    // remains connected while Chat is active.
+    const primary = html`<div class="chat-pane-primary-column">
+      ${board.face === "dashboard" ? header : nothing}${boardPrimary}
+    </div>`;
     const discussion = this.buildSessionDiscussionPanel(state, state.sessionKey.trim());
     const panelTemplates = {
       chat,
diff --git a/ui/src/pages/chat/chat-responsive.browser.test.ts b/ui/src/pages/chat/chat-responsive.browser.test.ts
index 7e00a4968cfd..a804e071723a 100644
--- a/ui/src/pages/chat/chat-responsive.browser.test.ts
+++ b/ui/src/pages/chat/chat-responsive.browser.test.ts
@@ -366,7 +366,7 @@ function chatHtml(opts: ChatFixtureOptions = {}, mobileNavLayout = false) {
       <main class="content content--chat">
         <section class="card chat">
           <div class="chat-split-container">
-            <div class="chat-main${opts.sessionRailDocked ? " chat-main--rail-docked" : ""}" style="flex: 1 1 100%">
+            <div class="chat-main${opts.sessionRailDocked ? " chat-main--rail-docked" : ""}" style="--chat-companion-rail-width: 400px; flex: 1 1 100%">
               <div class="chat-thread${opts.direct ? " chat-thread--direct" : ""}" role="log">
                 <div class="chat-thread-inner">
                   <div class="chat-group user">