Microphone activation causes headphones to disconnect, sound switches to phone speaker

[richthegxd]

Select which package(s) are affected

@livekit/components-react

Describe the bug

When entering a webinar room via a mobile device using headphones, enabling the microphone causes audio to switch to the phone's main speaker. The headphones disconnect, and the only way to reconnect them is by refreshing the page.

According to users, it is repeated on iOS, with a wireless headset

Reproduction

1. Use a mobile device with headphones connected (wired or wireless).
2. Join a room using the LiveKit Components JS.
3. Enable the microphone while in the room.
4. Observe that the audio output switches to the phone’s main speaker, and the headphones disconnect.
5. Attempt to reconnect headphones; they remain disconnected until the page is refreshed.

Logs

No response

System Info

System:
    OS: Linux 6.8 Ubuntu 24.04.1 LTS 24.04.1 LTS (Noble Numbat)
    CPU: (8) x64 AMD Ryzen 5 5600X 6-Core Processor
    Memory: 10.14 GB / 19.19 GB
    Container: Yes
    Shell: 5.2.21 - /bin/bash
  Binaries:
    Node: 20.17.0 - ~/.nvm/versions/node/v20.17.0/bin/node
    npm: 10.8.2 - ~/.nvm/versions/node/v20.17.0/bin/npm
    pnpm: 9.12.1 - ~/.nvm/versions/node/v20.17.0/bin/pnpm
  Browsers:
    Chrome: 130.0.6723.116
  npmPackages:
    livekit-client: 2.7.0 => 2.7.0 
    @livekit/components-react: 2.6.9

Severity

annoyance

Additional Information

No response