Repository navigation
cmux NEXT glass: in a see-through Chromium page, menus and the composer no longer show the chat text sharp through the glass - #24358
Conversation
… a see-through Chromium page Chromium draws a backdrop-filter's blurred copy over the page's own pixels. Over a clear page (a cmux page in Chromium over the window glass) that copy is mostly clear, so white bars under a floating .ui-glass keep their full contrast (38 on base, for every underlay arm). The test wants the default arm to fade them below 45% of that, the arms to order by strength, the in-flow glass unchanged, and WebKit to draw no underlay. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Agent-Session: https://cmux.com/deeplink/agent?harness=claude&session=01a15d28-87e2-72e0-ae15-bb3649af8abd&host=cosmic-gray
…the theme surface under its tint Leo: "2 on we can't be having unstyled main chat panes..." Every cmux page in Chromium is see-through (8e36a5b), and Chromium draws a backdrop-filter's blurred copy over the page's own pixels, not in their place: the window glass is not in the page, so the transcript under a menu, a hover card or the composer read crisp through the tint. WebKit's backdrop takes in the opaque window glass and frosts it. Until the CEF fork's compositor replaces the backdrop, a floating glass (.ui-popup, .ui-tooltip, .ui-title-tooltip, .ui-card, or a surface marked .ui-glass-floats: the composer card, queue and strip, the jump pills, the session and link hover cards, the add-project dialog) lays its tint over the theme surface at --glass-underlay, only under @supports not (-webkit-backdrop-filter: none), a see-through root, no lens and no Reduce Transparency. In-flow glass (a user's bubble, a settings card) keeps its tint, as in WebKit. The strength is the experiment chromium-glass-underlay (none, light 50%, medium 70% the default, heavy 85%), which desktop.ts puts on <html>; with no attribute yet the CSS is the default arm's, so there is no first-frame change. The Liquid glass gallery entry gains see-through variants that compare the arms. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Agent-Session: https://cmux.com/deeplink/agent?harness=claude&session=01a15d28-87e2-72e0-ae15-bb3649af8abd&host=cosmic-gray
… so the cause is the clear page Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Agent-Session: https://cmux.com/deeplink/agent?harness=claude&session=01a15d28-87e2-72e0-ae15-bb3649af8abd&host=cosmic-gray
|
cmux status (one comment, edited in place; each line is updated by the job that owns it) Review App of this head (app.zip, kept 1 day)
Gallery before/after for
States
Pick other states with a Unclear: CI failed on
Failures:
Matched log linesNot re-run automatically: Written by red: cmux-next checks (god files, concurrency, crash safety, l10n); NEW: Tour of The path-selected recorder failed for glass-after, glass-before; see the run artifact and failed manifests. Path-selected interactions
glass-before: the media could not be published (refused 11 file(s) that show private names: 24358/d6ee0415/next-glass-before/shots/05-agent-chat-beside-the-terminal.png (fleet Mac mini name); 24358/d6ee0415/next-glass-before/shots/06-command-palett)glass-after: the media could not be published (refused 11 file(s) that show private names: 24358/d6ee0415/next-glass-after/shots/05-agent-chat-beside-the-terminal.png (fleet Mac mini name); 24358/d6ee0415/next-glass-after/shots/06-command-palette-)Tours are data in |
|
Found 22 test failures on Blacksmith runners: Failures
...and 12 more test failures. View all on Blacksmith: run 39856274493, run 39856274233, run 39856274194
|
![Fix with [code]smith](https://pr-comments-assets.blacksmith.sh/codesmith/fix-with-codesmith-light-3x.png)
|
Bead |
# Conflicts: # webviews/src/experiments/registry.ts # webviews/test/browser/composer-rim.html
|
|
|
Review (final_head_review): SHIP at d6ee041 Reconciled the PR with the current Resolved defects from the initial review:
Validation on the final worktree:
Agent-Session: https://cmux.com/deeplink/agent?harness=codex&session=01a162e0-3a44-77f0-b380-8c1966497d56&host=huge-blue |
|
|
|
|
|
|
|
base-red-watch: |
…rough underlay Codex round 2: base's #24358 lays floating glass (.ui-popup, .ui-glass-floats) on the theme surface underlay in a see-through Chromium page; the Summary popover floats over the chat but had only .ui-glass, so under Plain glass its fill was 60% while a chat menu's was 70%. The popover now carries .ui-glass-floats, and summary-glass.test.ts also compares its background layers with a menu's. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
|
Shipped in:
|
Leo: "2 on we can't be having unstyled main chat panes..."
Leo-ask: ask-95c8d21afb
Every cmux page in Chromium is see-through over the window glass (8e36a5b). Chromium draws a
backdrop-filter's blurred copy over the page's own pixels, not in their place. A see-through page doesn't contain the window glass, so that copy is mostly clear, and the transcript under a menu, a hover card or the composer reads crisp through the tint. WebKit's backdrop takes in the opaque window glass and frosts it. The bench captures for #24160 showed this: in the Chromium column the transcript text sits sharp inside the side panel's glass.What changes
--glass-underlay(webviews/src/ui/glass/glass.css)..ui-popup,.ui-tooltip,.ui-title-tooltip,.ui-card, and surfaces marked with the new.ui-glass-floats: the composer card, queue and strip, both jump pills, the session and link hover cards, and the add-project dialog.@supports not (-webkit-backdrop-filter: none), so it applies only in Chromium (WebKit keeps the prefixed property). It also needs a see-through root, no lens canvas, and no Reduce Transparency.chromium-glass-underlay, with four arms: none (today), light 50%, medium 70% (default), heavy 85%.desktop.tsputs the arm on<html>asdata-glass-underlay.see-through-textvariants (dark and light) that compare the arms.This is a page-side stopgap. The real fix is in the CEF fork's compositor (replace the backdrop with its blurred copy instead of drawing over it), which belongs to the fork's owner.
Verification
webviews/test/chromium-glass-underlay.test.ts(Playwright Chromium and WebKit; the page is clear, as in the app, viaomitBackground) measures white bars under a floating glass.glass.cssfrom feat-cmux-next): red. The bar contrast is 38 for every arm ("Expected: < 17.12, Received: 38.05"), and the arms don't order.CMUX_BROWSER_TESTS=1 bun test test/chromium-glass-underlay.test.ts.Observed / Not run
composer-glass.test.ts(8 pass; its fixture now carriesui-glass-floatslikeComposerBox.tsx) andglass-lens.test.ts(14 pass, Chromium and WebKit).glass-never-opaque,user-bubble-glassandhover-cards-glass(10 pass).vp fmt --check, plusvp lintand the type check filtered to the changed files (no findings).check-layers.py, and the pre-push gate.webviews/.bun run check. The copy lacked the rest of the repo, so 34 errors appeared in files this PR doesn't touch.Changelog
Risk: normal (webview CSS; WebKit unchanged; the arm can be switched with
cmux.experiments).Agent session: cosmic-gray
🤖 Generated with Claude Code
Need help on this PR? Tag
@codesmith-botwith what you need.Summary by cubic
Fixes see-through Chromium pages showing chat text crisp through menus, hover cards, the composer, and the Chat Inspector glass. Chromium draws a backdrop-filter's blurred copy over the page's own pixels, so the window glass never reaches the filter; WebKit already frosts it correctly.
.ui-glass-floats) now lays its tint over the theme surface, scoped to see-through Chromium pages with no lens and no Reduce Transparency.chromium-glass-underlayexperiment with four arms: none, light 50%, medium 70%, and heavy 85%. Medium is the default; the CSS already uses it when no attribute is set, so the first frame is unchanged.Written for commit d6ee041. Summary will update on new commits.