feat: allow patching screen share with audio devices

Author: ryanccn

src/renderer/components/ScreenSharePicker.tsx

@@ -21,6 +21,7 @@ import {
 } from "@vencord/types/webpack/common";
 import { Node } from "@vencord/venmic";
 import type { Dispatch, SetStateAction } from "react";
+import { patchOverrideAudioDevice } from "renderer/patches/screenShareFixes";
 import { addPatch } from "renderer/patches/shared";
 import { useSettings } from "renderer/settings";
 import { isLinux, isWindows } from "renderer/utils";
@@ -47,6 +48,7 @@ interface StreamSettings {
     resolution: StreamResolution;
     fps: StreamFps;
     audio: boolean;
+    overrideAudioDevice?: string;
     contentHint?: string;
     includeSources?: AudioSources;
     excludeSources?: AudioSources;
@@ -140,6 +142,8 @@ export function openScreenSharePicker(screens: Source[], skipPicker: boolean) {
                             }
                         }
 
+                        patchOverrideAudioDevice(v.overrideAudioDevice);
+
                         resolve(v);
                     }}
                     close={() => {
@@ -325,6 +329,11 @@ function StreamSettings({
         }
     );
 
+    const [audioDevices, , audioDevicesPending] = useAwaiter(
+        () => navigator.mediaDevices.enumerateDevices().then(g => g.filter(d => d.kind === "audioinput")),
+        { fallbackValue: [] }
+    );
+
     const openSettings = () => {
         const key = openModal(props => (
             <AudioSettingsModal
@@ -428,6 +437,27 @@ function StreamSettings({
                                 </p>
                             </div>
                         </div>
+
+                        <div>
+                            <Forms.FormTitle>
+                                {audioDevicesPending ? "Loading audio devices..." : "Audio devices"}
+                            </Forms.FormTitle>
+                            <Select
+                                options={audioDevices.map(({ label, deviceId }) => ({
+                                    label,
+                                    value: deviceId
+                                }))}
+                                isSelected={d => settings.overrideAudioDevice === d}
+                                select={d => {
+                                    setSettings(v => ({ ...v, overrideAudioDevice: d }));
+                                }}
+                                serialize={String}
+                                popoutPosition="top"
+                                closeOnSelect={true}
+                                isDisabled={audioDevicesPending}
+                            />
+                        </div>
+
                         {isWindows && (
                             <Switch
                                 value={settings.audio}

src/renderer/patches/screenShareFixes.ts

@@ -10,21 +10,42 @@ import { isLinux } from "renderer/utils";
 
 const logger = new Logger("VesktopStreamFixes");
 
-if (isLinux) {
-    const original = navigator.mediaDevices.getDisplayMedia;
-
-    async function getVirtmic() {
-        try {
-            const devices = await navigator.mediaDevices.enumerateDevices();
-            const audioDevice = devices.find(({ label }) => label === "vencord-screen-share");
-            return audioDevice?.deviceId;
-        } catch (error) {
-            return null;
-        }
+const original = navigator.mediaDevices.getDisplayMedia;
+
+let overrideAudioDevice: string | undefined = undefined;
+
+export const patchOverrideAudioDevice = (deviceId?: string) => {
+    overrideAudioDevice = deviceId;
+};
+
+async function getVirtmic() {
+    try {
+        const devices = await navigator.mediaDevices.enumerateDevices();
+        const audioDevice = devices.find(({ label }) => label === "vencord-screen-share");
+        return audioDevice?.deviceId;
+    } catch (error) {
+        return null;
     }
+}
+
+navigator.mediaDevices.getDisplayMedia = async function (opts) {
+    const stream = await original.call(this, opts);
 
-    navigator.mediaDevices.getDisplayMedia = async function (opts) {
-        const stream = await original.call(this, opts);
+    if (overrideAudioDevice) {
+        const audio = await navigator.mediaDevices.getUserMedia({
+            audio: {
+                deviceId: { exact: overrideAudioDevice },
+                autoGainControl: false,
+                echoCancellation: false,
+                noiseSuppression: false
+            }
+        });
+
+        stream.getAudioTracks().forEach(t => stream.removeTrack(t));
+        audio.getAudioTracks().forEach(t => stream.addTrack(t));
+    }
+
+    if (isLinux) {
         const id = await getVirtmic();
 
         const frameRate = Number(currentSettings?.fps);
@@ -63,7 +84,7 @@ if (isLinux) {
             });
             audio.getAudioTracks().forEach(t => stream.addTrack(t));
         }
+    }
 
-        return stream;
-    };
-}
+    return stream;
+};