From e1eeccd55cf0bbbe378efd8e04745714eefb41c2 Mon Sep 17 00:00:00 2001 From: Benjamin Pasero Date: Mon, 20 Nov 2017 12:53:54 +0100 Subject: [PATCH] Dragging a tab can show visual glitch when tab not fully visible (fixes #18733) --- src/vs/workbench/browser/parts/editor/media/tabstitle.css | 4 ++++ src/vs/workbench/browser/parts/editor/tabsTitleControl.ts | 4 ++++ 2 files changed, 8 insertions(+) diff --git a/src/vs/workbench/browser/parts/editor/media/tabstitle.css b/src/vs/workbench/browser/parts/editor/media/tabstitle.css index 15b2f88b2fd..6de164ac7d1 100644 --- a/src/vs/workbench/browser/parts/editor/media/tabstitle.css +++ b/src/vs/workbench/browser/parts/editor/media/tabstitle.css @@ -47,6 +47,10 @@ padding-left: 10px; } +.monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .tabs-container > .tab.dragged { + will-change: transform; /* forces tab to be drawn on a separate layer (fixes https://github.com/Microsoft/vscode/issues/18733) */ +} + .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .tabs-container > .tab.close-button-left { flex-direction: row-reverse; padding-left: 0; diff --git a/src/vs/workbench/browser/parts/editor/tabsTitleControl.ts b/src/vs/workbench/browser/parts/editor/tabsTitleControl.ts index d2e91ffa84d..054b32740ac 100644 --- a/src/vs/workbench/browser/parts/editor/tabsTitleControl.ts +++ b/src/vs/workbench/browser/parts/editor/tabsTitleControl.ts @@ -746,6 +746,10 @@ export class TabsTitleControl extends TitleControl { e.dataTransfer.setData('DownloadURL', [MIME_BINARY, editor.getName(), resourceStr].join(':')); // enables support to drag a tab as file to desktop } } + + // Fixes https://github.com/Microsoft/vscode/issues/18733 + DOM.addClass(tab, 'dragged'); + scheduleAtNextAnimationFrame(() => DOM.removeClass(tab, 'dragged')); })); // We need to keep track of DRAG_ENTER and DRAG_LEAVE events because a tab is not just a div without children, -- GitLab