Merge from vscode 27ada910e121e23a6d95ecca9cae595fb98ab568

src/vs/base/browser/markdownRenderer.ts

@@ -209,7 +209,10 @@ export function renderMarkdown(markdown: IMarkdownString, options: MarkdownRende
 			'iframe': ['allowfullscreen', 'frameborder', 'src'],
 			'img': ['src', 'title', 'alt', 'width', 'height'],
 			'div': ['class', 'data-code'],
-			'span': ['class']
+			'span': ['class'],
+			// https://github.com/microsoft/vscode/issues/95937
+			'th': ['align'],
+			'td': ['align']
 		}
 	});
 

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

@@ -7,6 +7,8 @@ import 'vs/css!./aria';
 import { isMacintosh } from 'vs/base/common/platform';
 import * as dom from 'vs/base/browser/dom';
 
+// Use a max length since we are inserting the whole msg in the DOM and that can cause browsers to freeze for long messages #94233
+const MAX_MESSAGE_LENGTH = 20000;
 let ariaContainer: HTMLElement;
 let alertContainer: HTMLElement;
 let statusContainer: HTMLElement;
@@ -54,6 +56,9 @@ function insertMessage(target: HTMLElement, msg: string): void {
 	}
 
 	dom.clearNode(target);
+	if (msg.length > MAX_MESSAGE_LENGTH) {
+		msg = msg.substr(0, MAX_MESSAGE_LENGTH);
+	}
 	target.textContent = msg;
 
 	// See https://www.paciellogroup.com/blog/2012/06/html5-accessibility-chops-aria-rolealert-browser-support/

src/vs/base/browser/ui/button/button.css

@@ -5,12 +5,14 @@
 
 .monaco-text-button {
 	box-sizing: border-box;
-	display: inline-block;
+	display: flex;
 	width: 100%;
 	padding: 4px;
 	text-align: center;
 	cursor: pointer;
 	outline-offset: 2px !important;
+	justify-content: center;
+	align-items: center;
 }
 
 .monaco-text-button:hover {
@@ -21,3 +23,8 @@
 	opacity: 0.4;
 	cursor: default;
 }
+
+.monaco-button > .codicon {
+	margin: 0 0.2em;
+	color: inherit !important;
+}

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

@@ -12,9 +12,12 @@ import { mixin } from 'vs/base/common/objects';
 import { Event as BaseEvent, Emitter } from 'vs/base/common/event';
 import { Disposable } from 'vs/base/common/lifecycle';
 import { Gesture, EventType } from 'vs/base/browser/touch';
+import { renderCodicons } from 'vs/base/common/codicons';
+import { escape } from 'vs/base/common/strings';
 
 export interface IButtonOptions extends IButtonStyles {
-	title?: boolean | string;
+	readonly title?: boolean | string;
+	readonly supportCodicons?: boolean;
 }
 
 export interface IButtonStyles {
@@ -150,7 +153,11 @@ export class Button extends Disposable {
 		if (!DOM.hasClass(this._element, 'monaco-text-button')) {
 			DOM.addClass(this._element, 'monaco-text-button');
 		}
-		this._element.textContent = value;
+		if (this.options.supportCodicons) {
+			this._element.innerHTML = renderCodicons(escape(value));
+		} else {
+			this._element.textContent = value;
+		}
 		this._element.setAttribute('aria-label', value); // {{SQL CARBON EDIT}}
 		if (typeof this.options.title === 'string') {
 			this._element.title = this.options.title;

src/vs/base/browser/ui/codicons/codicon/codicon-animations.css

@@ -10,5 +10,6 @@
 }
 
 .codicon-animation-spin {
-	animation: codicon-spin 1.5s linear infinite;
+	/* Use steps to throttle FPS to reduce CPU usage */
+	animation: codicon-spin 1.5s steps(30) infinite;
 }

src/vs/base/browser/ui/list/listView.ts

@@ -59,6 +59,7 @@ export interface IListViewOptions<T> {
 	readonly horizontalScrolling?: boolean;
 	readonly accessibilityProvider?: IListViewAccessibilityProvider<T>;
 	readonly additionalScrollHeight?: number;
+	readonly transformOptimization?: boolean;
 }
 
 const DefaultOptions = {
@@ -74,7 +75,8 @@ const DefaultOptions = {
 		onDragOver() { return false; },
 		drop() { }
 	},
-	horizontalScrolling: false
+	horizontalScrolling: false,
+	transformOptimization: true
 };
 
 export class ElementsDragAndDropData<T, TContext = void> implements IDragAndDropData {
@@ -275,7 +277,11 @@ export class ListView<T> implements ISpliceable<T>, IDisposable {
 
 		this.rowsContainer = document.createElement('div');
 		this.rowsContainer.className = 'monaco-list-rows';
-		this.rowsContainer.style.transform = 'translate3d(0px, 0px, 0px)';
+
+		if (options.transformOptimization) {
+			this.rowsContainer.style.transform = 'translate3d(0px, 0px, 0px)';
+		}
+
 		this.disposables.add(Gesture.addTarget(this.rowsContainer));
 
 		this.scrollableElement = this.disposables.add(new ScrollableElement(this.rowsContainer, {

src/vs/base/browser/ui/list/listWidget.ts

@@ -838,6 +838,7 @@ export interface IListOptions<T> {
 	readonly mouseSupport?: boolean;
 	readonly horizontalScrolling?: boolean;
 	readonly additionalScrollHeight?: number;
+	readonly transformOptimization?: boolean;
 }
 
 export interface IListStyles {

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

@@ -84,7 +84,7 @@ export class Menu extends ActionBar {
 			context: options.context,
 			actionRunner: options.actionRunner,
 			ariaLabel: options.ariaLabel,
-			triggerKeys: { keys: [KeyCode.Enter, ...(isMacintosh ? [KeyCode.Space] : [])], keyDown: true }
+			triggerKeys: { keys: [KeyCode.Enter, ...(isMacintosh || isLinux ? [KeyCode.Space] : [])], keyDown: true }
 		});
 
 		this.menuElement = menuElement;

src/vs/base/browser/ui/splitview/paneview.ts

@@ -184,13 +184,18 @@ export abstract class Pane extends Disposable implements IView {
 		}
 
 		this._orientation = orientation;
+
+		if (this.header) {
+			this.updateHeader();
+		}
 	}
 
 	render(): void {
 		this.header = $('.pane-header');
 		append(this.element, this.header);
 		this.header.setAttribute('tabindex', '0');
-		this.header.setAttribute('role', 'toolbar');
+		// Use role button so the aria-expanded state gets read https://github.com/microsoft/vscode/issues/95996
+		this.header.setAttribute('role', 'button');
 		this.header.setAttribute('aria-label', this.ariaHeaderLabel);
 		this.renderHeader(this.header);
 

src/vs/base/browser/ui/tree/media/tree.css

@@ -61,5 +61,6 @@
 }
 
 .monaco-tl-twistie.codicon-tree-item-loading::before {
-	animation: codicon-spin 1.25s linear infinite;
+	/* Use steps to throttle FPS to reduce CPU usage */
+	animation: codicon-spin 1.25s steps(30) infinite;
 }