> For the complete documentation index, see [llms.txt](https://docs.does.qa/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.does.qa/test-step-options/element-states.md).

# Element states

Check and Wait Test Steps often ask whether an Element is present, shown, or ready to use. These states mean different things. Pick the one that matches what you need to prove.

## Presence and visibility

| State         | What it means                                     |
| ------------- | ------------------------------------------------- |
| **Exists**    | The Element is in the DOM.                        |
| **Displayed** | The Element is shown on the page.                 |
| **Visible**   | The Element is shown within the current viewport. |

**Exists** only cares that the Element is in the page structure. It can still be hidden.

**Displayed** means the Element is shown. An Element that is off-screen can still be Displayed. If a parent is hiding the Element, it is not Displayed.

**Visible** means the Element is shown inside what the browser can see right now. Use it when the journey depends on the Element being on screen, not only present or shown somewhere on the page.

| If you need to prove…                        | Use       |
| -------------------------------------------- | --------- |
| The Element is in the page                   | Exists    |
| The Element is shown                         | Displayed |
| The Element is on screen in the current view | Visible   |

## Interaction

| State         | What it means                                                  |
| ------------- | -------------------------------------------------------------- |
| **Enabled**   | The Element can be used. It is not disabled.                   |
| **Disabled**  | The Element is disabled.                                       |
| **Clickable** | The Element is Displayed and Enabled, so it is ready to click. |

Use **Enabled** when the control should accept input. Use **Clickable** when the next step is a click or tap and the Element should be both shown and usable.

## Selection and focus

| State        | What it means                                                           |
| ------------ | ----------------------------------------------------------------------- |
| **Selected** | The Element is selected or checked, such as a checkbox or radio button. |
| **Focused**  | The Element has keyboard focus.                                         |

## Checks and waits

Each state has matching Check Test Steps, and the presence, visibility, and interaction states also have Wait Test Steps.

| State     | Check                                                                                                                     | Wait                                                                                                                                                                                            |
| --------- | ------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Exists    | [Check Exists](/test-steps/check/check-exists.md) / [Check Does Not Exist](/test-steps/check/check-does-not-exist.md)     | [Wait For Element To Exist](/test-steps/runner/wait-for-element-to-exist.md) / [Wait For Element To Not Exist](/test-steps/runner/wait-for-element-to-not-exist.md)                             |
| Displayed | [Check Displayed](/test-steps/check/check-displayed.md) / [Check Not Displayed](/test-steps/check/check-not-displayed.md) | [Wait For Element To Be Displayed](/test-steps/runner/wait-for-element-to-be-displayed.md) / [Wait For Element To Not Be Displayed](/test-steps/runner/wait-for-element-to-not-be-displayed.md) |
| Visible   | [Check Visible](/test-steps/check/check-visible.md) / [Check Not Visible](/test-steps/check/check-not-visible.md)         | [Wait For Element To Be Visible](/test-steps/runner/wait-for-element-to-be-visible.md) / [Wait For Element To Not Be Visible](/test-steps/runner/wait-for-element-to-not-be-visible.md)         |
| Enabled   | [Check Enabled](/test-steps/check/check-enabled.md) / [Check Disabled](/test-steps/check/check-disabled.md)               | [Wait For Element To Be Enabled](/test-steps/runner/wait-for-element-to-be-enabled.md) / [Wait For Element To Be Disabled](/test-steps/runner/wait-for-element-to-be-disabled.md)               |
| Clickable | [Check Clickable](/test-steps/check/check-clickable.md) / [Check Not Clickable](/test-steps/check/check-not-clickable.md) | [Wait For Element To Be Clickable](/test-steps/runner/wait-for-element-to-be-clickable.md) / [Wait For Element To Not Be Clickable](/test-steps/runner/wait-for-element-to-not-be-clickable.md) |
| Selected  | [Check Selected](/test-steps/check/check-selected.md) / [Check Not Selected](/test-steps/check/check-not-selected.md)     |                                                                                                                                                                                                 |
| Focused   | [Check Focused](/test-steps/check/check-focused.md) / [Check Not Focused](/test-steps/check/check-not-focused.md)         |                                                                                                                                                                                                 |

{% hint style="info" %}
**Pro tip:** Touch already waits for the Element to become clickable and scrolls it into view before clicking. Add an explicit Wait when the Flow needs to pause on a state before the next step.
{% endhint %}

## Related

* [Check](/test-steps/check.md)
* [Runner](/test-steps/runner.md)
* [Creating Elements](/elements/creating-elements.md)
