CODEWITHSUNDEEP
angulartypescriptelectronwebrtc
ivan0590
ivan0590

Reputation: 1368

How to programmatically change the audio output device in Angular inside Electron?

I'm developing a desktop app with Angular 11 and Electron 12. The app must be able to emit sounds and the user must have the ability to change the audio output device used by the app.

So, I tried to use the setSinkId WebRTC experimental feature. Electron uses Chromium, which supports this feature. So, in Electron webPreferences I enabled experimentalFeatures.

Now, the problem it's that Typescript (v4.2.3) it's not recognizing the setSinkId feature.

I tried to do this inside an Angular component:

audio initialization

But as you can see, I get this error message:

setSinkId error

I know, probably Typescript doesn't support this feature yet. But then, how can I change the audio output device in Angular inside Electron?

Upvotes: 2

Views: 2480

Answers (1)

chrisguttandin
chrisguttandin

Reputation: 9116

Especially when developing an app for Electron TypeScript's default types aren't very helpful here. setSinkId() is supported in Chromium and therefore also available in Electron.

You could help TypeScript a litte by explicitly adding the type definition for setSinkId().

const audio = <HTMLAudioElement & { setSinkId (deviceId: string): void }> new Audio();

audio.setSinkId('the-id-of-the-device');

Upvotes: 4

Related Questions