Merge pull request microsoft#256159 from mjbvz/eastern-lobster

mjbvz · web-flow · commit f86dac57da43 · 2025-07-15T19:13:02.000-07:00
Restore chat content markdown dom structure
diff --git a/src/vs/base/browser/markdownRenderer.ts b/src/vs/base/browser/markdownRenderer.ts
@@ -101,11 +101,11 @@ const defaultMarkedRenderers = Object.freeze({
  * **Note** that for most cases you should be using {@link import('../../editor/browser/widget/markdownRenderer/browser/markdownRenderer.js').MarkdownRenderer MarkdownRenderer}
  * which comes with support for pretty code block rendering and which uses the default way of handling links.
  */
-export function renderMarkdown(markdown: IMarkdownString, options: MarkdownRenderOptions = {}, markedOptions: MarkedOptions = {}): { element: HTMLElement; dispose: () => void } {
+export function renderMarkdown(markdown: IMarkdownString, options: MarkdownRenderOptions = {}, markedOptions: MarkedOptions = {}, outElement?: HTMLElement): { element: HTMLElement; dispose: () => void } {
 	const disposables = new DisposableStore();
 	let isDisposed = false;
 
-	const element = createElement(options);
+	const element = outElement ?? createElement(options);
 
 	const markedInstance = new marked.Marked(...(markedOptions.markedExtensions ?? []));
 	const { renderer, codeBlocks, syncCodeBlocks } = createMarkdownRenderer(markedInstance, options, markedOptions, markdown);
diff --git a/src/vs/editor/browser/widget/markdownRenderer/browser/markdownRenderer.ts b/src/vs/editor/browser/widget/markdownRenderer/browser/markdownRenderer.ts
@@ -45,14 +45,14 @@ export class MarkdownRenderer {
 		@IOpenerService private readonly _openerService: IOpenerService,
 	) { }
 
-	render(markdown: IMarkdownString | undefined, options?: MarkdownRenderOptions, markedOptions?: MarkedOptions): IMarkdownRenderResult {
+	render(markdown: IMarkdownString | undefined, options?: MarkdownRenderOptions, markedOptions?: MarkedOptions, outElement?: HTMLElement): IMarkdownRenderResult {
 		if (!markdown) {
-			const element = document.createElement('span');
+			const element = outElement ?? document.createElement('span');
 			return { element, dispose: () => { } };
 		}
 
 		const disposables = new DisposableStore();
-		const rendered = disposables.add(renderMarkdown(markdown, { ...this._getRenderOptions(markdown, disposables), ...options }, markedOptions));
+		const rendered = disposables.add(renderMarkdown(markdown, { ...this._getRenderOptions(markdown, disposables), ...options }, markedOptions, outElement));
 		rendered.element.classList.add('rendered-markdown');
 		return {
 			element: rendered.element,
diff --git a/src/vs/workbench/contrib/chat/browser/chatContentParts/chatMarkdownContentPart.ts b/src/vs/workbench/contrib/chat/browser/chatContentParts/chatMarkdownContentPart.ts
@@ -234,14 +234,12 @@ export class ChatMarkdownContentPart extends Disposable implements IChatContentP
 					}
 				},
 				asyncRenderCallback: () => this._onDidChangeHeight.fire(),
-			}, markedOpts));
+			}, markedOpts, this.domNode));
 
 			const markdownDecorationsRenderer = instantiationService.createInstance(ChatMarkdownDecorationsRenderer);
 			this._register(markdownDecorationsRenderer.walkTreeAndAnnotateReferenceLinks(markdown, result.element));
 
 			orderedDisposablesList.reverse().forEach(d => this._register(d));
-
-			this.domNode.replaceChildren(result.element);
 		};
 
 		if (enableMath && !MarkedKatexSupport.getExtension(dom.getWindow(context.container))) {
diff --git a/src/vs/workbench/contrib/chat/browser/chatMarkdownRenderer.ts b/src/vs/workbench/contrib/chat/browser/chatMarkdownRenderer.ts
@@ -70,7 +70,7 @@ export class ChatMarkdownRenderer extends MarkdownRenderer {
 		super(options ?? {}, languageService, openerService);
 	}
 
-	override render(markdown: IMarkdownString | undefined, options?: MarkdownRenderOptions, markedOptions?: MarkedOptions): IMarkdownRenderResult {
+	override render(markdown: IMarkdownString | undefined, options?: MarkdownRenderOptions, markedOptions?: MarkedOptions, outElement?: HTMLElement): IMarkdownRenderResult {
 		options = {
 			...options,
 			remoteImageIsAllowed: (_uri) => false,
@@ -91,7 +91,7 @@ export class ChatMarkdownRenderer extends MarkdownRenderer {
 				value: `<body>\n\n${markdown.value}</body>`,
 			}
 			: markdown;
-		const result = super.render(mdWithBody, options, markedOptions);
+		const result = super.render(mdWithBody, options, markedOptions, outElement);
 
 		// In some cases, the renderer can return text that is not inside a <p>,
 		// but our CSS expects text to be in a <p> for margin to be applied properly.
