> ## Documentation Index
> Fetch the complete documentation index at: https://docs.spurtest.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Select

> Choose options from system and custom dropdowns.

## Overview

The select action handles dropdown interactions. The approach differs depending on whether the dropdown is a native system element or a custom-built component.

## System Dropdowns

Use the select action for native browser dropdowns (HTML `<select>` elements).

<Frame caption="Example of a system (native) dropdown">
  <img src="https://mintcdn.com/spur/qv5cvlrqcbi1P9nN/images/Select/SystemDropdowns.png?fit=max&auto=format&n=qv5cvlrqcbi1P9nN&q=85&s=cbdb29ddce0dd128bd940659eea0ac3d" alt="" width="1546" height="710" data-path="images/Select/SystemDropdowns.png" />
</Frame>

<Frame caption="Using select with a system dropdown">
  <img src="https://mintcdn.com/spur/qv5cvlrqcbi1P9nN/images/Select/select_ex_1.png?fit=max&auto=format&n=qv5cvlrqcbi1P9nN&q=85&s=b11806e36ae8ab420d930cce257093bb" alt="" width="1038" height="118" data-path="images/Select/select_ex_1.png" />
</Frame>

## Custom Dropdowns

Custom dropdowns are built with non-native HTML elements and require a different approach. You can handle them with either [click actions](#using-click-actions) or [typing actions](#using-typing-actions).

<Frame caption="Example of a custom dropdown with click and typing functionality">
  <img src="https://mintcdn.com/spur/qv5cvlrqcbi1P9nN/images/Select/custom_dropdown.png?fit=max&auto=format&n=qv5cvlrqcbi1P9nN&q=85&s=567a54acaee0d0dc99cdd75646187085" alt="" width="1216" height="952" data-path="images/Select/custom_dropdown.png" />
</Frame>

### Using Click Actions

Click the dropdown to open it, then click the desired option.

<Frame caption="Handling a custom dropdown with click actions">
  <img src="https://mintcdn.com/spur/qv5cvlrqcbi1P9nN/images/Select/select_ex_2.png?fit=max&auto=format&n=qv5cvlrqcbi1P9nN&q=85&s=f359aa8589f1a338ddf0dde8bce3b651" alt="" width="1036" height="240" data-path="images/Select/select_ex_2.png" />
</Frame>

### Using Typing Actions

Type into the dropdown's search field to filter options, then select the result.

<Frame caption="Handling a custom dropdown with typing actions">
  <img src="https://mintcdn.com/spur/SU7JWaNfJJg63kTF/images/Select/select_ex_3.png?fit=max&auto=format&n=SU7JWaNfJJg63kTF&q=85&s=a9b45189837b377cd97699fbac80e66f" alt="" width="1042" height="156" data-path="images/Select/select_ex_3.png" />
</Frame>