# Add keyboard and focus handling to one interactive component

A component that works with a mouse and traps or ignores a keyboard, fixed and covered by a keyboard-path test.

Category: Accessibility and browser verification
Source: https://letsship.ai/use-cases/add-keyboard-and-focus-handling
Published: 2026-08-25

## Goal

Make one interactive component fully operable by keyboard, with visible focus.

## Acceptance criteria

- Every action is reachable and operable by keyboard alone
- Focus is visible at each step and never lost
- Focus order follows the visual order
- A test drives the component by keyboard from start to finish

## What lands as proof

A keyboard-driven test plus a screenshot showing the focus indicator at each step.

## Prompt

Copy this to an agent to open the ticket:

```text
Create a Linear issue in my team and assign it to the SHIP agent.

Title: Add keyboard support to {component}

Description: Make one interactive component fully operable by keyboard, with visible focus.

Acceptance criteria:
- Every action is reachable and operable by keyboard alone
- Focus is visible at each step and never lost
- Focus order follows the visual order
- A test drives the component by keyboard from start to finish

Before you create the issue, find an interactive component in this repository built from non-semantic elements and replace {component} with it.
```

## Questions

### What does the agent actually change?

The ticket is scoped to one outcome: make one interactive component fully operable by keyboard, with visible focus. Work that serves that outcome is in scope, and anything outside it is left for a separate ticket, so the pull request stays reviewable.

### How do I know the work is done?

The pull request carries the evidence, not only the diff. Here that means keyboard-path test and a focus-visible screenshot, so a reviewer can confirm the result without reproducing the work locally.

### How much oversight does this need?

None is required before the run starts. Every claim this ticket makes can be checked by machine, so the agent works straight through and a person reviews the finished pull request like any other.