Fix unmuting audio in video embeds: add media-src CSP and clear muted attribute

Copilot · alexr00 · Copilot · commit c5c4b9ccf7c5 · 2026-03-02T11:07:11.000Z
Co-authored-by: alexr00 &lt;38270282+alexr00@users.noreply.github.com&gt;
diff --git a/src/github/activityBarViewProvider.ts b/src/github/activityBarViewProvider.ts
@@ -462,7 +462,7 @@ export class PullRequestViewProvider extends WebviewViewBase implements vscode.W
 <html lang="en">
 	<head>
 		<meta charset="UTF-8">
-		<meta http-equiv="Content-Security-Policy" content="default-src 'none'; img-src vscode-resource: https:; script-src 'nonce-${nonce}'; style-src vscode-resource: 'unsafe-inline' http: https: data:;">
+		<meta http-equiv="Content-Security-Policy" content="default-src 'none'; img-src vscode-resource: https:; media-src https:; script-src 'nonce-${nonce}'; style-src vscode-resource: 'unsafe-inline' http: https: data:;">
 		<meta name="viewport" content="width=device-width, initial-scale=1.0">
 
 		<title>Active Pull Request</title>
diff --git a/src/github/createPRViewProvider.ts b/src/github/createPRViewProvider.ts
@@ -590,7 +590,7 @@ export abstract class BaseCreatePullRequestViewProvider<T extends BasePullReques
 <html lang="en">
 	<head>
 		<meta charset="UTF-8">
-		<meta http-equiv="Content-Security-Policy" content="default-src 'none'; img-src vscode-resource: https:; script-src 'nonce-${nonce}'; style-src vscode-resource: 'unsafe-inline' http: https: data:;">
+		<meta http-equiv="Content-Security-Policy" content="default-src 'none'; img-src vscode-resource: https:; media-src https:; script-src 'nonce-${nonce}'; style-src vscode-resource: 'unsafe-inline' http: https: data:;">
 		<meta name="viewport" content="width=device-width, initial-scale=1.0">
 
 		<title>Create Pull Request</title>
diff --git a/webviews/components/comment.tsx b/webviews/components/comment.tsx
@@ -337,7 +337,31 @@ export interface Embodied {
 	specialDisplayBodyPostfix?: string;
 }
 
+/**
+ * Clears the `muted` state on any `<video>` elements within the given
+ * container so that users can hear audio in embedded videos. GitHub sets
+ * `muted` by default on rendered video elements, which causes the audio
+ * controls to be greyed-out inside VS Code webviews.
+ */
+function enableVideoAudio(container: HTMLDivElement | null): void {
+	if (!container) {
+		return;
+	}
+	for (const el of Array.from(container.getElementsByTagName('video'))) {
+		if (el.hasAttribute('muted')) {
+			el.removeAttribute('muted');
+			el.muted = false;
+		}
+	}
+}
+
 export const CommentBody = ({ comment, bodyHTML, body, canApplyPatch, allowEmpty, specialDisplayBodyPostfix }: Embodied) => {
+	const bodyContainerRef = useRef<HTMLDivElement>(null);
+
+	useEffect(() => {
+		enableVideoAudio(bodyContainerRef.current);
+	}, [bodyHTML]);
+
 	if (!body && !bodyHTML) {
 		if (allowEmpty) {
 			return null;
@@ -350,7 +374,7 @@ export const CommentBody = ({ comment, bodyHTML, body, canApplyPatch, allowEmpty
 	}
 
 	const { applyPatch } = useContext(PullRequestContext);
-	const renderedBody = <div dangerouslySetInnerHTML={{ __html: bodyHTML ?? '' }} />;
+	const renderedBody = <div ref={bodyContainerRef} dangerouslySetInnerHTML={{ __html: bodyHTML ?? '' }} />;
 
 	const containsSuggestion = ((body || bodyHTML)?.indexOf('```diff') ?? -1) > -1;
 	const applyPatchButton =
