You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Stabilizes connected editor tabs across fractional zoom and wrapped layouts, including the first tab's corner where compact window layout meets an adjacent sidebar or panel.
Gives document-adjacent tabs direct row geometry and a continuous outline into the document.
Lets the editor frame own shared top/left strokes in standard themes, avoiding doubled borders and corner gaps.
Derives close-button clearance from the visible tab surface and density, rather than the shoulder radius. Transparent action containers preserve the tab outline.
Keeps wrapped-tab width reservation invariant while classifying rows.
Isolates connected-strip colors with editorGroupHeader.connectedTabsBackground; Classic, pill and Agents/session surfaces retain their shared theme colors.
Preserves upper-row pills and explicit high-contrast close-action hover/focus indicators.
Complete affected suites: 97 Electron tests, 96 Chromium tests, 96 WebKit tests; ESLint and Stylelint pass.
258 native-resolution capture cases on 319b4c0cb10: first/middle/last/only tab, true wrapped rows and sole final-row tabs, real close hover, inactive hover, zoom −1/0/+1, Dark/Light/high contrast, compact tab height, and left-side actions.
Actual "window.density.layout": "compact" tested separately in Dark and Light beside both the sidebar and a left-positioned panel at all three zoom levels.
Painted close clearances at reset zoom: 6/6/6px single row, 3/3/3px wrapped row, 1/1/1px compact wrapped row. These measurements exclude painted border strokes.
Connected-color customization changes connected strips but not the pill or Classic controls.
Remaining check: the real Agents-window color-isolation comparison requires sign-in. This PR remains draft pending that check and final review.
Visual validation
Compact window layout: first tab against the adjacent surface
Light, sidebar, reset zoom:
Light, left panel, zoom in:
Dark, sidebar, zoom out:
Single-row shared borders and middle-tab outline
Close hover in wrapped and compact rows
Connected-background isolation
The same temporary magenta connected-background customization is applied in all three screenshots:
Let bottom-row connected tabs own the strip geometry directly instead of cancelling inherited pill gutters with negative offsets. This keeps their cap and document boundary aligned when Chromium rounds fractional zoom values while preserving upper-row pill spacing.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Update the editor-tab layout expectations for direct bottom-row geometry and the intentional one-stroke overlap with the document surface.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Top-align the non-wrapping connected strip and give editor actions the same full row height so their controls remain vertically centered with tab labels.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Accept the Ubuntu CI hash for the dark responsive model resize fixture after verifying the delta is limited to corner antialiasing.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Own the non-wrapping row-height formula in the shared Modern UI tab layout so connected editor actions cannot drift from tab density changes.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Restore the original dark responsive model resize hash after CI oscillated back, confirming the alternate corner-antialias hash was nondeterministic.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Give connected document tabs their own strip color, restore shared 2026 tab colors for Classic and Agents surfaces, and use the existing strip separator color for connected cap and shoulder outlines.
Refs #336320
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Cherry Wang (chryw)
changed the title
Editor: Stabilize connected tabs across zoom levels
Editor: Refine connected tabs UI
Sep 21, 2026
Overlap first and wrapped-row-start connected fills by one stroke so their left edge reuses the editor body border instead of drawing an adjacent double border.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Use a single editorGroupHeader.connectedTabsBackground token and emit its derived styles only under the connected-tabs root marker.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Document editorGroupHeader.connectedTabsBackground by visual role rather than feature enablement so it remains suitable for any connected tab treatment.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Share the connected-tab root marker across editor controls, contribution setup, and theming, and document the dedicated stylesheet scoping invariant.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Document the reusable connected header color, border ownership, marker lifecycle, and separation between CSS geometry and editor control behavior.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Use flex stretch and the existing separator stroke so connected editor actions follow default and compact row heights without a special row-height variable.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Move every strip background introduced by #335605 to editorGroupHeader.connectedTabsBackground while preserving the original shared tab backgrounds and independent foreground contrast fixes.
Refs #336320
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Reserve upper-row pill insets consistently in tab width and close-action positioning, with single, terminal, wrapped, and left-action regression coverage.
Consolidates #336791
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Restore the terminal close-action shoulder reservation from the consolidated fix and remove the generic wrapped-row top inset so connected strips meet the header edge directly.\n\nCo-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Let the external shoulder reservation own terminal geometry so close actions keep the same visible inset as ordinary and wrapped tabs. Add a regression assertion for balanced label- and edge-side action spacing.\n\nCo-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Classify the outermost connected tab row explicitly so active tabs can reuse the editor frame's top stroke. First-position active tabs also reuse the left stroke, while inner wrapped rows retain pill gutters and balanced close actions.\n\nCo-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Avoid overlapping the connected tab and editor frame strokes. The outermost tab now starts at the frame's inner edge with transparent top and left borders, allowing the editor frame and its clipping radius to be the sole painter at every zoom level.\n\nCo-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Center the close glyph in its painted action surface and shift that surface outward by the same inset so label- and shoulder-side spacing remain balanced. Preserve sole editor-frame ownership of the outer border.\n\nCo-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Preserve high contrast outlines where the outer editor frame is transparent. Account for both cap radii when hiding clipped tab slivers, and update stale assertions for centered actions and editor-owned first-tab borders.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Share action clearance across row densities and label reservation, accounting for painted borders instead of shoulder width. Keep standard row starts on the editor frame and join top-row side strokes directly to its shared top edge.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Let the selected tab fill own its surface instead of painting a second opaque action-container background over the trailing cap stroke. Preserve the close target's own hover and keyboard focus treatment.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Reserve the pill inset and active shoulder before classifying rows, and consume the inset in fill and action positioning rather than changing fit widths through row markers. Exercise wrapping boundary widths in both resize directions and with changing active tabs.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This reset also applies in high-contrast themes and wins the cascade over the action focus/active-hover borders in tabs.css:782-800, leaving the close action without its only HC focus/hover indicator. Scope this cleanup to non-HC themes so the solid focusBorder and HC hover outlines remain visible.
Draw hover and focus outlines on the close action itself while keeping the surrounding action container transparent. Cover focused actions in both high contrast themes and both wrapped rows; account for Electron's hidden test window when checking CSS focus state.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
The reason will be displayed to describe this comment to others. Learn more.
Copilot review overview
🔵 Needs a closer look
The draft explicitly leaves the signed-in Agents-window color-isolation validation pending.
Review effort: Balanced Findings: None
This branch has not been deployed
No deployments
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Cherry Wang (chryw)
changed the title
Summary
Stabilizes connected editor tabs across fractional zoom and wrapped layouts, including the first tab's corner where compact window layout meets an adjacent sidebar or panel.
editorGroupHeader.connectedTabsBackground; Classic, pill and Agents/session surfaces retain their shared theme colors.Refs #336320. Consolidates #336791.
Validation
319b4c0cb10: first/middle/last/only tab, true wrapped rows and sole final-row tabs, real close hover, inactive hover, zoom −1/0/+1, Dark/Light/high contrast, compact tab height, and left-side actions."window.density.layout": "compact"tested separately in Dark and Light beside both the sidebar and a left-positioned panel at all three zoom levels.Visual validation
Compact window layout: first tab against the adjacent surface
Light, sidebar, reset zoom:
Light, left panel, zoom in:
Dark, sidebar, zoom out:
Single-row shared borders and middle-tab outline
Close hover in wrapped and compact rows
Connected-background isolation
The same temporary magenta connected-background customization is applied in all three screenshots: