Why does screen.getByLabelText('Email') throw for this… (Testing interview question)

<label>Email</label>
<input type="email" name="email" />

The label isn't associated with the input; it needs htmlFor matching the input's id, or must wrap the input

The label isn't linked to the input. A label sitting next to an input isn't connected to it, so screen readers don't announce it either. The failing test is pointing at a real accessibility bug. Link them with htmlFor and id, wrap the input in the label, or use aria-labelledby. The tempting aria-label option is wrong. getByLabelText also finds inputs through <label> elements and aria-labelledby.

About queries (https://testing-library.com/docs/queries/about)testing-library.com
The label element (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label)developer.mozilla.org