getByDisplayValue, queryByDisplayValue, getAllByDisplayValue, queryAllByDisplayValue, findByDisplayValue, findAllByDisplayValue
API
javascript
getByDisplayValue(
// If you're using `screen`, then skip the container argument:
container: HTMLElement,
value: TextMatch,
options?: {
exact?: boolean = true,
normalizer?: NormalizerFn,
}): HTMLElement
返回具有匹配显示值的 input、textarea 或 select 元素。
input
tags
html
<input type="text" id="lastName" />
javascript
document.getElementById('lastName').value = 'Norris'
javascript
// HTML
import {screen} from '@testing-library/dom'
const lastNameInput = screen.getByDisplayValue('Norris')
// React
import {render, screen} from '@testing-library/react'
render(<MyComponent />)
const lastNameInput = screen.getByDisplayValue('Norris')
textarea
tags
javascript
<textarea id="messageTextArea" />
document.getElementById('messageTextArea').value = 'Hello World'
javascript
// HTML
import {screen} from '@testing-library/dom'
const messageTextArea = screen.getByDisplayValue('Hello World')
// React
import {render, screen} from '@testing-library/react'
render(<MyComponent />)
const messageTextArea = screen.getByDisplayValue('Hello World')
select
tags
如果是select,这将搜索一个匹配给定 TextMatch 的选定<option>的<select>。
html
<select>
<option value="">State</option>
<option value="AL">Alabama</option>
<option selected value="AK">Alaska</option>
<option value="AZ">Arizona</option>
</select>
javascript
// HTML
import {screen} from '@testing-library/dom'
const selectElement = screen.getByDisplayValue('Alaska')
// React
import {render, screen} from '@testing-library/react'
render(<MyComponent />)
const selectElement = screen.getByDisplayValue('Alaska')