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

[Bug] There is always a focus-border around editor when editor background is transparent

Open KurtGokhan opened this issue 10 months ago • 2 comments

Reproducible in vscode.dev or in VS Code Desktop?

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

Monaco Editor Playground Link

Playground link

Monaco Editor Playground Code


monaco.editor.defineTheme("myCustomTheme", {
	base: "vs",
	inherit: true,
	rules: [],
	colors: {
		"editor.background": "#00000000",
                "focusBorder": '#ff0000',
	},
});

const value = `function hello() {
	alert('Hello world!');
}`;

const myEditor = monaco.editor.create(document.getElementById("container"), {
	value,
	language: "javascript",
	theme: 'myCustomTheme',
});

Reproduction Steps

Set the editor.background to a transparent value and you should be able to see the border around the editor.

Actual (Problematic) Behavior

There is always a focus border around the editor

Expected Behavior

There shouldn't be a focus border around the editor

Additional Context

The issue was first introduced in v0.46.0. Specifically this commit seems to be the culprit.

KurtGokhan avatar Apr 02 '24 17:04 KurtGokhan

It also happens when zooming out image

CGNonofr avatar Apr 26 '24 16:04 CGNonofr