Skip to content

Fix connected tab close button spacing - #336791

Open
Copilot wants to merge 4 commits into
mainfrom
copilot/fix-connected-tab-close-spacing
Open

Copilot wants to merge 4 commits into
mainfrom
copilot/fix-connected-tab-close-spacing

Conversation

Copilot AI commented Sep 18, 2026

Copy link
Copy Markdown
Contributor

Fixes the connected document tab close action spacing so terminal shoulders and wrapped pill insets reserve the same space around the action as ordinary connected tabs. This keeps the visible tab cap width stable when closing down to a single tab.

Adds a geometry regression test covering multiple, single, bottom-wrapped, and upper-wrapped states, plus a single-tab component fixture.

Validation:

  • npm run eslint -- src/vs/workbench/test/browser/parts/editor/multiEditorTabsControl.test.ts src/vs/workbench/test/browser/componentFixtures/editor/editorTabBar.fixture.ts
  • npm run stylelint -- src/vs/workbench/contrib/modernUI/browser/media/connectedEditorTabs.css
  • Core compile emitted the affected sources with zero TypeScript errors; the secondary typecheck process was killed by the constrained environment.
  • Targeted browser geometry test could not run locally because Playwright system dependencies are unavailable behind the environment firewall.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Copilot AI requested a balanced review from Copilot and removed request for Copilot September 18, 2026 16:05
@chryw
Cherry Wang (chryw) requested a balanced review from Copilot September 18, 2026 16:52

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🟡 Changes recommended

Left-positioned tab actions still allow the terminal shoulder inset to shrink the visible tab cap.

Get a fresh assessment by requesting another Copilot review.

Pull request overview

Adjusts connected-tab close-button spacing to keep tab geometry consistent across terminal and wrapped states.

Changes:

  • Updates connected-tab action padding and positioning.
  • Adds geometry regression coverage.
  • Adds a single-tab visual fixture.
File summaries
File Description
connectedEditorTabs.css Adjusts close-action spacing.
multiEditorTabsControl.test.ts Tests connected-tab geometry states.
editorTabBar.fixture.ts Adds a single-tab fixture.
Review details
  • Files reviewed: 3/3 changed files
  • Comments generated: 1
  • Review effort level: Balanced

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

Comment on lines +381 to +382
.modern-ui.modern-ui-connected-editor-tabs.monaco-workbench .part.editor > .content .editor-group-container > .title.tabs .tabs-container > .tab.active:not(.connected-tab-upper-row):not(.tab-actions-left):is(:last-child, .last-in-row, .connected-tab-right-edge) {
--modern-ui-tab-action-padding: calc(var(--vscode-spacing-size280) + var(--modern-ui-connected-tab-shoulder-radius) + var(--modern-ui-connected-tab-shoulder-radius));

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Addressed in b4e84c6. Left-positioned terminal tabs now reserve the trailing shoulder in their fit width, and the geometry regression repeats the multiple-to-single transition with tabActionLocation: 'left'.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
@github-actions

github-actions Bot commented Sep 18, 2026

Copy link
Copy Markdown
Contributor

Screenshot Changes

Base: 71e5cd8b Current: 9f0f7087

The screenshot report exceeds GitHub's comment size limit. View the full report in the workflow summary.

roblourens
roblourens previously approved these changes Sep 18, 2026
Add explicit close-action hover fixtures for single, multiple, and wrapped tab layouts.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

Copilot AI commented Sep 18, 2026

Copy link
Copy Markdown
Contributor Author

Added explicit close-action hover fixtures for the critical terminal layouts: single tab, last tab in a multi-tab row, upper wrapped row, and bottom wrapped row. These show the actual hover background so its inset spacing can be visually compared. Also narrowed width reservation to stable logical terminals, avoiding the viewport-edge geometry feedback loop seen in browser/Electron CI.

Copilot AI requested review from Dmitriy Vasyura (dmitrivMS) and roblourens and a balanced review from Copilot and removed request for Copilot September 18, 2026 22:59
Ensure every close-action hover fixture uses a clean active editor so the captured state shows the close glyph instead of a dirty indicator.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Copilot AI requested a balanced review from Copilot and removed request for Copilot September 19, 2026 22:17
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants