getByLabelText(
  container?: HTMLElement,
  text: TextMatch,
  options?: {
    selector?: string = '*',
    exact?: boolean = true,
    normalizer?: NormalizerFn,
  }): HTMLElement

• ByLabelText: input 엘리먼트의 label 값을 기반으로 쿼리를 진행해주는 메서드
• label과 관련된 element를 찾아 반환하게 됨

<label for="username-input">Username</label>
<input id="username-input" />

<label id="username-label">Username</label>
<input aria-labelledby="username-label" />

<label>Username <input /></label>

<label>
  <span>Username</span>
  <input />
</label>

<input aria-label="Username" />

// on test
import {screen} from '@testing-library/dom'

const inputNode = screen.getByLabelText('Username')

Options

• selector: label과 관련된 element 중 정확하게 어떤 요소를 가져올 것인지 정해주는 옵션

<label id="username">Username</label>
<input aria-labelledby="username" />
<span aria-labelledby="username">Please enter your username</span>

<label>
  Username
  <input />
</label>
<label>
  Username
  <textarea></textarea>
</label> 

// test
const inputNode = screen.getByLabelText('Username', {selector: 'input'})

// 아래처럼 form 형식이 아닌 element에는 작동하지 않음에 주의
<section id="photos-section">
  <label for="photos-section">Photos</label>
</section>