do not use deprecated dom helper methods

isidorn · isidorn · commit c2da75080d88 · 2020-09-11T17:34:48.000+02:00
#103454
diff --git a/src/vs/base/browser/ui/selectBox/selectBoxCustom.ts b/src/vs/base/browser/ui/selectBox/selectBoxCustom.ts
@@ -45,7 +45,7 @@ class SelectListRenderer implements IListRenderer<ISelectOptionItem, ISelectList
 		data.text = dom.append(container, $('.option-text'));
 		data.decoratorRight = dom.append(container, $('.option-decorator-right'));
 		data.itemDescription = dom.append(container, $('.option-text-description'));
-		dom.addClass(data.itemDescription, 'visually-hidden');
+		data.itemDescription.classList.add('visually-hidden');
 
 		return data;
 	}
@@ -68,10 +68,10 @@ class SelectListRenderer implements IListRenderer<ISelectOptionItem, ISelectList
 
 		// pseudo-select disabled option
 		if (isDisabled) {
-			dom.addClass(data.root, 'option-disabled');
+			data.root.classList.add('option-disabled');
 		} else {
 			// Make sure we do class removal from prior template rendering
-			dom.removeClass(data.root, 'option-disabled');
+			data.root.classList.remove('option-disabled');
 		}
 	}
 
@@ -162,7 +162,7 @@ export class SelectBoxList extends Disposable implements ISelectBoxDelegate, ILi
 		this.contextViewProvider = contextViewProvider;
 		this.selectDropDownContainer = dom.$('.monaco-select-box-dropdown-container');
 		// Use custom CSS vars for padding calculation (shared with parent select)
-		dom.addClass(this.selectDropDownContainer, 'monaco-select-box-dropdown-padding');
+		this.selectDropDownContainer.classList.add('monaco-select-box-dropdown-padding');
 
 		// Setup container for select option details
 		this.selectionDetailsPane = dom.append(this.selectDropDownContainer, $('.select-box-details-pane'));
@@ -309,7 +309,7 @@ export class SelectBoxList extends Disposable implements ISelectBoxDelegate, ILi
 
 	public render(container: HTMLElement): void {
 		this.container = container;
-		dom.addClass(container, 'select-container');
+		container.classList.add('select-container');
 		container.appendChild(this.selectElement);
 		this.applyStyles();
 	}
@@ -440,8 +440,8 @@ export class SelectBoxList extends Disposable implements ISelectBoxDelegate, ILi
 				this.layoutSelectDropDown();
 			},
 			onHide: () => {
-				dom.toggleClass(this.selectDropDownContainer, 'visible', false);
-				dom.toggleClass(this.selectElement, 'synthetic-focus', false);
+				this.selectDropDownContainer.classList.remove('visible');
+				this.selectElement.classList.remove('synthetic-focus');
 			},
 			anchorPosition: this._dropDownPosition
 		}, this.selectBoxOptions.optionsAsChildren ? this.container : undefined);
@@ -455,8 +455,8 @@ export class SelectBoxList extends Disposable implements ISelectBoxDelegate, ILi
 			render: (container: HTMLElement) => this.renderSelectDropDown(container),
 			layout: () => this.layoutSelectDropDown(),
 			onHide: () => {
-				dom.toggleClass(this.selectDropDownContainer, 'visible', false);
-				dom.toggleClass(this.selectElement, 'synthetic-focus', false);
+				this.selectDropDownContainer.classList.remove('visible');
+				this.selectElement.classList.remove('synthetic-focus');
 			},
 			anchorPosition: this._dropDownPosition
 		}, this.selectBoxOptions.optionsAsChildren ? this.container : undefined);
@@ -529,7 +529,7 @@ export class SelectBoxList extends Disposable implements ISelectBoxDelegate, ILi
 		if (this.selectList) {
 
 			// Make visible to enable measurements
-			dom.toggleClass(this.selectDropDownContainer, 'visible', true);
+			this.selectDropDownContainer.classList.add('visible');
 
 			const selectPosition = dom.getDomNodePagePosition(this.selectElement);
 			const styles = getComputedStyle(this.selectElement);
@@ -584,8 +584,8 @@ export class SelectBoxList extends Disposable implements ISelectBoxDelegate, ILi
 					this.selectDropDownContainer.appendChild(this.selectionDetailsPane);
 					this.selectDropDownContainer.appendChild(this.selectDropDownListContainer);
 
-					dom.removeClass(this.selectionDetailsPane, 'border-top');
-					dom.addClass(this.selectionDetailsPane, 'border-bottom');
+					this.selectionDetailsPane.classList.remove('border-top');
+					this.selectionDetailsPane.classList.add('border-bottom');
 
 				} else {
 					this._dropDownPosition = AnchorPosition.BELOW;
@@ -594,8 +594,8 @@ export class SelectBoxList extends Disposable implements ISelectBoxDelegate, ILi
 					this.selectDropDownContainer.appendChild(this.selectDropDownListContainer);
 					this.selectDropDownContainer.appendChild(this.selectionDetailsPane);
 
-					dom.removeClass(this.selectionDetailsPane, 'border-bottom');
-					dom.addClass(this.selectionDetailsPane, 'border-top');
+					this.selectionDetailsPane.classList.remove('border-bottom');
+					this.selectionDetailsPane.classList.add('border-top');
 				}
 				// Do full layout on showSelectDropDown only
 				return true;
@@ -655,8 +655,8 @@ export class SelectBoxList extends Disposable implements ISelectBoxDelegate, ILi
 
 			// Maintain focus outline on parent select as well as list container - tabindex for focus
 			this.selectDropDownListContainer.setAttribute('tabindex', '0');
-			dom.toggleClass(this.selectElement, 'synthetic-focus', true);
-			dom.toggleClass(this.selectDropDownContainer, 'synthetic-focus', true);
+			this.selectElement.classList.add('synthetic-focus');
+			this.selectDropDownContainer.classList.add('synthetic-focus');
 
 			return true;
 		} else {
diff --git a/src/vs/base/browser/ui/selectBox/selectBoxNative.ts b/src/vs/base/browser/ui/selectBox/selectBoxNative.ts
@@ -143,7 +143,7 @@ export class SelectBoxNative extends Disposable implements ISelectBoxDelegate {
 	}
 
 	public render(container: HTMLElement): void {
-		dom.addClass(container, 'select-container');
+		container.classList.add('select-container');
 		container.appendChild(this.selectElement);
 		this.setOptions(this.options, this.selected);
 		this.applyStyles();
diff --git a/src/vs/workbench/contrib/debug/browser/breakpointEditorContribution.ts b/src/vs/workbench/contrib/debug/browser/breakpointEditorContribution.ts
@@ -627,7 +627,7 @@ class InlineBreakpointWidget implements IContentWidget, IDisposable {
 			return null;
 		}
 		// Workaround: since the content widget can not be placed before the first column we need to force the left position
-		dom.toggleClass(this.domNode, 'line-start', this.range.startColumn === 1);
+		this.domNode.classList.toggle('line-start', this.range.startColumn === 1);
 
 		return {
 			position: { lineNumber: this.range.startLineNumber, column: this.range.startColumn - 1 },
diff --git a/src/vs/workbench/contrib/debug/browser/debugActionViewItems.ts b/src/vs/workbench/contrib/debug/browser/debugActionViewItems.ts
@@ -84,10 +84,10 @@ export class StartDebugActionViewItem implements IActionViewItem {
 			}
 		}));
 		this.toDispose.push(dom.addDisposableListener(this.start, dom.EventType.MOUSE_UP, () => {
-			dom.removeClass(this.start, 'active');
+			this.start.classList.remove('active');
 		}));
 		this.toDispose.push(dom.addDisposableListener(this.start, dom.EventType.MOUSE_OUT, () => {
-			dom.removeClass(this.start, 'active');
+			this.start.classList.remove('active');
 		}));
 
 		this.toDispose.push(dom.addDisposableListener(this.start, dom.EventType.KEY_DOWN, (e: KeyboardEvent) => {
diff --git a/src/vs/workbench/contrib/debug/browser/replFilter.ts b/src/vs/workbench/contrib/debug/browser/replFilter.ts
@@ -5,7 +5,6 @@
 
 import { matchesFuzzy } from 'vs/base/common/filters';
 import { splitGlobAware } from 'vs/base/common/glob';
-import * as strings from 'vs/base/common/strings';
 import { ITreeFilter, TreeVisibility, TreeFilterResult } from 'vs/base/browser/ui/tree/tree';
 import { IReplElement } from 'vs/workbench/contrib/debug/common/debug';
 import * as DOM from 'vs/base/browser/dom';
@@ -42,7 +41,7 @@ export class ReplFilter implements ITreeFilter<IReplElement> {
 		if (query && query !== '') {
 			const filters = splitGlobAware(query, ',').map(s => s.trim()).filter(s => !!s.length);
 			for (const f of filters) {
-				if (strings.startsWith(f, '!')) {
+				if (f.startsWith('!')) {
 					this._parsedQueries.push({ type: 'exclude', query: f.slice(1) });
 				} else {
 					this._parsedQueries.push({ type: 'include', query: f });
diff --git a/src/vs/workbench/contrib/debug/common/debugger.ts b/src/vs/workbench/contrib/debug/common/debugger.ts
@@ -4,7 +4,6 @@
  *--------------------------------------------------------------------------------------------*/
 
 import * as nls from 'vs/nls';
-import * as strings from 'vs/base/common/strings';
 import * as objects from 'vs/base/common/objects';
 import { isObject } from 'vs/base/common/types';
 import { IJSONSchema, IJSONSchemaSnippet } from 'vs/base/common/jsonSchema';
@@ -171,7 +170,7 @@ export class Debugger implements IDebugger {
 		// fix formatting
 		const editorConfig = this.configurationService.getValue<any>();
 		if (editorConfig.editor && editorConfig.editor.insertSpaces) {
-			content = content.replace(new RegExp('\t', 'g'), strings.repeat(' ', editorConfig.editor.tabSize));
+			content = content.replace(new RegExp('\t', 'g'), ' '.repeat(editorConfig.editor.tabSize));
 		}
 
 		return Promise.resolve(content);
diff --git a/src/vs/workbench/contrib/debug/common/replModel.ts b/src/vs/workbench/contrib/debug/common/replModel.ts
@@ -10,7 +10,6 @@ import { ExpressionContainer } from 'vs/workbench/contrib/debug/common/debugMode
 import { isString, isUndefinedOrNull, isObject } from 'vs/base/common/types';
 import { basenameOrAuthority } from 'vs/base/common/resources';
 import { URI } from 'vs/base/common/uri';
-import { endsWith } from 'vs/base/common/strings';
 import { generateUuid } from 'vs/base/common/uuid';
 import { Emitter } from 'vs/base/common/event';
 
@@ -203,7 +202,7 @@ export class ReplModel {
 
 		if (typeof data === 'string') {
 			const previousElement = this.replElements.length ? this.replElements[this.replElements.length - 1] : undefined;
-			if (previousElement instanceof SimpleReplElement && previousElement.severity === sev && !endsWith(previousElement.value, '\n') && !endsWith(previousElement.value, '\r\n')) {
+			if (previousElement instanceof SimpleReplElement && previousElement.severity === sev && !previousElement.value.endsWith('\n') && !previousElement.value.endsWith('\r\n')) {
 				previousElement.value += data;
 				this._onDidChangeElements.fire();
 			} else {
diff --git a/src/vs/workbench/contrib/files/common/explorerModel.ts b/src/vs/workbench/contrib/files/common/explorerModel.ts
@@ -8,7 +8,7 @@ import { isEqual } from 'vs/base/common/extpath';
 import { posix } from 'vs/base/common/path';
 import { ResourceMap } from 'vs/base/common/map';
 import { IFileStat, IFileService, FileSystemProviderCapabilities } from 'vs/platform/files/common/files';
-import { rtrim, startsWithIgnoreCase, startsWith, equalsIgnoreCase } from 'vs/base/common/strings';
+import { rtrim, startsWithIgnoreCase, equalsIgnoreCase } from 'vs/base/common/strings';
 import { coalesce } from 'vs/base/common/arrays';
 import { IWorkspaceContextService } from 'vs/platform/workspace/common/workspace';
 import { IDisposable, dispose } from 'vs/base/common/lifecycle';
@@ -363,7 +363,7 @@ export class ExplorerItem {
 		// For performance reasons try to do the comparison as fast as possible
 		const ignoreCase = !this.fileService.hasCapability(resource, FileSystemProviderCapabilities.PathCaseSensitive);
 		if (resource && this.resource.scheme === resource.scheme && equalsIgnoreCase(this.resource.authority, resource.authority) &&
-			(ignoreCase ? startsWithIgnoreCase(resource.path, this.resource.path) : startsWith(resource.path, this.resource.path))) {
+			(ignoreCase ? startsWithIgnoreCase(resource.path, this.resource.path) : resource.path.startsWith(this.resource.path))) {
 			return this.findByPath(rtrim(resource.path, posix.sep), this.resource.path.length, ignoreCase);
 		}
 
diff --git a/src/vs/workbench/contrib/remote/browser/explorerViewItems.ts b/src/vs/workbench/contrib/remote/browser/explorerViewItems.ts
@@ -11,7 +11,6 @@ import { IContextViewService } from 'vs/platform/contextview/browser/contextView
 import { IRemoteExplorerService, REMOTE_EXPLORER_TYPE_KEY } from 'vs/workbench/services/remote/common/remoteExplorerService';
 import { ISelectOptionItem } from 'vs/base/browser/ui/selectBox/selectBox';
 import { IViewDescriptor } from 'vs/workbench/common/views';
-import { startsWith } from 'vs/base/common/strings';
 import { isStringArray } from 'vs/base/common/types';
 import { IWorkbenchEnvironmentService } from 'vs/workbench/services/environment/common/environmentService';
 import { IStorageService, StorageScope } from 'vs/platform/storage/common/storage';
@@ -82,7 +81,7 @@ export class SwitchRemoteViewItem extends SelectActionViewItem {
 	static createOptionItems(views: IViewDescriptor[], contextKeyService: IContextKeyService): IRemoteSelectItem[] {
 		let options: IRemoteSelectItem[] = [];
 		views.forEach(view => {
-			if (view.group && startsWith(view.group, 'targets') && view.remoteAuthority && (!view.when || contextKeyService.contextMatchesRules(view.when))) {
+			if (view.group && view.group.startsWith('targets') && view.remoteAuthority && (!view.when || contextKeyService.contextMatchesRules(view.when))) {
 				options.push({ text: view.name, authority: isStringArray(view.remoteAuthority) ? view.remoteAuthority : [view.remoteAuthority] });
 			}
 		});

Original file line number	Diff line number	Diff line change
`@@ -143,7 +143,7 @@ export class SelectBoxNative extends Disposable implements ISelectBoxDelegate {`
`143`	`143`	`}`
`144`	`144`
`145`	`145`	`public render(container: HTMLElement): void {`
`146`		`- dom.addClass(container, 'select-container');`
	`146`	`+ container.classList.add('select-container');`
`147`	`147`	`container.appendChild(this.selectElement);`
`148`	`148`	`this.setOptions(this.options, this.selected);`
`149`	`149`	`this.applyStyles();`
Original file line number	Diff line number	Diff line change
`@@ -627,7 +627,7 @@ class InlineBreakpointWidget implements IContentWidget, IDisposable {`
`627`	`627`	`return null;`
`628`	`628`	`}`
`629`	`629`	`// Workaround: since the content widget can not be placed before the first column we need to force the left position`
`630`		`- dom.toggleClass(this.domNode, 'line-start', this.range.startColumn === 1);`
	`630`	`+ this.domNode.classList.toggle('line-start', this.range.startColumn === 1);`
`631`	`631`
`632`	`632`	`return {`
`633`	`633`	`position: { lineNumber: this.range.startLineNumber, column: this.range.startColumn - 1 },`