Remove some deprecated code in ./src/vs/base #103454

src/vs/workbench/browser/parts/editor/tabsTitleControl.ts

@@ -32,7 +32,7 @@ import { Color } from 'vs/base/common/color';
 import { INotificationService } from 'vs/platform/notification/common/notification';
 import { IExtensionService } from 'vs/workbench/services/extensions/common/extensions';
 import { MergeGroupMode, IMergeGroupOptions, GroupsArrangement, IEditorGroupsService } from 'vs/workbench/services/editor/common/editorGroupsService';
-import { addClass, addDisposableListener, EventType, EventHelper, removeClass, Dimension, scheduleAtNextAnimationFrame, findParentWithClass, clearNode } from 'vs/base/browser/dom';
+import { addDisposableListener, EventType, EventHelper, Dimension, scheduleAtNextAnimationFrame, findParentWithClass, clearNode } from 'vs/base/browser/dom';
 import { localize } from 'vs/nls';
 import { IEditorGroupsAccessor, IEditorGroupView, EditorServiceImpl, EDITOR_TITLE_HEIGHT } from 'vs/workbench/browser/parts/editor/editor';
 import { CloseOneEditorAction, UnpinEditorAction } from 'vs/workbench/browser/parts/editor/editorActions';
@@ -123,14 +123,14 @@ export class TabsTitleControl extends TitleControl {
 
 		// Tabs and Actions Container (are on a single row with flex side-by-side)
 		this.tabsAndActionsContainer = document.createElement('div');
-		addClass(this.tabsAndActionsContainer, 'tabs-and-actions-container');
+		this.tabsAndActionsContainer.classList.add('tabs-and-actions-container');
 		this.titleContainer.appendChild(this.tabsAndActionsContainer);
 
 		// Tabs Container
 		this.tabsContainer = document.createElement('div');
 		this.tabsContainer.setAttribute('role', 'tablist');
 		this.tabsContainer.draggable = true;
-		addClass(this.tabsContainer, 'tabs-container');
+		this.tabsContainer.classList.add('tabs-container');
 		this._register(Gesture.addTarget(this.tabsContainer));
 
 		// Tabs Scrollbar
@@ -142,7 +142,7 @@ export class TabsTitleControl extends TitleControl {
 
 		// Editor Toolbar Container
 		this.editorToolbarContainer = document.createElement('div');
-		addClass(this.editorToolbarContainer, 'editor-actions');
+		this.editorToolbarContainer.classList.add('editor-actions');
 		this.tabsAndActionsContainer.appendChild(this.editorToolbarContainer);
 
 		// Editor Actions Toolbar
@@ -150,7 +150,7 @@ export class TabsTitleControl extends TitleControl {
 
 		// Breadcrumbs (are on a separate row below tabs and actions)
 		const breadcrumbsContainer = document.createElement('div');
-		addClass(breadcrumbsContainer, 'tabs-breadcrumbs');
+		breadcrumbsContainer.classList.add('tabs-breadcrumbs');
 		this.titleContainer.appendChild(breadcrumbsContainer);
 		this.createBreadcrumbsControl(breadcrumbsContainer, { showFileIcons: true, showSymbolIcons: true, showDecorationColors: false, breadcrumbsBackground: breadcrumbsBackground });
 	}
@@ -250,7 +250,7 @@ export class TabsTitleControl extends TitleControl {
 			onDragEnter: e => {
 
 				// Always enable support to scroll while dragging
-				addClass(tabsContainer, 'scroll');
+				tabsContainer.classList.add('scroll');
 
 				// Return if the target is not on the tabs container
 				if (e.target !== tabsContainer) {
@@ -298,17 +298,17 @@ export class TabsTitleControl extends TitleControl {
 
 			onDragLeave: e => {
 				this.updateDropFeedback(tabsContainer, false);
-				removeClass(tabsContainer, 'scroll');
+				tabsContainer.classList.remove('scroll');
 			},
 
 			onDragEnd: e => {
 				this.updateDropFeedback(tabsContainer, false);
-				removeClass(tabsContainer, 'scroll');
+				tabsContainer.classList.remove('scroll');
 			},
 
 			onDrop: e => {
 				this.updateDropFeedback(tabsContainer, false);
-				removeClass(tabsContainer, 'scroll');
+				tabsContainer.classList.remove('scroll');
 
 				if (e.target === tabsContainer) {
 					this.onDrop(e, this.group.count, tabsContainer);
@@ -560,14 +560,14 @@ export class TabsTitleControl extends TitleControl {
 		tabContainer.draggable = true;
 		tabContainer.tabIndex = 0;
 		tabContainer.setAttribute('role', 'tab');
-		addClass(tabContainer, 'tab');
+		tabContainer.classList.add('tab');
 
 		// Gesture Support
 		this._register(Gesture.addTarget(tabContainer));
 
 		// Tab Border Top
 		const tabBorderTopContainer = document.createElement('div');
-		addClass(tabBorderTopContainer, 'tab-border-top-container');
+		tabBorderTopContainer.classList.add('tab-border-top-container');
 		tabContainer.appendChild(tabBorderTopContainer);
 
 		// Tab Editor Label
@@ -575,7 +575,7 @@ export class TabsTitleControl extends TitleControl {
 
 		// Tab Actions
 		const tabActionsContainer = document.createElement('div');
-		addClass(tabActionsContainer, 'tab-actions');
+		tabActionsContainer.classList.add('tab-actions');
 		tabContainer.appendChild(tabActionsContainer);
 
 		const tabActionRunner = new EditorCommandsContextActionRunner({ groupId: this.group.id, editorIndex: index });
@@ -591,7 +591,7 @@ export class TabsTitleControl extends TitleControl {
 
 		// Tab Border Bottom
 		const tabBorderBottomContainer = document.createElement('div');
-		addClass(tabBorderBottomContainer, 'tab-border-bottom-container');
+		tabBorderBottomContainer.classList.add('tab-border-bottom-container');
 		tabContainer.appendChild(tabBorderBottomContainer);
 
 		// Eventing
@@ -767,8 +767,8 @@ export class TabsTitleControl extends TitleControl {
 			this.doFillResourceDataTransfers(editor, e);
 
 			// Fixes https://github.com/Microsoft/vscode/issues/18733
-			addClass(tab, 'dragged');
-			scheduleAtNextAnimationFrame(() => removeClass(tab, 'dragged'));
+			tab.classList.add('dragged');
+			scheduleAtNextAnimationFrame(() => tab.classList.remove('dragged'));
 		}));
 
 		// Drop support
@@ -776,7 +776,7 @@ export class TabsTitleControl extends TitleControl {
 			onDragEnter: e => {
 
 				// Update class to signal drag operation
-				addClass(tab, 'dragged-over');
+				tab.classList.add('dragged-over');
 
 				// Return if transfer is unsupported
 				if (!this.isSupportedDropTransfer(e)) {
@@ -816,20 +816,20 @@ export class TabsTitleControl extends TitleControl {
 				this.updateDropFeedback(tab, true, index);
 			},
 
-			onDragLeave: e => {
-				removeClass(tab, 'dragged-over');
+			onDragLeave: () => {
+				tab.classList.remove('dragged-over');
 				this.updateDropFeedback(tab, false, index);
 			},
 
-			onDragEnd: e => {
-				removeClass(tab, 'dragged-over');
+			onDragEnd: () => {
+				tab.classList.remove('dragged-over');
 				this.updateDropFeedback(tab, false, index);
 
 				this.editorTransfer.clearData(DraggedEditorIdentifier.prototype);
 			},
 
 			onDrop: e => {
-				removeClass(tab, 'dragged-over');
+				tab.classList.remove('dragged-over');
 				this.updateDropFeedback(tab, false, index);
 
 				this.onDrop(e, index, tabsContainer);
@@ -996,10 +996,10 @@ export class TabsTitleControl extends TitleControl {
 		const tabsContainerBorderColor = this.getColor(EDITOR_GROUP_HEADER_TABS_BORDER);
 		if (this.tabsAndActionsContainer) {
 			if (tabsContainerBorderColor) {
-				addClass(this.tabsAndActionsContainer, 'tabs-border-bottom');
+				this.tabsAndActionsContainer.classList.add('tabs-border-bottom');
 				this.tabsAndActionsContainer.style.setProperty('--tabs-border-bottom-color', tabsContainerBorderColor.toString());
 			} else {
-				removeClass(this.tabsAndActionsContainer, 'tabs-border-bottom');
+				this.tabsAndActionsContainer.classList.remove('tabs-border-bottom');
 				this.tabsAndActionsContainer.style.removeProperty('--tabs-border-bottom-color');
 			}
 		}
@@ -1041,25 +1041,22 @@ export class TabsTitleControl extends TitleControl {
 		// Settings
 		const tabActionsVisibility = isTabSticky && options.pinnedTabSizing === 'compact' ? 'off' /* treat sticky compact tabs as tabCloseButton: 'off' */ : options.tabCloseButton;
 		['off', 'left', 'right'].forEach(option => {
-			const domAction = tabActionsVisibility === option ? addClass : removeClass;
-			domAction(tabContainer, `tab-actions-${option}`);
+			tabContainer.classList.toggle(`tab-actions-${option}`, tabActionsVisibility === option);
 		});
 
 		const tabSizing = isTabSticky && options.pinnedTabSizing === 'shrink' ? 'shrink' /* treat sticky shrink tabs as tabSizing: 'shrink' */ : options.tabSizing;
 		['fit', 'shrink'].forEach(option => {
-			const domAction = tabSizing === option ? addClass : removeClass;
-			domAction(tabContainer, `sizing-${option}`);
+			tabContainer.classList.toggle(`sizing-${option}`, tabSizing === option);
 		});
 
 		if (options.showIcons && options.hasIcons) {
-			addClass(tabContainer, 'has-icon');
+			tabContainer.classList.add('has-icon');
 		} else {
-			removeClass(tabContainer, 'has-icon');
+			tabContainer.classList.remove('has-icon');
 		}
 
 		['compact', 'shrink', 'normal'].forEach(option => {
-			const domAction = isTabSticky && options.pinnedTabSizing === option ? addClass : removeClass;
-			domAction(tabContainer, `sticky-${option}`);
+			tabContainer.classList.toggle(`sticky-${option}`, isTabSticky && !!options.pinnedTabSizing);
 		});
 
 		// Sticky compact/shrink tabs need a position to remain at their location
@@ -1142,25 +1139,25 @@ export class TabsTitleControl extends TitleControl {
 		if (this.group.isActive(editor)) {
 
 			// Container
-			addClass(tabContainer, 'active');
+			tabContainer.classList.add('active');
 			tabContainer.setAttribute('aria-selected', 'true');
 			tabContainer.style.backgroundColor = this.getColor(isGroupActive ? TAB_ACTIVE_BACKGROUND : TAB_UNFOCUSED_ACTIVE_BACKGROUND) || '';
 
 			const activeTabBorderColorBottom = this.getColor(isGroupActive ? TAB_ACTIVE_BORDER : TAB_UNFOCUSED_ACTIVE_BORDER);
 			if (activeTabBorderColorBottom) {
-				addClass(tabContainer, 'tab-border-bottom');
+				tabContainer.classList.add('tab-border-bottom');
 				tabContainer.style.setProperty('--tab-border-bottom-color', activeTabBorderColorBottom.toString());
 			} else {
-				removeClass(tabContainer, 'tab-border-bottom');
+				tabContainer.classList.remove('tab-border-bottom');
 				tabContainer.style.removeProperty('--tab-border-bottom-color');
 			}
 
 			const activeTabBorderColorTop = allowBorderTop ? this.getColor(isGroupActive ? TAB_ACTIVE_BORDER_TOP : TAB_UNFOCUSED_ACTIVE_BORDER_TOP) : undefined;
 			if (activeTabBorderColorTop) {
-				addClass(tabContainer, 'tab-border-top');
+				tabContainer.classList.add('tab-border-top');
 				tabContainer.style.setProperty('--tab-border-top-color', activeTabBorderColorTop.toString());
 			} else {
-				removeClass(tabContainer, 'tab-border-top');
+				tabContainer.classList.remove('tab-border-top');
 				tabContainer.style.removeProperty('--tab-border-top-color');
 			}
 
@@ -1172,7 +1169,7 @@ export class TabsTitleControl extends TitleControl {
 		else {
 
 			// Container
-			removeClass(tabContainer, 'active');
+			tabContainer.classList.remove('active');
 			tabContainer.setAttribute('aria-selected', 'false');
 			tabContainer.style.backgroundColor = this.getColor(isGroupActive ? TAB_INACTIVE_BACKGROUND : TAB_UNFOCUSED_INACTIVE_BACKGROUND) || '';
 			tabContainer.style.boxShadow = '';
@@ -1187,7 +1184,7 @@ export class TabsTitleControl extends TitleControl {
 
 		// Tab: dirty (unless saving)
 		if (editor.isDirty() && !editor.isSaving()) {
-			addClass(tabContainer, 'dirty');
+			tabContainer.classList.add('dirty');
 
 			// Highlight modified tabs with a border if configured
 			if (this.accessor.partOptions.highlightModifiedTabs) {
@@ -1205,20 +1202,18 @@ export class TabsTitleControl extends TitleControl {
 				if (modifiedBorderColor) {
 					hasModifiedBorderColor = true;
 
-					addClass(tabContainer, 'dirty-border-top');
+					tabContainer.classList.add('dirty-border-top');
 					tabContainer.style.setProperty('--tab-dirty-border-top-color', modifiedBorderColor);
 				}
 			} else {
-				removeClass(tabContainer, 'dirty-border-top');
+				tabContainer.classList.remove('dirty-border-top');
 				tabContainer.style.removeProperty('--tab-dirty-border-top-color');
 			}
 		}
 
 		// Tab: not dirty
 		else {
-			removeClass(tabContainer, 'dirty');
-
-			removeClass(tabContainer, 'dirty-border-top');
+			tabContainer.classList.remove('dirty', 'dirty-border-top');
 			tabContainer.style.removeProperty('--tab-dirty-border-top-color');
 		}
 
@@ -1320,13 +1315,13 @@ export class TabsTitleControl extends TitleControl {
 		// is little enough that we need to disable sticky tabs sticky positioning
 		// so that tabs can be scrolled at naturally.
 		if (this.group.stickyCount > 0 && availableTabsContainerWidth < TabsTitleControl.TAB_SIZES.fit) {
-			addClass(tabsContainer, 'disable-sticky-tabs');
+			tabsContainer.classList.add('disable-sticky-tabs');
 
 			availableTabsContainerWidth = visibleTabsContainerWidth;
 			stickyTabsWidth = 0;
 			activeTabSticky = false;
 		} else {
-			removeClass(tabsContainer, 'disable-sticky-tabs');
+			tabsContainer.classList.remove('disable-sticky-tabs');
 		}
 
 		let activeTabPosX: number | undefined;
@@ -1441,7 +1436,7 @@ export class TabsTitleControl extends TitleControl {
 		EventHelper.stop(e, true);
 
 		this.updateDropFeedback(tabsContainer, false);
-		removeClass(tabsContainer, 'scroll');
+		tabsContainer.classList.remove('scroll');
 
 		// Local Editor DND
 		if (this.editorTransfer.hasData(DraggedEditorIdentifier.prototype)) {