Fills multiple form fields in one step from a Gherkin data table, locating every field by an HTML attribute instead of its label. Each table row is a | key | value | pair: the key identifies the field and the value is typed into it. Keys may be a CSS-style shorthand such as #uname (id), .uname (class), or a full attribute selector like [data-testid=email].
When you do not name an explicit attribute, each key is matched against id, class, name, data-testid, data-test-id, data-test, data-cy, aria-label, value, placeholder, and title, in that order. To remove ambiguity on busy forms, pin the lookup to one attribute with the by its "..." attribute form. If several elements still match, the first one on the page is filled.
Accepted phrasings
When I fill in the following: by attr
When I fill in the following: by attribute
When we fill in the following: by attr
When I fill in following: by attr
When I fill in the following: by its "placeholder" attribute
When I fill in the following: by its "name" attrExamples
When I fill in the following: by attr
| #uname | John Smith |
| password | s3cret |
When I fill in the following: by its "placeholder" attribute
| Your full name | John Smith |
| Your Password | s3cret |
When I fill in the following: by attribute
| [data-testid=email] | a@b.c |
| [data-testid=username] | alice |
When I fill in the following: by its "name" attribute
| card_number | 4242 4242 4242 4242 |
| exp_date | 12/30 |In a real scenario
Scenario: Register a new account on the portal using field names
Given I am an anonymous user
When I go to "https://example.org/user/register"
And wait
And I fill in the following: by its "name" attribute
| mail | new.member@example.org |
| name | new.member |
And I press the "Create new account" button
And wait
Then I should see "Registration successful"