This step clicks an element located by an HTML attribute value rather than by its visible text. You supply the value to match and optionally the attribute name (such as id, class, name, or a data-* attribute). When no attribute name is supplied, the step passes the value to buildSelector, which infers a CSS selector - a value prefixed with # becomes an id selector, while bare strings are tested against common attributes in sequence. The first matching element is clicked regardless of its element type.
Use this variant when an element has no stable or unique visible text, or when automated attribute values (such as data-testid or a generated id) make the test more resilient to label changes. Values containing CSS special characters should be passed with an explicit attribute name to avoid selector ambiguity. There is no automatic error hint on failure, so verify the selector resolves before relying on it.
Accepted phrasings
When I click "#about-us-id" by attr
When I click "data-selector-about" by attribute
When we click "nav-home" by attr
And I click "about-us-css" by "class" attr
And I click "about-us-id" by its "id" attribute
Examples
When I click "#about-us-id" by attr
When I click "data-selector-about" by attribute
And I click "about-us-css" by "class" attr
And I click "about-us-id" by its "id" attribute
In a real scenario
Scenario: Open the user profile via a data attribute link
Given I am on "/dashboard"
And wait
When I click "user-profile-link" by "data-testid" attr
And wait
Then I should see "Profile settings"
And the url should match "/profile"
Related steps
- Click link or button by visible text - click using the element's readable label
- Press button by attribute - similar attribute-based step focused on button elements
- Click action in table row - click a link or button within a specific table row
- Press button by visible text - press a button using its exact visible label