ByText

getByText、queryByText、getAllByText、queryAllByText、findByText、findAllByText

API

getByText(
  // If you're using `screen`, then skip the container argument:
  container: HTMLElement,
  text: TextMatch,
  options?: {
    selector?: string = '*',
    exact?: boolean = true,
    ignore?: string|boolean = 'script, style',
    normalizer?: NormalizerFn,
  }): HTMLElement

这将搜索所有具有文本节点的元素，该文本节点的 textContent 与给定的 TextMatch 匹配。

<a href="/about">About ℹ️</a>

原生

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

const aboutAnchorNode = screen.getByText(/about/i)

React

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

render(<MyComponent />)
const aboutAnchorNode = screen.getByText(/about/i)

Angular

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

await render(MyComponent)
const aboutAnchorNode = screen.getByText(/about/i)

Cypress

cy.findByText(/about/i).should('exist')

它也适用于 type 属性为 submit 或 button 的 input。

<input type="submit" value="Send data" />

选项

TextMatch 选项，以及以下选项

selector

注意

有关如何以及何时使用 selector 选项的更多详细信息，请参阅 getByLabelText

ignore

ignore 选项接受一个查询选择器。如果 node.matches 对该选择器返回 true，则节点将被忽略。默认值为 'script, style'，因为通常您不希望选择这些标签，但是如果您的内容位于内联脚本文件中，则可能会返回 script 标签。

如果您希望禁用此行为，请将 ignore 设置为 false。