From e9c4f500b6eeff52d152fb44c0dbf1e88c5f7198 Mon Sep 17 00:00:00 2001 From: Leo Li Date: Wed, 21 Oct 2026 05:40:03 +0000 Subject: [PATCH 1/2] test(cmux-next sidebar): the icon rail keeps its own layout with the session rail's sheet loaded (red) Co-Authored-By: Claude Opus 5.5 Agent-Session: https://cmux.com/deeplink/agent?harness=claude&session=01a15c2a-ee79-7910-9d76-ef0536b9880d&host=huge-blue --- webviews/test/sidebar-rail-css.test.tsx | 30 +++++++++++++++++++++++++ 1 file changed, 30 insertions(+) create mode 100644 webviews/test/sidebar-rail-css.test.tsx diff --git a/webviews/test/sidebar-rail-css.test.tsx b/webviews/test/sidebar-rail-css.test.tsx new file mode 100644 index 000000000000..d8b2836e88cb --- /dev/null +++ b/webviews/test/sidebar-rail-css.test.tsx @@ -0,0 +1,30 @@ +// The sidebar's icon rail and the chat's session rail are two components; the pane loads both +// sheets, so the session rail's 240-340px column (summary.css) must not land on the 48px icon rail. +import { expect, test } from "bun:test"; +import { readFileSync } from "node:fs"; +import { Window } from "happy-dom"; +import { renderToStaticMarkup } from "react-dom/server"; +import { SessionSidebar } from "../src/agent-session/acpmux/SessionSidebar"; + +const sheet = (path: string) => readFileSync(new URL(path, import.meta.url), "utf8"); + +test("the sidebar's icon rail keeps its own layout with the session rail's sheet loaded", () => { + const markup = renderToStaticMarkup( {}} />); + const window = new Window({ width: 900, height: 600 }); + const { document } = window; + for (const css of [ + sheet("../src/agent-session/acpmux/styles.css"), + sheet("../src/agent-session/acpmux/summary/summary.css"), + ]) { + const style = document.createElement("style"); + style.textContent = css; + document.head.append(style); + } + document.body.innerHTML = markup; + const rail = document.querySelector("nav.acpmux-sidebar > div")!; + expect(rail.querySelector("button")).not.toBeNull(); + const computed = window.getComputedStyle(rail); + // happy-dom drops the session rail's clamp() basis, so check the plain values both rules set. + expect([computed.alignItems, computed.paddingLeft, computed.overflowY]).toEqual(["center", "0px", "visible"]); + window.happyDOM.close(); +}); From 0d81a1f5dcd7474645c81b928fddfcbddc10b58b Mon Sep 17 00:00:00 2001 From: Leo Li Date: Wed, 21 Oct 2026 05:40:57 +0000 Subject: [PATCH 2/2] fix(cmux-next sidebar): the icon rail has its own class, so the session rail's 240-340px column stops landing on it Both rails were .acpmux-rail. Where summary.css loads after the sidebar's sheet (the pane, the gallery), the session rail's clamp() column and its narrow-window overlay won: the icon rail drew 300px wide and squeezed the chat list to 32-80px. Co-Authored-By: Claude Opus 5.5 Agent-Session: https://cmux.com/deeplink/agent?harness=claude&session=01a15c2a-ee79-7910-9d76-ef0536b9880d&host=huge-blue --- webviews/src/agent-session/acpmux/SessionSidebar.gallery.tsx | 2 +- webviews/src/agent-session/acpmux/SessionSidebar.tsx | 2 +- webviews/src/agent-session/acpmux/prototype/prototype.css | 2 +- webviews/src/agent-session/acpmux/styles.css | 2 +- webviews/test/sidebar-rail-css.test.tsx | 3 ++- 5 files changed, 6 insertions(+), 5 deletions(-) diff --git a/webviews/src/agent-session/acpmux/SessionSidebar.gallery.tsx b/webviews/src/agent-session/acpmux/SessionSidebar.gallery.tsx index a09812acdff9..506d86d93cbb 100644 --- a/webviews/src/agent-session/acpmux/SessionSidebar.gallery.tsx +++ b/webviews/src/agent-session/acpmux/SessionSidebar.gallery.tsx @@ -208,7 +208,7 @@ const entry = componentEntry({ pane: true, height: 620, widths: { narrow: 300, normal: 380, wide: 520 }, - anchors: [{ selector: ".acpmux-sidebar" }, { selector: ".acpmux-rail" }], + anchors: [{ selector: ".acpmux-sidebar" }, { selector: ".acpmux-sidebar-rail" }], checks: { anchorMovePx: { value: 0, diff --git a/webviews/src/agent-session/acpmux/SessionSidebar.tsx b/webviews/src/agent-session/acpmux/SessionSidebar.tsx index 4764caa58450..dd7909660f1e 100644 --- a/webviews/src/agent-session/acpmux/SessionSidebar.tsx +++ b/webviews/src/agent-session/acpmux/SessionSidebar.tsx @@ -121,7 +121,7 @@ export function SessionSidebar({ return (