# Focus Visible

## Prerequisites

See [Keyboard Prerequisites](/oatmeal/keyboard.md#prerequisites).

These steps assume that the following tests have been completed and that issues found have been resolved:

* [Focus Moveable](/oatmeal/keyboard/focus-is-not-trapped.md)

### Browsers to Test With

Test for visible focus using browsers *with* and *without* a stylized visual indicator.

| Non-stylized focus indicator | Stylized focus indicator |
| ---------------------------- | ------------------------ |
| Firefox                      | Chrome                   |
| Internet Explorer            | Safari                   |

## Steps

1. Place keyboard focus into the browser's address bar
   1. There should now be a blinking caret, indicating that the input has keyboard focus
2. Use TAB key to move forwards through the browser chrome
   * Do not create any issues for the browser chrome
3. Use TAB key to move forwards through focusable elements of the page; pause on every key press to verify that keyboard focus is still visible
   * Do not hold down the TAB key
4. If the focus indicator is lost, create an issue
   * See "Keyboard focus indicator lost" section below
5. If the focus indicator is visible, but relies on colour alone, create an issue
   1. See "Keyboard focus indicator insufficient" section below
6. If the focus indicator is visible, but not easily distinguishable, create an issue
   1. See "Keyboard focus indicator insufficient" section below
7. Repeat steps 3 to 6 until focus returns to the browser chrome

## Creating Issues

Provide enough information to identify when focus is not visible or insufficient.

### Keyboard focus indicator lost

* **Description**: Keyboard focus indicator lost
* **Priority**:
  * Focus indicator returns after one additional TAB key press: P3
  * Focus indicator returns after multiple additional TAB key presses: P2
  * Focus indicator fails to return: P1
* **Label or Tag**: #a11y247

### Keyboard focus indicator insufficient

* **Description**: Keyboard focus indicator insufficient
* **Priority**:
  * Focus not clearly on one element or another: P2
  * Focus relies on colour alone: P3
  * Focus distorted: P3
* **Label or Tag**: #a11y247

## About

Author(s): Ian McBurnie & Luis Garcia

Last Updated: 2021 Jan 25th


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://ebay.gitbook.io/oatmeal/keyboard/focus-is-visible.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.