Merge pull request microsoft#257769 from mjbvz/legislative-mouse

Don't let chat output renderers block mouse wheel

Author: mjbvz

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

@@ -29,7 +29,7 @@ import { isNumber } from '../../../common/types.js';
 import './list.css';
 import { IIdentityProvider, IKeyboardNavigationDelegate, IKeyboardNavigationLabelProvider, IListContextMenuEvent, IListDragAndDrop, IListDragOverReaction, IListEvent, IListGestureEvent, IListMouseEvent, IListElementRenderDetails, IListRenderer, IListTouchEvent, IListVirtualDelegate, ListError } from './list.js';
 import { IListView, IListViewAccessibilityProvider, IListViewDragAndDrop, IListViewOptions, IListViewOptionsUpdate, ListViewTargetSector, ListView } from './listView.js';
-import { StandardMouseEvent } from '../../mouseEvent.js';
+import { IMouseWheelEvent, StandardMouseEvent } from '../../mouseEvent.js';
 import { autorun, constObservable, IObservable } from '../../../common/observable.js';
 
 interface ITraitChangeEvent {
@@ -1971,6 +1971,10 @@ export class List<T> implements ISpliceable<T>, IDisposable {
 		this.styleController.style(styles);
 	}
 
+	delegateScrollFromMouseWheelEvent(browserEvent: IMouseWheelEvent) {
+		this.view.delegateScrollFromMouseWheelEvent(browserEvent);
+	}
+
 	private toListEvent({ indexes, browserEvent }: ITraitChangeEvent) {
 		return { indexes, elements: indexes.map(i => this.view.element(i)), browserEvent };
 	}

src/vs/base/browser/ui/tree/abstractTree.ts

@@ -37,6 +37,7 @@ import { IHoverDelegate } from '../hover/hoverDelegate.js';
 import { createInstantHoverDelegate } from '../hover/hoverDelegateFactory.js';
 import { autorun, constObservable } from '../../../common/observable.js';
 import { alert } from '../aria/aria.js';
+import { IMouseWheelEvent } from '../../mouseEvent.js';
 
 class TreeElementsDragAndDropData<T, TFilterData, TContext> extends ElementsDragAndDropData<T, TContext> {
 
@@ -3224,6 +3225,10 @@ export abstract class AbstractTree<T, TFilterData, TRef> implements IDisposable
 		return new TreeNavigator(this.view, this.model, start);
 	}
 
+	delegateScrollFromMouseWheelEvent(browserEvent: IMouseWheelEvent): void {
+		this.view.delegateScrollFromMouseWheelEvent(browserEvent);
+	}
+
 	dispose(): void {
 		dispose(this.disposables);
 		this.stickyScrollController?.dispose();

src/vs/workbench/contrib/chat/browser/chat.ts

@@ -3,6 +3,7 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
+import { IMouseWheelEvent } from '../../../../base/browser/mouseEvent.js';
 import { Event } from '../../../../base/common/event.js';
 import { IDisposable } from '../../../../base/common/lifecycle.js';
 import { URI } from '../../../../base/common/uri.js';
@@ -224,6 +225,8 @@ export interface IChatWidget {
 	getViewState(): IChatViewState;
 	togglePaused(): void;
 	lockToCodingAgent(name: string): void;
+
+	delegateScrollFromMouseWheelEvent(event: IMouseWheelEvent): void;
 }
 
 

src/vs/workbench/contrib/chat/browser/chatContentParts/chatContentParts.ts

@@ -31,10 +31,10 @@ export interface IChatContentPart extends IDisposable {
 }
 
 export interface IChatContentPartRenderContext {
-	element: ChatTreeItem;
-	elementIndex: number;
-	container: HTMLElement;
-	content: ReadonlyArray<IChatRendererContent>;
-	contentIndex: number;
-	preceedingContentParts: ReadonlyArray<IChatContentPart>;
+	readonly element: ChatTreeItem;
+	readonly elementIndex: number;
+	readonly container: HTMLElement;
+	readonly content: ReadonlyArray<IChatRendererContent>;
+	readonly contentIndex: number;
+	readonly preceedingContentParts: ReadonlyArray<IChatContentPart>;
 }

src/vs/workbench/contrib/chat/browser/chatContentParts/toolInvocationParts/chatToolOutputPart.ts

@@ -12,7 +12,7 @@ import { localize } from '../../../../../../nls.js';
 import { IInstantiationService } from '../../../../../../platform/instantiation/common/instantiation.js';
 import { IChatToolInvocation, IChatToolInvocationSerialized, IToolResultOutputDetailsSerialized } from '../../../common/chatService.js';
 import { IToolResultOutputDetails } from '../../../common/languageModelToolsService.js';
-import { IChatCodeBlockInfo } from '../../chat.js';
+import { IChatCodeBlockInfo, IChatWidgetService } from '../../chat.js';
 import { IChatOutputRendererService } from '../../chatOutputItemRenderer.js';
 import { IChatContentPartRenderContext } from '../chatContentParts.js';
 import { ChatCustomProgressPart } from '../chatProgressContentPart.js';
@@ -28,8 +28,9 @@ export class ChatToolOutputSubPart extends BaseChatToolInvocationSubPart {
 
 	constructor(
 		toolInvocation: IChatToolInvocation | IChatToolInvocationSerialized,
-		_context: IChatContentPartRenderContext,
+		private readonly context: IChatContentPartRenderContext,
 		@IChatOutputRendererService private readonly chatOutputItemRendererService: IChatOutputRendererService,
+		@IChatWidgetService private readonly chatWidgetService: IChatWidgetService,
 		@IInstantiationService private readonly instantiationService: IInstantiationService,
 	) {
 		super(toolInvocation);
@@ -55,6 +56,7 @@ export class ChatToolOutputSubPart extends BaseChatToolInvocationSubPart {
 	private createOutputPart(details: IToolResultOutputDetails): HTMLElement {
 		const parent = dom.$('div.webview-output');
 		parent.style.maxHeight = '80vh';
+		// TODO: we should cache the height when restoring to avoid extra layout shifts
 
 		const progressMessage = dom.$('span');
 		progressMessage.textContent = localize('loading', 'Rendering tool output...');
@@ -75,6 +77,14 @@ export class ChatToolOutputSubPart extends BaseChatToolInvocationSubPart {
 			this._register(renderedItem.onDidChangeHeight(() => {
 				this._onDidChangeHeight.fire();
 			}));
+
+			this._register(renderedItem.webview.onDidWheel(e => {
+				this.chatWidgetService.getWidgetBySessionId(this.context.element.sessionId)?.delegateScrollFromMouseWheelEvent({
+					...e,
+					preventDefault: () => { },
+					stopPropagation: () => { }
+				});
+			}));
 		}, (error) => {
 			// TODO: show error in UI too
 			console.error('Error rendering tool output:', error);

src/vs/workbench/contrib/chat/browser/chatOutputItemRenderer.ts

@@ -32,6 +32,7 @@ interface RegisterOptions {
 
 export interface RenderedOutputPart extends IDisposable {
 	readonly onDidChangeHeight: Event<number>;
+	readonly webview: IWebview;
 }
 
 export interface IChatOutputRendererService {
@@ -102,6 +103,7 @@ export class ChatOutputRendererService extends Disposable implements IChatOutput
 		await rendererData.renderer.renderOutputPart(mime, data, webview, token);
 
 		return {
+			webview,
 			onDidChangeHeight: onDidChangeHeight.event,
 			dispose: () => {
 				store.dispose();

src/vs/workbench/contrib/chat/browser/chatWidget.ts

@@ -74,6 +74,7 @@ import { CancellationToken } from '../../../../base/common/cancellation.js';
 import { ComputeAutomaticInstructions } from '../common/promptSyntax/computeAutomaticInstructions.js';
 import { startupExpContext, StartupExperimentGroup } from '../../../services/coreExperimentation/common/coreExperimentationService.js';
 import { IWorkspaceContextService, WorkbenchState } from '../../../../platform/workspace/common/workspace.js';
+import { IMouseWheelEvent } from '../../../../base/browser/mouseEvent.js';
 
 const $ = dom.$;
 
@@ -2181,6 +2182,10 @@ export class ChatWidget extends Disposable implements IChatWidget {
 		// Remove any existing agent prefix (e.g., @agent) from the beginning
 		return text.replace(/^@\w+\s*/, '');
 	}
+
+	delegateScrollFromMouseWheelEvent(browserEvent: IMouseWheelEvent): void {
+		this.tree.delegateScrollFromMouseWheelEvent(browserEvent);
+	}
 }
 
 export class ChatWidgetService extends Disposable implements IChatWidgetService {