monaco-editor icon indicating copy to clipboard operation
monaco-editor copied to clipboard

[Bug] DiffEditor with glyphMargin: false, still renders glyphMargin when rendered side by side.

Open jroxbury opened this issue 11 months ago • 1 comments

Reproducible in vscode.dev or in VS Code Desktop?

  • [X] Not reproducible in vscode.dev or VS Code Desktop

Reproducible in the monaco editor playground?

Monaco Editor Playground Link

https://microsoft.github.io/monaco-editor/playground.html?source=v0.47.0#XQAAAALtAgAAAAAAAABBqQkHQ5NjdMjwa-jY7SIQ9S7DNlzs5W-mwj0fe1ZCDRFc9ws9XQE0SJE1jc2VKxhaLFIw9vEWSxW3yscw2niNxqjsAD0-ojp5wJqOvqwlfzL0lj1q0QqHuzP9sldHeU38FrR0K4YSNEzAxFQQ9UAeGugw0A9vzG322o22aQJt8vF_OJ-CiyIUlTmYgwXhvFtZiw6vrXxme9hCDg0OSXvg7TEw1rd5V-g1Rh4pXehVYLGJO58JoRabIuhycF9fYiANRmdlMDG_x4x7X5uR8Gm4lmfiETNh5JL3NutP1l6kwWkkSWqtzDKnuuJOebjhyPN4a5BoXB22z2dKOVlw4AR7NJNK-Yx-v5AS2uecQIu28EXPMqKKuAIFUQdUC2vD4A1-Eq2elmVkc30fvf6wfKbqCV8csEmmzWkTjUZdGzJO5XEGUxbONootGNFsFj4DD2WWbg0ecs4xKnlRDqT_fWSvMAc3JIGEqp3aPiRD-N3W4ZjuA5ewcsIqJq5GH6c1433sBxEGaZvEate8YaLK_xtvmgA

Monaco Editor Playground Code

var originalModel = monaco.editor.createModel(
	"This line is removed on the right.\njust some text\nabcd\nefgh\nSome more text",
	"text/plain"
);
var modifiedModel = monaco.editor.createModel(
	"just some text\nabcz\nzzzzefgh\nSome more text\nThis line is removed on the left.",
	"text/plain"
);

var diffEditor = monaco.editor.createDiffEditor(
	document.getElementById("container"),
	{
		// Renders without glyph margin
		// renderSideBySide: false,
		// glyphMargin: false,

		// Still shows glyphMargin
		renderSideBySide: true,
		useInlineViewWhenSpaceIsLimited: false,
		glyphMargin: false,
	}
);
diffEditor.setModel({
	original: originalModel,
	modified: modifiedModel,
});

Reproduction Steps

Set these options and observe that the glyph margin is still shown. renderSideBySide: true, useInlineViewWhenSpaceIsLimited: false, glyphMargin: false,

monaco-editor-0 47 0-glyph-margin-side-by-side-diff

Actual (Problematic) Behavior

Glyph margin is turned off, but still renders when the diff editor is in side by side mode.

Expected Behavior

I would expect, regardless of whether it is rendered in side by side or not, that if glyphMargin is set to false, then glyphMargin should not be shown,

Additional Context

No response

jroxbury avatar Mar 28 '24 18:03 jroxbury

I also encountered the same problem, setting glyphMargin to false will still render WX20240407-170121@2x At present, I solve it in this way. The following is the code to solve it.

const diffEditor = monaco.editor.createDiffEditor(editorContainer.value, {
    theme: 'vs-dark',
    enableSplitViewResizing: true,
    roundedSelection: false,
    diffWordWrap: true,
    autoIndent: true,
    automaticLayout: true,
    scrollBeyondLastLine: false,
    scrollbar: {
      verticalScrollbarSize: 0
    },
    glyphMargin: false,
    value: '',
    fontSize: '14px',
    originalEditable: true,
    readOnly: false,
    language: 'text/plain',
  });
const originalModel = monaco.editor.createModel('', 'text/plain');
const modifiedModel = monaco.editor.createModel('', 'text/plain');
diffEditor.setModel({
  original: originalModel,
  modified: modifiedModel
});
// update glyphMargin
diffEditor.getOriginalEditor().updateOptions({
  glyphMargin: false
})

yp-app avatar Apr 07 '24 09:04 yp-app