> For the complete documentation index, see [llms.txt](https://docs.inova.us/v1/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.inova.us/v1/twilio-in-browser-call-plugin/audio-device-selection.md).

# Audio Device Selection

## Audio Device Selection

The Twilio Client element can enumerate the browser's audio devices and let your users choose which microphone and speaker to use. On initialization (after microphone permission is granted) the element populates the device-list states; you bind those to dropdowns and feed the chosen id back into the element.

{% hint style="info" %}
Output (speaker) selection relies on the browser's `setSinkId` API and is not supported in every browser. Check the **Output Device Supported** state before showing a speaker picker.
{% endhint %}

### Element fields

| Field                     | Description                                                                           |
| ------------------------- | ------------------------------------------------------------------------------------- |
| Selected input device id  | The `deviceId` of the microphone to use. Set this from the user's dropdown selection. |
| Selected output device id | The `deviceId` of the speaker to use.                                                 |

### Device-list states

The **Input devices** and **Output devices** states are lists of text, each entry formatted as `label - deviceId`. Bind a dropdown's option list to the state, and when the user picks an option, extract the id after the last `-` and write it to the matching **Selected … device id** field.

| State                   | Type         | Description                                             |
| ----------------------- | ------------ | ------------------------------------------------------- |
| Input devices           | list of text | Available microphones (`label - deviceId`).             |
| Output devices          | list of text | Available speakers (`label - deviceId`).                |
| Output Device Supported | yes/no       | Whether the browser supports choosing an output device. |

### Debugging selection (requested vs applied)

When a selection doesn't seem to take effect, these states show what the element requested versus what the browser actually applied:

| State                      | Type   | Description                                                |
| -------------------------- | ------ | ---------------------------------------------------------- |
| Requested Input Device Id  | text   | The input id the element tried to apply.                   |
| Applied Input Device Id    | text   | The input id currently in effect.                          |
| Requested Output Device Id | text   | The output id the element tried to apply.                  |
| Applied Output Device Id   | text   | The output id currently in effect.                         |
| Output Device Applied      | yes/no | Whether the requested output device was applied.           |
| Output Device Error        | text   | Any error raised while applying an output device.          |
| Device Selection Debug     | text   | Human-readable trace of the last device-selection attempt. |

If **Requested** and **Applied** differ, the browser rejected the change — often because the device was unplugged, the id is stale (re-enumerate on `devicechange`), or output selection isn't supported. See Troubleshooting.