Fix #59286

src/vs/base/browser/ui/highlightedlabel/highlightedLabel.ts

@@ -21,7 +21,7 @@ export class HighlightedLabel implements IDisposable {
 	private highlights: IHighlight[];
 	private didEverRender: boolean;
 
-	constructor(container: HTMLElement) {
+	constructor(container: HTMLElement, private supportOcticons: boolean) {
 		this.domNode = document.createElement('span');
 		this.domNode.className = 'monaco-highlighted-label';
 		this.didEverRender = false;
@@ -68,19 +68,22 @@ export class HighlightedLabel implements IDisposable {
 			}
 			if (pos < highlight.start) {
 				htmlContent.push('<span>');
-				htmlContent.push(renderOcticons(this.text.substring(pos, highlight.start)));
+				const substring = this.text.substring(pos, highlight.start);
+				htmlContent.push(this.supportOcticons ? renderOcticons(substring) : substring);
 				htmlContent.push('</span>');
 				pos = highlight.end;
 			}
 			htmlContent.push('<span class="highlight">');
-			htmlContent.push(renderOcticons(this.text.substring(highlight.start, highlight.end)));
+			const substring = this.text.substring(highlight.start, highlight.end);
+			htmlContent.push(this.supportOcticons ? renderOcticons(substring) : substring);
 			htmlContent.push('</span>');
 			pos = highlight.end;
 		}
 
 		if (pos < this.text.length) {
 			htmlContent.push('<span>');
-			htmlContent.push(renderOcticons(this.text.substring(pos)));
+			const substring = this.text.substring(pos);
+			htmlContent.push(this.supportOcticons ? renderOcticons(substring) : substring);
 			htmlContent.push('</span>');
 		}
 

src/vs/base/browser/ui/iconLabel/iconLabel.ts

@@ -12,6 +12,7 @@ import { IDisposable, combinedDisposable, Disposable } from 'vs/base/common/life
 export interface IIconLabelCreationOptions {
 	supportHighlights?: boolean;
 	supportDescriptionHighlights?: boolean;
+	donotSupportOcticons?: boolean;
 }
 
 export interface IIconLabelValueOptions {
@@ -99,13 +100,13 @@ export class IconLabel extends Disposable {
 		this.labelDescriptionContainer = this._register(new FastLabelNode(dom.append(this.domNode.element, dom.$('.monaco-icon-label-description-container'))));
 
 		if (options && options.supportHighlights) {
-			this.labelNode = this._register(new HighlightedLabel(dom.append(this.labelDescriptionContainer.element, dom.$('a.label-name'))));
+			this.labelNode = this._register(new HighlightedLabel(dom.append(this.labelDescriptionContainer.element, dom.$('a.label-name')), !options.donotSupportOcticons));
 		} else {
 			this.labelNode = this._register(new FastLabelNode(dom.append(this.labelDescriptionContainer.element, dom.$('a.label-name'))));
 		}
 
 		if (options && options.supportDescriptionHighlights) {
-			this.descriptionNodeFactory = () => this._register(new HighlightedLabel(dom.append(this.labelDescriptionContainer.element, dom.$('span.label-description'))));
+			this.descriptionNodeFactory = () => this._register(new HighlightedLabel(dom.append(this.labelDescriptionContainer.element, dom.$('span.label-description')), !options.donotSupportOcticons));
 		} else {
 			this.descriptionNodeFactory = () => this._register(new FastLabelNode(dom.append(this.labelDescriptionContainer.element, dom.$('span.label-description'))));
 		}

src/vs/base/parts/quickopen/browser/quickOpenModel.ts

@@ -377,7 +377,7 @@ class Renderer implements IRenderer<QuickOpenEntry> {
 		const detailContainer = document.createElement('div');
 		row2.appendChild(detailContainer);
 		DOM.addClass(detailContainer, 'quick-open-entry-meta');
-		const detail = new HighlightedLabel(detailContainer);
+		const detail = new HighlightedLabel(detailContainer, true);
 
 		// Entry Group
 		let group: HTMLDivElement;

src/vs/base/test/browser/highlightedLabel.test.ts

@@ -9,7 +9,7 @@ suite('HighlightedLabel', () => {
 	let label: HighlightedLabel;
 
 	setup(() => {
-		label = new HighlightedLabel(document.createElement('div'));
+		label = new HighlightedLabel(document.createElement('div'), true);
 	});
 
 	teardown(() => {

src/vs/editor/contrib/documentSymbols/outlineTree.ts

@@ -146,13 +146,13 @@ export class OutlineRenderer implements IRenderer {
 			const decoration = dom.$('.outline-element-decoration');
 			dom.addClass(container, 'outline-element');
 			dom.append(container, icon, labelContainer, detail, decoration);
-			return { icon, labelContainer, label: new HighlightedLabel(labelContainer), detail, decoration };
+			return { icon, labelContainer, label: new HighlightedLabel(labelContainer, true), detail, decoration };
 		}
 		if (templateId === 'outline-group') {
 			const labelContainer = dom.$('.outline-element-label');
 			dom.addClass(container, 'outline-element');
 			dom.append(container, labelContainer);
-			return { labelContainer, label: new HighlightedLabel(labelContainer) };
+			return { labelContainer, label: new HighlightedLabel(labelContainer, true) };
 		}
 
 		throw new Error(templateId);

src/vs/workbench/browser/parts/quickinput/quickInputList.ts

@@ -116,7 +116,7 @@ class ListElementRenderer implements IListRenderer<ListElement, IListElementTemp
 
 		// Detail
 		const detailContainer = dom.append(row2, $('.quick-input-list-label-meta'));
-		data.detail = new HighlightedLabel(detailContainer);
+		data.detail = new HighlightedLabel(detailContainer, true);
 
 		// Separator
 		data.separator = dom.append(data.entry, $('.quick-input-list-separator'));

src/vs/workbench/browser/parts/views/customView.ts

@@ -547,7 +547,7 @@ class TreeRenderer implements IRenderer {
 		DOM.addClass(container, 'custom-view-tree-node-item');
 
 		const icon = DOM.append(container, DOM.$('.custom-view-tree-node-item-icon'));
-		const resourceLabel = this.instantiationService.createInstance(ResourceLabel, container, { supportHighlights: true });
+		const resourceLabel = this.instantiationService.createInstance(ResourceLabel, container, { supportHighlights: true, donotSupportOcticons: true });
 		DOM.addClass(resourceLabel.element, 'custom-view-tree-node-item-resourceLabel');
 		const actionsContainer = DOM.append(resourceLabel.element, DOM.$('.actions'));
 		const actionBar = new ActionBar(actionsContainer, {

src/vs/workbench/parts/markers/electron-browser/markersTreeViewer.ts

@@ -221,9 +221,9 @@ export class MarkerRenderer implements ITreeRenderer<Marker, MarkerFilterData, I
 		const actionsContainer = dom.append(container, dom.$('.actions'));
 		data.actionBar = new ActionBar(actionsContainer, { actionItemProvider: this.actionItemProvider });
 		data.icon = dom.append(container, dom.$('.icon'));
-		data.source = new HighlightedLabel(dom.append(container, dom.$('')));
-		data.description = new HighlightedLabel(dom.append(container, dom.$('.marker-description')));
-		data.code = new HighlightedLabel(dom.append(container, dom.$('')));
+		data.source = new HighlightedLabel(dom.append(container, dom.$('')), false);
+		data.description = new HighlightedLabel(dom.append(container, dom.$('.marker-description')), false);
+		data.code = new HighlightedLabel(dom.append(container, dom.$('')), false);
 		data.lnCol = dom.append(container, dom.$('span.marker-line'));
 		return data;
 	}
@@ -291,14 +291,14 @@ export class RelatedInformationRenderer implements ITreeRenderer<RelatedInformat
 		dom.append(container, dom.$('.actions'));
 		dom.append(container, dom.$('.icon'));
 
-		data.resourceLabel = new HighlightedLabel(dom.append(container, dom.$('.related-info-resource')));
+		data.resourceLabel = new HighlightedLabel(dom.append(container, dom.$('.related-info-resource')), false);
 		data.lnCol = dom.append(container, dom.$('span.marker-line'));
 
 		const separator = dom.append(container, dom.$('span.related-info-resource-separator'));
 		separator.textContent = ':';
 		separator.style.paddingRight = '4px';
 
-		data.description = new HighlightedLabel(dom.append(container, dom.$('.marker-description')));
+		data.description = new HighlightedLabel(dom.append(container, dom.$('.marker-description')), false);
 		return data;
 	}
 

src/vs/workbench/parts/preferences/browser/keybindingsEditor.ts

@@ -863,15 +863,15 @@ class CommandColumn extends Column {
 		this.commandColumn.setAttribute('aria-label', this.getAriaLabel(keybindingItemEntry));
 		let commandLabel: HighlightedLabel;
 		if (keybindingItem.commandLabel) {
-			commandLabel = new HighlightedLabel(this.commandColumn);
+			commandLabel = new HighlightedLabel(this.commandColumn, false);
 			commandLabel.set(keybindingItem.commandLabel, keybindingItemEntry.commandLabelMatches);
 		}
 		if (keybindingItemEntry.commandDefaultLabelMatches) {
-			commandLabel = new HighlightedLabel(DOM.append(this.commandColumn, $('.command-default-label')));
+			commandLabel = new HighlightedLabel(DOM.append(this.commandColumn, $('.command-default-label')), false);
 			commandLabel.set(keybindingItem.commandDefaultLabel, keybindingItemEntry.commandDefaultLabelMatches);
 		}
 		if (keybindingItemEntry.commandIdMatches || !keybindingItem.commandLabel) {
-			commandLabel = new HighlightedLabel(DOM.append(this.commandColumn, $('.code')));
+			commandLabel = new HighlightedLabel(DOM.append(this.commandColumn, $('.code')), false);
 			commandLabel.set(keybindingItem.command, keybindingItemEntry.commandIdMatches);
 		}
 		if (commandLabel) {
@@ -918,7 +918,7 @@ class SourceColumn extends Column {
 	render(keybindingItemEntry: IKeybindingItemEntry): void {
 		DOM.clearNode(this.sourceColumn);
 		this.sourceColumn.setAttribute('aria-label', this.getAriaLabel(keybindingItemEntry));
-		new HighlightedLabel(this.sourceColumn).set(keybindingItemEntry.keybindingItem.source, keybindingItemEntry.sourceMatches);
+		new HighlightedLabel(this.sourceColumn, false).set(keybindingItemEntry.keybindingItem.source, keybindingItemEntry.sourceMatches);
 	}
 
 	private getAriaLabel(keybindingItemEntry: IKeybindingItemEntry): string {
@@ -942,7 +942,7 @@ class WhenColumn extends Column {
 		DOM.toggleClass(this.whenColumn, 'code', !!keybindingItemEntry.keybindingItem.when);
 		DOM.toggleClass(this.whenColumn, 'empty', !keybindingItemEntry.keybindingItem.when);
 		if (keybindingItemEntry.keybindingItem.when) {
-			const whenLabel = new HighlightedLabel(this.whenColumn);
+			const whenLabel = new HighlightedLabel(this.whenColumn, false);
 			whenLabel.set(keybindingItemEntry.keybindingItem.when, keybindingItemEntry.whenMatches);
 			this.whenColumn.title = keybindingItemEntry.keybindingItem.when;
 			whenLabel.element.title = keybindingItemEntry.keybindingItem.when;