ByAltText

getByAltText、queryByAltText、getAllByAltText、queryAllByAltText、findByAltText、findAllByAltText

API

getByAltText(
  // If you're using `screen`, then skip the container argument:
  container: HTMLElement,
  text: TextMatch,
  options?: {
    exact?: boolean = true,
    normalizer?: NormalizerFn,
  }): HTMLElement

この機能は、指定されたaltテキストを持つ要素（通常は<img>）を返します。ただし、alt属性を受け入れる要素または（altを実装しているかどうかが不明なため）カスタム要素のみをサポートすることに注意してください:<img>、<input>、および<area>（非推奨であるため<applet>は意図的に除外されています）。

<img alt="Incredibles 2 Poster" src="/incredibles-2.png" />

ネイティブ

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

const incrediblesPosterImg = screen.getByAltText(/incredibles.*? poster/i)

React

import {render, screen} from '@testing-library/react'

render(<MyComponent />)
const incrediblesPosterImg = screen.getByAltText(/incredibles.*? poster/i)

Angular

import {render, screen} from '@testing-library/angular'

await render(MyComponent)
const incrediblesPosterImg = screen.getByAltText(/incredibles.*? poster/i)

Cypress

cy.findByAltText(/incredibles.*? poster/i).should('exist')

オプション

TextMatchオプション