Then "subjectText" has focus

The Then I see [subject] has focus step asserts that a named element currently holds keyboard focus, meaning it is the document.activeElement. The name is resolved from the CSS or XPath selector registry. The step first waits for the element to be attached to the DOM, then uses page.waitForFunction to poll until the element becomes the active element, with a 5-second timeout. This makes the assertion reliable even when focus is set asynchronously, for example after a dialog opens or a JavaScript autofocus runs.

The step accepts only a single subject name. It is particularly useful in accessibility testing to confirm that focus management is correct: that a modal traps focus on open, that a skip link receives focus on keyboard navigation, or that a form field is auto-focused after a routing transition. The element must be registered as a named selector before this step runs.

Accepted phrasings

Then I see [subject] has focus
Then we see [subject] has focus
Then see [subject] has focus

Examples

Then I see search has focus
Then I see email input has focus
Then we see submit button has focus
Then I see skip link has focus

In a real scenario

Scenario: Search field receives focus when the search panel opens
  Given I define css selectors:
    | search toggle | .search-toggle-btn |
    | search input  | input.search-field |
    | search panel  | .search-panel      |
  When I go to "https://example.org/"
  And I click search toggle
  Then I see visible search panel
  And I see search input has focus

Related steps

Back to Selectors Steps