Render <label>
and <textarea>
This commit resolves the previous error:
Error:
UserSharesAMessageTest#test_visiting_the_index:
Capybara::ElementNotFound: Unable to find field "Message"
test/system/user_shares_a_message_test.rb:9:in `block in <class:UserSharesAMessageTest>'
When invoked on the page
object, fill_in
,
Capybara will locate the corresponding <input type="text">
or
<textarea>
by resolving the first argument (the locator
)
by matching its:
[name]
attribute[id]
attributeCapybara.test_id
attribute- the text of a
<label>
element with a[for]
attribute that references a<textarea>
or<input type="text">
When invoked on an element directly, a missing locator will be resolved
on self
or a descendant.
This commit renders a <label>
element with internationalized text, and
a <textarea>
element that the <label>
references.
If we want our page to be accessible, it’s important that
every <form>
field has a corresponding <label>
associated with it.
Modern browsers can infer a lot of helpful behavior for pages that render HTML elements with appropriate semantics, including some behavior that improves the accessibility of the content.
Ensuring that our browser-driven tests interact with the underlying
elements based on <label>
text improves the odds that the page is
accessible.
Accessibility and leveraging semantics-based behavior aside, system tests should interact with the page in the same way that end-users will. Users visiting a page in a web browser won’t be interacting with the page with CSS selectors or HTML attribute, so our tests shouldn’t either.
When run again, the system test raises a new error:
Error:
UserSharesAMessageTest#test_visiting_the_index:
Capybara::ElementNotFound: Unable to find link or button "Share"
test/system/user_shares_a_message_test.rb:10:in `block in <class:UserSharesAMessageTest>'