Querying Form Fields
Learn different approaches for querying a form field in a test in this lesson.
Starter project
The starter project contains an EditPersonName
component that includes a form that allows a person’s first and last name to be changed.
A copy of the project is in the code widget below. When the “Run” button is clicked, the app is started.
export default "test-file-stub";
Run the app.
We should see a form rendered containing first name and last name fields with a “Save” button. The project also contains a half-implemented test to verify the first name field has the correct initial value. We’ll fully implement the test in this lesson.
The code widget below contains a copy of the project and runs the tests when the “Run” button is clicked:
export default "test-file-stub";
The ByLabelText
query type
To finish the test implementation, we need to get the first name input
element and check that its value is "Herman"
.
There is a query type called ByLabelText
...