Implement Editor Canvas Padding via editor.padding.maxEditorCanvasWidth. Relates to Issue #334959 - #334964
Open
Rick Strahl (RickStrahl) wants to merge 1 commit into
Open
Conversation
Copilot started reviewing on behalf of
Rick Strahl (RickStrahl)
September 7, 2026 18:28
View session
Contributor
There was a problem hiding this comment.
🟡 Changes recommended
Unresolved CSS validation, GPU runtime alignment, and gutter hit-testing issues block approval.
Once you've addressed the issues Copilot identified, you can request another Copilot review.
Pull request overview
Adds editor.padding.maxEditorCanvasWidth to center and constrain editor canvas rendering while preserving surrounding UI.
Changes:
- Adds and validates the new padding option.
- Clips and positions DOM/GPU rendering.
- Updates layout, scrollbars, sticky scroll, and tests.
File summaries
| File | Review |
|---|---|
src/vs/monaco.d.ts |
Exposes the new padding option. |
src/vs/editor/test/browser/widget/codeEditorWidget.test.ts |
Tests rendering and runtime behavior. |
src/vs/editor/test/browser/config/editorLayoutProvider.test.ts |
Tests validation and layout. |
src/vs/editor/contrib/stickyScroll/browser/stickyScrollWidget.ts |
Caps sticky-scroll content width. |
src/vs/editor/common/config/editorOptions.ts |
Computes capped layout. Moderate: widened contentLeft causes canvas padding clicks to be treated as folding-gutter clicks. |
src/vs/editor/browser/widget/codeEditor/codeEditorWidget.ts |
Adjusts visible-position offsets. |
src/vs/editor/browser/viewParts/viewLinesGpu/viewLinesGpu.ts |
Constrains GPU text rendering. |
src/vs/editor/browser/viewParts/viewLines/viewLines.ts |
Computes DOM clipping. |
src/vs/editor/browser/viewParts/viewLines/viewLines.css |
Applies clipping. Critical: --editor-canvas-clip is missing from the known-variable registry, causing CSS hygiene failure. |
src/vs/editor/browser/viewParts/editorScrollbar/editorScrollbar.ts |
Preserves scrollbar alignment. |
src/vs/editor/browser/gpu/viewGpuContext.ts |
Updates GPU renderer state. Moderate: runtime padding changes leave GPU layout buffers stale and rendering misaligned. |
src/vs/editor/browser/gpu/rectangleRenderer.ts |
Clips GPU rectangles. |
src/vs/editor/browser/gpu/gpuUtils.ts |
Adds shared scissor calculations. |
Review details
- Files reviewed: 12/13 changed files
- Comments generated: 3
- Review effort level: Balanced
💡 Configure MCP servers for context-aware, tailored reviews. Learn more in the docs.
| } | ||
|
|
||
| .monaco-editor .lines-content > :not(.contentWidgets) { | ||
| clip-path: var(--editor-canvas-clip, none); |
| this.contentLeft = contentLeft; | ||
|
|
||
| this.rectangleRenderer = this._register(this._instantiationService.createInstance(RectangleRenderer, context, this.contentLeft, this.devicePixelRatio, this.canvas.domNode, this.ctx, ViewGpuContext.device)); | ||
| this.rectangleRenderer = this._register(this._instantiationService.createInstance(RectangleRenderer, context, this.devicePixelRatio, this.canvas.domNode, this.ctx, ViewGpuContext.device)); |
| const contentWidth = padding.maxEditorCanvasWidth > 0 | ||
| ? Math.min(availableCanvasWidth, padding.maxEditorCanvasWidth + verticalScrollbarWidth) | ||
| : availableCanvasWidth; | ||
| contentLeft += Math.floor(Math.max(0, availableCanvasWidth - contentWidth) / 2); |
Bryan Chen (bryanchen-d)
assigned
Alexandru Dima (alexdima) and unassigned
Bryan Chen (bryanchen-d)
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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
Addresses #334959
Agent generated PR that works for the end result meant as a starting point for review. Provided here mainly as a starting point as this goes beyond my skill into the innards of the VS Code rendering pipeline.
Uses what seems like somewhat high risk client clipping to restrict the rendering. It seems that there should perhaps be a more fundamental way to control the right canvas margin when rendering text but that's unlikely given the hard wired width sizing that VS Code uses.