Wrong microphone is selected after reconnecting external headphones

[krvd]

First of all, a huge thank you to the LiveKit team for the great work. It's clear that LiveKit is getting better and better with each new version.

Describe the bug

I join to the conference with external microphone selected as active. Plug out and plug microphone back. The active device in the user interface and the microphone that is actually active are not the same.

What I am expecting

External Microphone is selected in the interface and transmits audio to the conference

What happened instead

External Microphone is selected in MediaDeviceSelect component, but in fact the sound is transmitted from the laptop built-in microphone

Reproduction

1. Select the external microphone on PreJoin page
2. Connect to the conference
3. Plug out the external microphone. Internal microphone starts working, other participants can hear me. No devices selected in MediaDeviceSelect component
4. Plug in the same external microphone. External microphone appeared in MediaDeviceSelect and selected, but participants still hear me from my internal microphone

Logs

No response

System Info

macOS 14.4.1
Chrome 128.0.6613.85 
Reproduced on https://meet.livekit.io/

Severity

serious, but I can work around it

Additional Information

No response

[krvd]

The problem might be the same as livekit/client-sdk-js#1220

[lukasIO]

Thanks for the report!
I transferred the issue to the components repo as the issue's describing an inconsistency in the MediaDeviceSelect component

The issue is likely related to livekit/client-sdk-js#1220.
Generally when devices change the SDK emits a ActiveDeviceChanged event.
In some cases this seems to not have worked reliably.
livekit/client-sdk-js#1237 aims to fix that.

[bcherry]

@lukasIO ah sorry - gotta find a way to close dupes in linear without closing the github ticket...