From 022137721db268dd4481bae1d4414a6984552ec6 Mon Sep 17 00:00:00 2001 From: Leo Li Date: Mon, 19 Oct 2026 12:53:32 -0700 Subject: [PATCH 1/3] test(composer): a subtler focus step, and focus over art brightens the glass rim (failing) Co-Authored-By: Claude Opus 5.5 --- webviews/test/composer-rim-hairline.test.ts | 22 +++++++++++++++++++-- 1 file changed, 20 insertions(+), 2 deletions(-) diff --git a/webviews/test/composer-rim-hairline.test.ts b/webviews/test/composer-rim-hairline.test.ts index b6bdf3534223..54d1655b9661 100644 --- a/webviews/test/composer-rim-hairline.test.ts +++ b/webviews/test/composer-rim-hairline.test.ts @@ -16,9 +16,10 @@ import { warmViteServer } from "./support/warmDevServer"; type Inset = { spread: number; alpha: number }; await requireBrowserLane("composer-rim-hairline.test.ts", async () => { - /** The composer edge's alpha over this page's transparent background, and its quiet focus step: 30% text over the edge. */ + /** The composer edge's alpha over this page's transparent background, and its quiet focus step: 22% text over the edge + * (Leo 2026-10-19, a subtler focus; still well past the 8% step an eye could not see). */ const EDGE = 0.18; - const FOCUS = 0.3 + 0.7 * EDGE; + const FOCUS = 0.22 + 0.78 * EDGE; setDefaultTimeout(120_000); try { await (await chromium.launch({ headless: true })).close(); @@ -160,6 +161,23 @@ await requireBrowserLane("composer-rim-hairline.test.ts", async () => { await page.close(); }); + // Over art the focused glass card catches more light on its top edge (the glass rim, #21786), in + // place of a heavier ring: the ring keeps its one-device-pixel quiet step. + test("over art keyboard focus brightens the glass card's top-lit rim", async () => { + const page = await open(2); + await page.evaluate(() => document.documentElement.setAttribute("data-cmux-see-through", "")); + const topRim = async () => + (await insets(page, "composer")).find(({ spread }) => spread === 0)?.alpha ?? 0; + const rest = await topRim(); + expect(rest, "the glass card draws its top-lit rim").toBeGreaterThan(0); + await page.focus("#composer-field"); + expect(await topRim(), "focus brightens the top-lit rim").toBeGreaterThan(rest); + const ring = (await insets(page, "composer")).filter(({ spread }) => spread > 0); + expect(ring.length, "one ring").toBe(1); + expect(ring[0]?.alpha, "the ring keeps the quiet focus step").toBeCloseTo(FOCUS, 2); + await page.close(); + }); + test("pointer focus leaves the composer rim quiet while keyboard traversal raises it", async () => { const page = await open(2); const rest = await insets(page, "composer"); From 6312d76b8f6e081e8112b96060fbf8b6f9e3917e Mon Sep 17 00:00:00 2001 From: Leo Li Date: Mon, 19 Oct 2026 12:53:57 -0700 Subject: [PATCH 2/3] fix(composer): a subtler focus step, and over art focus brightens the glass rim The focused composer's rim steps 22% toward the text instead of 30% (Leo 2026-10-19: subtler). Over art the focused glass card's top-lit rim brightens instead of the ring growing heavier. No new tokens; Reduce Transparency draws no rim layer, so it keeps the plain step. Co-Authored-By: Claude Opus 5.5 --- .../agent-session/acpmux/composerStates.css | 19 +++++++++++++++++-- 1 file changed, 17 insertions(+), 2 deletions(-) diff --git a/webviews/src/agent-session/acpmux/composerStates.css b/webviews/src/agent-session/acpmux/composerStates.css index 0625ce986ade..1b3a4b0f4947 100644 --- a/webviews/src/agent-session/acpmux/composerStates.css +++ b/webviews/src/agent-session/acpmux/composerStates.css @@ -279,12 +279,27 @@ button.acpmux-send:disabled:not(.acpmux-cancel):not(.acpmux-send-ready) { (Lawrence, Leo 10-14): the same one-device-pixel rim, never a wider ring or the accent, and clear with appearance.borders none. Its tone steps 30% toward the text (--acpmux-composer-edge-focus): the earlier 8% step was below what an eye can see, so a focused composer was pixel-identical to an - idle one in every theme (cg-composer focus audit, 10-14). The card's rim goes round the location + idle one in every theme (cg-composer focus audit, 10-14). Leo 2026-10-19 asked for a subtler focus, + so it steps 22%: still well clear of the invisible 8%. Over art the glass card also catches more + light on its top edge (below). The card's rim goes round the location strip too (composerLocation.css), so the focused rim stays one outline. Shell mode takes its own accent, the mode's mark. The prompt itself draws no ring (desktop.css, cx-ncc.57). */ .acpmux-composer, .nt-composer { - --acpmux-composer-edge-focus: color-mix(in srgb, var(--agent-text) 30%, var(--acpmux-composer-edge)); + --acpmux-composer-edge-focus: color-mix(in srgb, var(--agent-text) 22%, var(--acpmux-composer-edge)); +} +/* Glass focus: over art (data-cmux-see-through) a focused card's top-lit rim (#21786) brightens, as + light catches a lifted pane of glass, instead of the ring growing heavier. Reduce Transparency + draws no rim layer at all (above), so it keeps the plain step. */ +:root[data-cmux-see-through] + :is( + .acpmux-composer-box:has(:focus-visible), + .acpmux-composer:has(> .acpmux-composer-strip :focus-visible) > .acpmux-composer-box + ) { + --acpmux-composer-rim: inset 0 1px 0 light-dark( + color-mix(in srgb, var(--cmux-tone-light) 85%, transparent), + color-mix(in srgb, var(--cmux-tone-light) 22%, transparent) + ); } :root[data-borders="none"] :is(.acpmux-composer, .nt-composer) { --acpmux-composer-edge-focus: transparent; From 3b420ff25afac28204a8ed5822da5e5fcffb1867 Mon Sep 17 00:00:00 2001 From: "cmux-autofix[bot]" Date: Mon, 19 Oct 2026 20:07:49 +0000 Subject: [PATCH 3/3] chore(next): PR autofix at 6312d76b8f6e - vp fmt webviews/test/composer-rim-hairline.test.ts Autofix-Run: https://github.com/manaflow-ai/cmux/actions/runs/39315390260 --- webviews/test/composer-rim-hairline.test.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/webviews/test/composer-rim-hairline.test.ts b/webviews/test/composer-rim-hairline.test.ts index 54d1655b9661..2302a8af93c2 100644 --- a/webviews/test/composer-rim-hairline.test.ts +++ b/webviews/test/composer-rim-hairline.test.ts @@ -166,8 +166,7 @@ await requireBrowserLane("composer-rim-hairline.test.ts", async () => { test("over art keyboard focus brightens the glass card's top-lit rim", async () => { const page = await open(2); await page.evaluate(() => document.documentElement.setAttribute("data-cmux-see-through", "")); - const topRim = async () => - (await insets(page, "composer")).find(({ spread }) => spread === 0)?.alpha ?? 0; + const topRim = async () => (await insets(page, "composer")).find(({ spread }) => spread === 0)?.alpha ?? 0; const rest = await topRim(); expect(rest, "the glass card draws its top-lit rim").toBeGreaterThan(0); await page.focus("#composer-field");