Allow markdown code blocks to contain data after language id (microso…

…ft#157947)

Fixes microsoft#157793

This regexp matches https://github.com/microsoft/vscode-markdown-tm-grammar/blob/cc60d66521cb450b4b0b7c0be695c9e2f949e273/build.js#L88

src/vs/base/browser/markdownRenderer.ts

@@ -143,7 +143,7 @@ export function renderMarkdown(markdown: IMarkdownString, options: MarkdownRende
 	if (options.codeBlockRenderer) {
 		renderer.code = (code, lang) => {
 			const id = defaultGenerator.nextId();
-			const value = options.codeBlockRenderer!(lang ?? '', code);
+			const value = options.codeBlockRenderer!(postProcessCodeBlockLanguageId(lang), code);
 			codeBlocks.push(value.then(element => [id, element]));
 			return `<div class="code" data-code="${id}">${escape(code)}</div>`;
 		};
@@ -294,6 +294,18 @@ export function renderMarkdown(markdown: IMarkdownString, options: MarkdownRende
 	};
 }
 
+function postProcessCodeBlockLanguageId(lang: string | undefined): string {
+	if (!lang) {
+		return '';
+	}
+
+	const parts = lang.split(/[\s+|:|,|\{|\?]/, 1);
+	if (parts.length) {
+		return parts[0];
+	}
+	return lang;
+}
+
 function resolveWithBaseUri(baseUri: URI, href: string): string {
 	const hasScheme = /^\w[\w\d+.-]*:/.test(href);
 	if (hasScheme) {

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

@@ -68,7 +68,7 @@ suite('MarkdownRenderer', () => {
 	});
 
 	suite('Code block renderer', () => {
-		const simpleCodeBlockRenderer = (code: string): Promise<HTMLElement> => {
+		const simpleCodeBlockRenderer = (lang: string, code: string): Promise<HTMLElement> => {
 			const element = document.createElement('code');
 			element.textContent = code;
 			return Promise.resolve(element);
@@ -115,6 +115,19 @@ suite('MarkdownRenderer', () => {
 				}, 50);
 			});
 		});
+
+		test('Code blocks should use leading language id (#157793)', async () => {
+			const markdown = { value: '```js some other stuff\n1 + 1;\n```' };
+			const lang = await new Promise<string>(resolve => {
+				renderMarkdown(markdown, {
+					codeBlockRenderer: async (lang, value) => {
+						resolve(lang);
+						return simpleCodeBlockRenderer(lang, value);
+					}
+				});
+			});
+			assert.strictEqual(lang, 'js');
+		});
 	});
 
 	suite('ThemeIcons Support On', () => {