Files
callstack__react-native-tes…/docs/api-queries/index.html
T
2022-06-24 11:20:09 +00:00

51 lines
84 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<meta name="generator" content="Docusaurus v2.0.0-alpha.61">
<link rel="search" type="application/opensearchdescription+xml" title="React Native Testing Library" href="/react-native-testing-library/opensearch.xml"><title data-react-helmet="true">Queries | React Native Testing Library</title><meta data-react-helmet="true" property="og:image" content="https://callstack.github.io/react-native-testing-library/img/owl.png"><meta data-react-helmet="true" property="twitter:image" content="https://callstack.github.io/react-native-testing-library/img/owl.png"><meta data-react-helmet="true" name="twitter:image:alt" content="Image for React Native Testing Library"><meta data-react-helmet="true" name="twitter:card" content="summary_large_image"><meta data-react-helmet="true" property="og:title" content="Queries | React Native Testing Library"><meta data-react-helmet="true" name="description" content="Table of contents:"><meta data-react-helmet="true" property="og:description" content="Table of contents:"><meta data-react-helmet="true" property="og:url" content="https://callstack.github.io/react-native-testing-library/docs/api-queries"><link data-react-helmet="true" rel="shortcut icon" href="/react-native-testing-library/img/owl.png"><link data-react-helmet="true" rel="preconnect" href="https://BH4D9OD16A-dsn.algolia.net" crossorigin="true"><link data-react-helmet="true" rel="canonical" href="https://callstack.github.io/react-native-testing-library/docs/api-queries"><link rel="stylesheet" href="/react-native-testing-library/styles.82a91456.css">
<link rel="preload" href="/react-native-testing-library/styles.ee9a6b2e.js" as="script">
<link rel="preload" href="/react-native-testing-library/runtime~main.3040f9f0.js" as="script">
<link rel="preload" href="/react-native-testing-library/main.f525795a.js" as="script">
<link rel="preload" href="/react-native-testing-library/1.53d2eea7.js" as="script">
<link rel="preload" href="/react-native-testing-library/2.5a5ca056.js" as="script">
<link rel="preload" href="/react-native-testing-library/20.6761354a.js" as="script">
<link rel="preload" href="/react-native-testing-library/23.37974b0a.js" as="script">
<link rel="preload" href="/react-native-testing-library/e91cf13d.5c3edbf8.js" as="script">
<link rel="preload" href="/react-native-testing-library/17896441.df97c5e9.js" as="script">
<link rel="preload" href="/react-native-testing-library/7ad239b9.ec5fad6b.js" as="script">
</head>
<body>
<script>!function(){function t(t){document.documentElement.setAttribute("data-theme",t)}var e=function(){var t=null;try{t=localStorage.getItem("theme")}catch(t){}return t}();t(null!==e?e:"light")}()</script><div id="__docusaurus">
<nav class="navbar navbar--light navbar--fixed-top"><div class="navbar__inner"><div class="navbar__items"><div aria-label="Navigation bar toggle" class="navbar__toggle" role="button" tabindex="0"><svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 30 30" role="img" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-linecap="round" stroke-miterlimit="10" stroke-width="2" d="M4 7h22M4 15h22M4 23h22"></path></svg></div><a class="navbar__brand" href="/react-native-testing-library/"><img class="navbar__logo" src="/react-native-testing-library/img/owl.png" alt="React Native Testing Library"><strong class="navbar__title">React Native Testing Library</strong></a></div><div class="navbar__items navbar__items--right"><a class="navbar__item navbar__link" href="/react-native-testing-library/docs/getting-started">Docs</a><a href="https://github.com/callstack/react-native-testing-library" target="_blank" rel="noopener noreferrer" class="navbar__item navbar__link">GitHub</a><div class="react-toggle react-toggle--disabled displayOnlyInLargeViewport_2aTZ"><div class="react-toggle-track"><div class="react-toggle-track-check"><span class="toggle_BsTx">🌜</span></div><div class="react-toggle-track-x"><span class="toggle_BsTx">🌞</span></div></div><div class="react-toggle-thumb"></div><input type="checkbox" disabled="" aria-label="Dark mode toggle" class="react-toggle-screenreader-only"></div><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><svg width="20" height="20" class="DocSearch-Search-Icon" viewBox="0 0 20 20"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span><span class="DocSearch-Button-Key">⌘</span><span class="DocSearch-Button-Key">K</span></button></div></div><div role="presentation" class="navbar-sidebar__backdrop"></div><div class="navbar-sidebar"><div class="navbar-sidebar__brand"><a class="navbar__brand" href="/react-native-testing-library/"><img class="navbar__logo" src="/react-native-testing-library/img/owl.png" alt="React Native Testing Library"><strong class="navbar__title">React Native Testing Library</strong></a></div><div class="navbar-sidebar__items"><div class="menu"><ul class="menu__list"><li class="menu__list-item"><a class="menu__link" href="/react-native-testing-library/docs/getting-started">Docs</a></li><li class="menu__list-item"><a href="https://github.com/callstack/react-native-testing-library" target="_blank" rel="noopener noreferrer" class="menu__link">GitHub</a></li></ul></div></div></div></nav><div class="main-wrapper"><div class="docPage_2gpo"><div class="docSidebarContainer_3_JD" role="complementary"><div class="sidebar_2urC"><div class="menu menu--responsive menu_5FrY"><button aria-label="Open Menu" aria-haspopup="true" class="button button--secondary button--sm menu__button" type="button"><svg aria-label="Menu" class="sidebarMenuIcon_Dm3K" xmlns="http://www.w3.org/2000/svg" height="24" width="24" viewBox="0 0 32 32" role="img" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-linecap="round" stroke-miterlimit="10" stroke-width="2" d="M4 7h22M4 15h22M4 23h22"></path></svg></button><ul class="menu__list"><li class="menu__list-item"><a class="menu__link menuLinkText_2zSB">Introduction</a><ul class="menu__list"><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/react-native-testing-library/docs/getting-started">Getting Started</a></li></ul></li><li class="menu__list-item"><a class="menu__link menuLinkText_2zSB">API Reference</a><ul class="menu__list"><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/react-native-testing-library/docs/api">API</a></li><li class="menu__list-item"><a aria-current="page" class="menu__link menu__link--active active" tabindex="0" href="/react-native-testing-library/docs/api-queries">Queries</a></li></ul></li><li class="menu__list-item"><a class="menu__link menuLinkText_2zSB">Guides</a><ul class="menu__list"><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/react-native-testing-library/docs/migration-v9">Migration to 9.0</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/react-native-testing-library/docs/migration-v7">Migration to 7.0</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/react-native-testing-library/docs/migration-v2">Migration to 2.0</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/react-native-testing-library/docs/how-should-i-query">How Should I Query?</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/react-native-testing-library/docs/faq">FAQ</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/react-native-testing-library/docs/eslint-plugin-testing-library">ESLint Plugin Testing Library Compatibility</a></li></ul></li><li class="menu__list-item"><a class="menu__link menuLinkText_2zSB">Examples</a><ul class="menu__list"><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/react-native-testing-library/docs/react-navigation">React Navigation</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/react-native-testing-library/docs/redux-integration">Redux Integration</a></li></ul></li></ul></div></div></div><main class="docMainContainer_3EyW"><div class="container padding-vert--lg docItemWrapper_1EkI"><div class="row"><div class="col docItemCol_2ASc"><div class="docItemContainer_3QWW"><article><header><h1 class="docTitle_1Lrw">Queries</h1></header><div class="markdown"><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="table-of-contents"></a>Table of contents:<a aria-hidden="true" tabindex="-1" class="hash-link" href="#table-of-contents" title="Direct link to heading">#</a></h3><ul><li><a href="#variants">Variants</a><ul><li><a href="#getby">getBy</a></li><li><a href="#getallby">getAllBy</a></li><li><a href="#queryby">queryBy</a></li><li><a href="#queryallby">queryAllBy</a></li><li><a href="#findby">findBy</a></li><li><a href="#findallby">findAllBy</a></li></ul></li><li><a href="#queries">Queries</a><ul><li><a href="#options">Options</a></li><li><a href="#bytext"><code>ByText</code></a></li><li><a href="#byplaceholdertext"><code>ByPlaceholderText</code></a></li><li><a href="#bydisplayvalue"><code>ByDisplayValue</code></a></li><li><a href="#bytestid"><code>ByTestId</code></a></li><li><a href="#bylabeltext"><code>ByLabelText</code></a></li><li><a href="#byhinttext-bya11yhint-byaccessibilityhint"><code>ByHintText</code>, <code>ByA11yHint</code>, <code>ByAccessibilityHint</code></a></li><li><a href="#bya11ystates-byaccessibilitystates"><code>ByA11yStates</code>, <code>ByAccessibilityStates</code></a></li><li><a href="#byrole"><code>ByRole</code></a></li><li><a href="#bya11ystate-byaccessibilitystate"><code>ByA11yState</code>, <code>ByAccessibilityState</code></a></li><li><a href="#bya11value-byaccessibilityvalue"><code>ByA11Value</code>, <code>ByAccessibilityValue</code></a></li></ul></li><li><a href="#textmatch">TextMatch</a><ul><li><a href="#examples">Examples</a></li><li><a href="#precision">Precision</a></li><li><a href="#normalization">Normalization</a><ul><li><a href="#normalization-examples">Normalization Examples</a></li></ul></li></ul></li><li><a href="#unit-testing-helpers">Unit testing helpers</a><ul><li><a href="#unsafe_bytype"><code>UNSAFE_ByType</code></a></li><li><a href="#unsafe_byprops"><code>UNSAFE_ByProps</code></a></li></ul></li></ul><h2><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="variants"></a>Variants<a aria-hidden="true" tabindex="-1" class="hash-link" href="#variants" title="Direct link to heading">#</a></h2><blockquote><p><code>getBy</code> queries are shown by default in the <a href="#queries">query documentation</a>
below.</p></blockquote><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="getby"></a>getBy<a aria-hidden="true" tabindex="-1" class="hash-link" href="#getby" title="Direct link to heading">#</a></h3><p><code>getBy*</code> queries return the first matching node for a query, and throw an error if no elements match or if more than one match is found (use <code>getAllBy</code> instead).</p><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="getallby"></a>getAllBy<a aria-hidden="true" tabindex="-1" class="hash-link" href="#getallby" title="Direct link to heading">#</a></h3><p><code>getAllBy*</code> queries return an array of all matching nodes for a query, and throw an error if no elements match.</p><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="queryby"></a>queryBy<a aria-hidden="true" tabindex="-1" class="hash-link" href="#queryby" title="Direct link to heading">#</a></h3><p><code>queryBy*</code> queries return the first matching node for a query, and return <code>null</code> if no elements match. This is useful for asserting an element that is not present. This throws if more than one match is found (use <code>queryAllBy</code> instead).</p><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="queryallby"></a>queryAllBy<a aria-hidden="true" tabindex="-1" class="hash-link" href="#queryallby" title="Direct link to heading">#</a></h3><p><code>queryAllBy*</code> queries return an array of all matching nodes for a query, and return an empty array (<code>[]</code>) if no elements match.</p><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="findby"></a>findBy<a aria-hidden="true" tabindex="-1" class="hash-link" href="#findby" title="Direct link to heading">#</a></h3><p><code>findBy</code> queries return a promise which resolves when a matching element is found. The promise is rejected if no elements match or if more than one match is found after a default timeout of 4500ms. If you need to find more than one element, then use <code>findAllBy</code>.</p><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="findallby"></a>findAllBy<a aria-hidden="true" tabindex="-1" class="hash-link" href="#findallby" title="Direct link to heading">#</a></h3><p><code>findAllBy</code> queries return a promise which resolves to an array when any matching elements are found. The promise is rejected if no elements match after a default timeout of 4500ms.</p><div class="admonition admonition-info alert alert--info"><div class="admonition-heading"><h5><span class="admonition-icon"><svg xmlns="http://www.w3.org/2000/svg" width="14" height="16" viewBox="0 0 14 16"><path fill-rule="evenodd" d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 0 1 1.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"></path></svg></span>info</h5></div><div class="admonition-content"><p>In order to properly use <code>findBy</code> and <code>findAllBy</code> queries you need at least React &gt;=16.9.0 (featuring async <code>act</code>) or React Native &gt;=0.61 (which comes with React &gt;=16.9.0).</p></div></div><div class="admonition admonition-info alert alert--info"><div class="admonition-heading"><h5><span class="admonition-icon"><svg xmlns="http://www.w3.org/2000/svg" width="14" height="16" viewBox="0 0 14 16"><path fill-rule="evenodd" d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 0 1 1.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"></path></svg></span>info</h5></div><div class="admonition-content"><p><code>findBy</code> and <code>findAllBy</code> queries accept optional <code>waitForOptions</code> object argument which can contain <code>timeout</code> and <code>interval</code> properies which have the same meaning as respective options for <a href="/react-native-testing-library/docs/api#waitfor"><code>waitFor</code></a> function.</p></div></div><h2><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="queries"></a>Queries<a aria-hidden="true" tabindex="-1" class="hash-link" href="#queries" title="Direct link to heading">#</a></h2><p><em>Note: most methods like this one return a <a href="https://reactjs.org/docs/test-renderer.html#testinstance" target="_blank" rel="noopener noreferrer"><code>ReactTestInstance</code></a> with following properties that you may be interested in:</em></p><div class="mdxCodeBlock_1XEh"><div class="codeBlockContent_1u-d"><button type="button" aria-label="Copy code to clipboard" class="copyButton_10dd">Copy</button><div tabindex="0" class="prism-code language-typescript codeBlock_3iAC"><div class="codeBlockLines_b7E3" style="color:#393A34;background-color:#f6f8fa"><div class="token-line" style="color:#393A34"><span class="token keyword" style="color:#00009f">type</span><span class="token plain"> </span><span class="token maybe-class-name">ReactTestInstance</span><span class="token plain"> </span><span class="token operator" style="color:#393A34">=</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token keyword" style="color:#00009f">type</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token builtin">string</span><span class="token plain"> </span><span class="token operator" style="color:#393A34">|</span><span class="token plain"> </span><span class="token known-class-name class-name">Function</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"> props</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">[</span><span class="token plain">propName</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token builtin">string</span><span class="token punctuation" style="color:#393A34">]</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token builtin">any</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">}</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"> parent</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">null</span><span class="token plain"> </span><span class="token operator" style="color:#393A34">|</span><span class="token plain"> </span><span class="token maybe-class-name">ReactTestInstance</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"> children</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token known-class-name class-name">Array</span><span class="token operator" style="color:#393A34">&lt;</span><span class="token maybe-class-name">ReactTestInstance</span><span class="token plain"> </span><span class="token operator" style="color:#393A34">|</span><span class="token plain"> </span><span class="token builtin">string</span><span class="token operator" style="color:#393A34">&gt;</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token punctuation" style="color:#393A34">}</span><span class="token punctuation" style="color:#393A34">;</span></div></div></div></div></div><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="options"></a>Options<a aria-hidden="true" tabindex="-1" class="hash-link" href="#options" title="Direct link to heading">#</a></h3><p>Usually query first argument can be a <strong>string</strong> or a <strong>regex</strong>. Some queries accept optional argument which change string matching behaviour. See <a href="#textmatch">TextMatch</a> for more info.</p><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="bytext"></a><code>ByText</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#bytext" title="Direct link to heading">#</a></h3><blockquote><p>getByText, getAllByText, queryByText, queryAllByText, findByText, findAllByText</p></blockquote><p>Returns a <code>ReactTestInstance</code> with matching text – may be a string or regular expression.</p><p>This method will join <code>&lt;Text&gt;</code> siblings to find matches, similarly to <a href="https://reactnative.dev/docs/text#containers" target="_blank" rel="noopener noreferrer">how React Native handles these components</a>. This will allow for querying for strings that will be visually rendered together, but may be semantically separate React components.</p><div class="mdxCodeBlock_1XEh"><div class="codeBlockContent_1u-d"><button type="button" aria-label="Copy code to clipboard" class="copyButton_10dd">Copy</button><div tabindex="0" class="prism-code language-jsx codeBlock_3iAC"><div class="codeBlockLines_b7E3" style="color:#393A34;background-color:#f6f8fa"><div class="token-line" style="color:#393A34"><span class="token keyword" style="color:#00009f">import</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"> render</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> screen </span><span class="token punctuation" style="color:#393A34">}</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">from</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">&#x27;@testing-library/react-native&#x27;</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block">
</span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token function" style="color:#d73a49">render</span><span class="token punctuation" style="color:#393A34">(</span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag class-name" style="color:#00009f">MyComponent</span><span class="token tag" style="color:#00009f"> </span><span class="token tag punctuation" style="color:#393A34">/&gt;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">const</span><span class="token plain"> element </span><span class="token operator" style="color:#393A34">=</span><span class="token plain"> screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token function" style="color:#d73a49">getByText</span><span class="token punctuation" style="color:#393A34">(</span><span class="token string" style="color:#e3116c">&#x27;banana&#x27;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span></div></div></div></div></div><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="byplaceholdertext"></a><code>ByPlaceholderText</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#byplaceholdertext" title="Direct link to heading">#</a></h3><blockquote><p>getByPlaceholderText, getAllByPlaceholderText, queryByPlaceholderText, queryAllByPlaceholderText, findByPlaceholderText, findAllByPlaceholderText</p></blockquote><p>Returns a <code>ReactTestInstance</code> for a <code>TextInput</code> with a matching placeholder – may be a string or regular expression.</p><div class="mdxCodeBlock_1XEh"><div class="codeBlockContent_1u-d"><button type="button" aria-label="Copy code to clipboard" class="copyButton_10dd">Copy</button><div tabindex="0" class="prism-code language-jsx codeBlock_3iAC"><div class="codeBlockLines_b7E3" style="color:#393A34;background-color:#f6f8fa"><div class="token-line" style="color:#393A34"><span class="token keyword" style="color:#00009f">import</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"> render</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> screen </span><span class="token punctuation" style="color:#393A34">}</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">from</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">&#x27;@testing-library/react-native&#x27;</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block">
</span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token function" style="color:#d73a49">render</span><span class="token punctuation" style="color:#393A34">(</span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag class-name" style="color:#00009f">MyComponent</span><span class="token tag" style="color:#00009f"> </span><span class="token tag punctuation" style="color:#393A34">/&gt;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">const</span><span class="token plain"> element </span><span class="token operator" style="color:#393A34">=</span><span class="token plain"> screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token function" style="color:#d73a49">getByPlaceholderText</span><span class="token punctuation" style="color:#393A34">(</span><span class="token string" style="color:#e3116c">&#x27;username&#x27;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span></div></div></div></div></div><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="bydisplayvalue"></a><code>ByDisplayValue</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#bydisplayvalue" title="Direct link to heading">#</a></h3><blockquote><p>getByDisplayValue, getAllByDisplayValue, queryByDisplayValue, queryAllByDisplayValue, findByDisplayValue, findAllByDisplayValue</p></blockquote><p>Returns a <code>ReactTestInstance</code> for a <code>TextInput</code> with a matching display value – may be a string or regular expression.</p><div class="mdxCodeBlock_1XEh"><div class="codeBlockContent_1u-d"><button type="button" aria-label="Copy code to clipboard" class="copyButton_10dd">Copy</button><div tabindex="0" class="prism-code language-jsx codeBlock_3iAC"><div class="codeBlockLines_b7E3" style="color:#393A34;background-color:#f6f8fa"><div class="token-line" style="color:#393A34"><span class="token keyword" style="color:#00009f">import</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"> render</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> screen </span><span class="token punctuation" style="color:#393A34">}</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">from</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">&#x27;@testing-library/react-native&#x27;</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block">
</span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token function" style="color:#d73a49">render</span><span class="token punctuation" style="color:#393A34">(</span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag class-name" style="color:#00009f">MyComponent</span><span class="token tag" style="color:#00009f"> </span><span class="token tag punctuation" style="color:#393A34">/&gt;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">const</span><span class="token plain"> element </span><span class="token operator" style="color:#393A34">=</span><span class="token plain"> screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token function" style="color:#d73a49">getByDisplayValue</span><span class="token punctuation" style="color:#393A34">(</span><span class="token string" style="color:#e3116c">&#x27;username&#x27;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span></div></div></div></div></div><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="bytestid"></a><code>ByTestId</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#bytestid" title="Direct link to heading">#</a></h3><blockquote><p>getByTestId, getAllByTestId, queryByTestId, queryAllByTestId, findByTestId, findAllByTestId</p></blockquote><p>Returns a <code>ReactTestInstance</code> with matching <code>testID</code> prop. <code>testID</code> – may be a string or a regular expression.</p><div class="mdxCodeBlock_1XEh"><div class="codeBlockContent_1u-d"><button type="button" aria-label="Copy code to clipboard" class="copyButton_10dd">Copy</button><div tabindex="0" class="prism-code language-jsx codeBlock_3iAC"><div class="codeBlockLines_b7E3" style="color:#393A34;background-color:#f6f8fa"><div class="token-line" style="color:#393A34"><span class="token keyword" style="color:#00009f">import</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"> render</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> screen </span><span class="token punctuation" style="color:#393A34">}</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">from</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">&#x27;@testing-library/react-native&#x27;</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block">
</span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token function" style="color:#d73a49">render</span><span class="token punctuation" style="color:#393A34">(</span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag class-name" style="color:#00009f">MyComponent</span><span class="token tag" style="color:#00009f"> </span><span class="token tag punctuation" style="color:#393A34">/&gt;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">const</span><span class="token plain"> element </span><span class="token operator" style="color:#393A34">=</span><span class="token plain"> screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token function" style="color:#d73a49">getByTestId</span><span class="token punctuation" style="color:#393A34">(</span><span class="token string" style="color:#e3116c">&#x27;unique-id&#x27;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span></div></div></div></div></div><div class="admonition admonition-info alert alert--info"><div class="admonition-heading"><h5><span class="admonition-icon"><svg xmlns="http://www.w3.org/2000/svg" width="14" height="16" viewBox="0 0 14 16"><path fill-rule="evenodd" d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 0 1 1.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"></path></svg></span>info</h5></div><div class="admonition-content"><p>In the spirit of <a href="https://testing-library.com/docs/guiding-principles" target="_blank" rel="noopener noreferrer">the guiding principles</a>, it is recommended to use this only after the other queries don&#x27;t work for your use case. Using <code>testID</code> attributes do not resemble how your software is used and should be avoided if possible. However, they are particularly useful for end-to-end testing on real devices, e.g. using Detox and it&#x27;s an encouraged technique to use there. Learn more from the blog post <a href="https://kentcdodds.com/blog/making-your-ui-tests-resilient-to-change" target="_blank" rel="noopener noreferrer">&quot;Making your UI tests resilient to change&quot;</a>.</p></div></div><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="bylabeltext"></a><code>ByLabelText</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#bylabeltext" title="Direct link to heading">#</a></h3><blockquote><p>getByLabelText, getAllByLabelText, queryByLabelText, queryAllByLabelText, findByLabelText, findAllByLabelText</p></blockquote><p>Returns a <code>ReactTestInstance</code> with matching <code>accessibilityLabel</code> prop.</p><div class="mdxCodeBlock_1XEh"><div class="codeBlockContent_1u-d"><button type="button" aria-label="Copy code to clipboard" class="copyButton_10dd">Copy</button><div tabindex="0" class="prism-code language-jsx codeBlock_3iAC"><div class="codeBlockLines_b7E3" style="color:#393A34;background-color:#f6f8fa"><div class="token-line" style="color:#393A34"><span class="token keyword" style="color:#00009f">import</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"> render</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> screen </span><span class="token punctuation" style="color:#393A34">}</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">from</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">&#x27;@testing-library/react-native&#x27;</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block">
</span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token function" style="color:#d73a49">render</span><span class="token punctuation" style="color:#393A34">(</span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag class-name" style="color:#00009f">MyComponent</span><span class="token tag" style="color:#00009f"> </span><span class="token tag punctuation" style="color:#393A34">/&gt;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">const</span><span class="token plain"> element </span><span class="token operator" style="color:#393A34">=</span><span class="token plain"> screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token function" style="color:#d73a49">getByLabelText</span><span class="token punctuation" style="color:#393A34">(</span><span class="token string" style="color:#e3116c">&#x27;my-label&#x27;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span></div></div></div></div></div><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="byhinttext-bya11yhint-byaccessibilityhint"></a><code>ByHintText</code>, <code>ByA11yHint</code>, <code>ByAccessibilityHint</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#byhinttext-bya11yhint-byaccessibilityhint" title="Direct link to heading">#</a></h3><blockquote><p>getByA11yHint, getAllByA11yHint, queryByA11yHint, queryAllByA11yHint, findByA11yHint, findAllByA11yHint
getByAccessibilityHint, getAllByAccessibilityHint, queryByAccessibilityHint, queryAllByAccessibilityHint, findByAccessibilityHint, findAllByAccessibilityHint
getByHintText, getAllByHintText, queryByHintText, queryAllByHintText, findByHintText, findAllByHintText</p></blockquote><p>Returns a <code>ReactTestInstance</code> with matching <code>accessibilityHint</code> prop.</p><div class="mdxCodeBlock_1XEh"><div class="codeBlockContent_1u-d"><button type="button" aria-label="Copy code to clipboard" class="copyButton_10dd">Copy</button><div tabindex="0" class="prism-code language-jsx codeBlock_3iAC"><div class="codeBlockLines_b7E3" style="color:#393A34;background-color:#f6f8fa"><div class="token-line" style="color:#393A34"><span class="token keyword" style="color:#00009f">import</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"> render</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> screen </span><span class="token punctuation" style="color:#393A34">}</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">from</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">&#x27;@testing-library/react-native&#x27;</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block">
</span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token function" style="color:#d73a49">render</span><span class="token punctuation" style="color:#393A34">(</span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag class-name" style="color:#00009f">MyComponent</span><span class="token tag" style="color:#00009f"> </span><span class="token tag punctuation" style="color:#393A34">/&gt;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">const</span><span class="token plain"> element </span><span class="token operator" style="color:#393A34">=</span><span class="token plain"> screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token function" style="color:#d73a49">getByHintText</span><span class="token punctuation" style="color:#393A34">(</span><span class="token string" style="color:#e3116c">&#x27;Plays a song&#x27;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span></div></div></div></div></div><div class="admonition admonition-info alert alert--info"><div class="admonition-heading"><h5><span class="admonition-icon"><svg xmlns="http://www.w3.org/2000/svg" width="14" height="16" viewBox="0 0 14 16"><path fill-rule="evenodd" d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 0 1 1.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"></path></svg></span>info</h5></div><div class="admonition-content"><p>Please consult <a href="https://developer.apple.com/documentation/objectivec/nsobject/1615093-accessibilityhint" target="_blank" rel="noopener noreferrer">Apple guidelines on how <code>accessibilityHint</code> should be used</a>.</p></div></div><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="bya11ystates-byaccessibilitystates"></a><code>ByA11yStates</code>, <code>ByAccessibilityStates</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#bya11ystates-byaccessibilitystates" title="Direct link to heading">#</a></h3><blockquote><p>getByA11yStates, getAllByA11yStates, queryByA11yStates, queryAllByA11yStates
getByAccessibilityStates, getAllByAccessibilityStates, queryByAccessibilityStates, queryAllByAccessibilityStates</p></blockquote><p>Returns a <code>ReactTestInstance</code> with matching <code>accessibilityStates</code> prop.</p><div class="mdxCodeBlock_1XEh"><div class="codeBlockContent_1u-d"><button type="button" aria-label="Copy code to clipboard" class="copyButton_10dd">Copy</button><div tabindex="0" class="prism-code language-jsx codeBlock_3iAC"><div class="codeBlockLines_b7E3" style="color:#393A34;background-color:#f6f8fa"><div class="token-line" style="color:#393A34"><span class="token keyword" style="color:#00009f">import</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"> render</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> screen </span><span class="token punctuation" style="color:#393A34">}</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">from</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">&#x27;@testing-library/react-native&#x27;</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block">
</span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token function" style="color:#d73a49">render</span><span class="token punctuation" style="color:#393A34">(</span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag class-name" style="color:#00009f">MyComponent</span><span class="token tag" style="color:#00009f"> </span><span class="token tag punctuation" style="color:#393A34">/&gt;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">const</span><span class="token plain"> element </span><span class="token operator" style="color:#393A34">=</span><span class="token plain"> screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token function" style="color:#d73a49">getByA11yStates</span><span class="token punctuation" style="color:#393A34">(</span><span class="token punctuation" style="color:#393A34">[</span><span class="token string" style="color:#e3116c">&#x27;checked&#x27;</span><span class="token punctuation" style="color:#393A34">]</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">const</span><span class="token plain"> element2 </span><span class="token operator" style="color:#393A34">=</span><span class="token plain"> screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token function" style="color:#d73a49">getByA11yStates</span><span class="token punctuation" style="color:#393A34">(</span><span class="token string" style="color:#e3116c">&#x27;checked&#x27;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span></div></div></div></div></div><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="byrole"></a><code>ByRole</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#byrole" title="Direct link to heading">#</a></h3><blockquote><p>getByRole, getAllByRole, queryByRole, queryAllByRole, findByRole, findAllByRole</p></blockquote><p>Returns a <code>ReactTestInstance</code> with matching <code>accessibilityRole</code> prop.</p><div class="mdxCodeBlock_1XEh"><div class="codeBlockContent_1u-d"><button type="button" aria-label="Copy code to clipboard" class="copyButton_10dd">Copy</button><div tabindex="0" class="prism-code language-jsx codeBlock_3iAC"><div class="codeBlockLines_b7E3" style="color:#393A34;background-color:#f6f8fa"><div class="token-line" style="color:#393A34"><span class="token keyword" style="color:#00009f">import</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"> render</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> screen </span><span class="token punctuation" style="color:#393A34">}</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">from</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">&#x27;@testing-library/react-native&#x27;</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block">
</span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token function" style="color:#d73a49">render</span><span class="token punctuation" style="color:#393A34">(</span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag class-name" style="color:#00009f">MyComponent</span><span class="token tag" style="color:#00009f"> </span><span class="token tag punctuation" style="color:#393A34">/&gt;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">const</span><span class="token plain"> element </span><span class="token operator" style="color:#393A34">=</span><span class="token plain"> screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token function" style="color:#d73a49">getByRole</span><span class="token punctuation" style="color:#393A34">(</span><span class="token string" style="color:#e3116c">&#x27;button&#x27;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span></div></div></div></div></div><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="bya11ystate-byaccessibilitystate"></a><code>ByA11yState</code>, <code>ByAccessibilityState</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#bya11ystate-byaccessibilitystate" title="Direct link to heading">#</a></h3><blockquote><p>getByA11yState, getAllByA11yState, queryByA11yState, queryAllByA11yState, findByA11yState, findAllByA11yState
getByAccessibilityState, getAllByAccessibilityState, queryByAccessibilityState, queryAllByAccessibilityState, findByAccessibilityState, findAllByAccessibilityState</p></blockquote><p>Returns a <code>ReactTestInstance</code> with matching <code>accessibilityState</code> prop.</p><div class="mdxCodeBlock_1XEh"><div class="codeBlockContent_1u-d"><button type="button" aria-label="Copy code to clipboard" class="copyButton_10dd">Copy</button><div tabindex="0" class="prism-code language-jsx codeBlock_3iAC"><div class="codeBlockLines_b7E3" style="color:#393A34;background-color:#f6f8fa"><div class="token-line" style="color:#393A34"><span class="token keyword" style="color:#00009f">import</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"> render</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> screen </span><span class="token punctuation" style="color:#393A34">}</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">from</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">&#x27;@testing-library/react-native&#x27;</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block">
</span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token function" style="color:#d73a49">render</span><span class="token punctuation" style="color:#393A34">(</span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag class-name" style="color:#00009f">Component</span><span class="token tag" style="color:#00009f"> </span><span class="token tag punctuation" style="color:#393A34">/&gt;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">const</span><span class="token plain"> element </span><span class="token operator" style="color:#393A34">=</span><span class="token plain"> screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token function" style="color:#d73a49">getByA11yState</span><span class="token punctuation" style="color:#393A34">(</span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"> disabled</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token boolean" style="color:#36acaa">true</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">}</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span></div></div></div></div></div><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="bya11value-byaccessibilityvalue"></a><code>ByA11Value</code>, <code>ByAccessibilityValue</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#bya11value-byaccessibilityvalue" title="Direct link to heading">#</a></h3><blockquote><p>getByA11yValue, getAllByA11yValue, queryByA11yValue, queryAllByA11yValue, findByA11yValue, findAllByA11yValue
getByAccessibilityValue, getAllByAccessibilityValue, queryByAccessibilityValue, queryAllByAccessibilityValue, findByAccessibilityValue, findAllByAccessibilityValue</p></blockquote><p>Returns a <code>ReactTestInstance</code> with matching <code>accessibilityValue</code> prop.</p><div class="mdxCodeBlock_1XEh"><div class="codeBlockContent_1u-d"><button type="button" aria-label="Copy code to clipboard" class="copyButton_10dd">Copy</button><div tabindex="0" class="prism-code language-jsx codeBlock_3iAC"><div class="codeBlockLines_b7E3" style="color:#393A34;background-color:#f6f8fa"><div class="token-line" style="color:#393A34"><span class="token keyword" style="color:#00009f">import</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"> render</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> screen </span><span class="token punctuation" style="color:#393A34">}</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">from</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">&#x27;@testing-library/react-native&#x27;</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block">
</span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token function" style="color:#d73a49">render</span><span class="token punctuation" style="color:#393A34">(</span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag class-name" style="color:#00009f">Component</span><span class="token tag" style="color:#00009f"> </span><span class="token tag punctuation" style="color:#393A34">/&gt;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">const</span><span class="token plain"> element </span><span class="token operator" style="color:#393A34">=</span><span class="token plain"> screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token function" style="color:#d73a49">getByA11yValue</span><span class="token punctuation" style="color:#393A34">(</span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"> min</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token number" style="color:#36acaa">40</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">}</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span></div></div></div></div></div><h2><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="textmatch"></a>TextMatch<a aria-hidden="true" tabindex="-1" class="hash-link" href="#textmatch" title="Direct link to heading">#</a></h2><p>Most of the query APIs take a <code>TextMatch</code> as an argument, which means the argument can be either a <em>string</em> or <em>regex</em>.</p><div class="mdxCodeBlock_1XEh"><div class="codeBlockContent_1u-d"><button type="button" aria-label="Copy code to clipboard" class="copyButton_10dd">Copy</button><div tabindex="0" class="prism-code language-typescript codeBlock_3iAC"><div class="codeBlockLines_b7E3" style="color:#393A34;background-color:#f6f8fa"><div class="token-line" style="color:#393A34"><span class="token keyword" style="color:#00009f">type</span><span class="token plain"> </span><span class="token maybe-class-name">TextMatchOptions</span><span class="token plain"> </span><span class="token operator" style="color:#393A34">=</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"> exact</span><span class="token operator" style="color:#393A34">?</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token builtin">boolean</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"> normalizer</span><span class="token operator" style="color:#393A34">?</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">(</span><span class="token parameter">textToNormalize</span><span class="token parameter operator" style="color:#393A34">:</span><span class="token parameter"> string</span><span class="token punctuation" style="color:#393A34">)</span><span class="token plain"> </span><span class="token arrow operator" style="color:#393A34">=&gt;</span><span class="token plain"> </span><span class="token builtin">string</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"> trim</span><span class="token operator" style="color:#393A34">?</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token builtin">boolean</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"> collapseWhitespace</span><span class="token operator" style="color:#393A34">?</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token builtin">boolean</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token punctuation" style="color:#393A34">}</span><span class="token punctuation" style="color:#393A34">;</span></div></div></div></div></div><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="examples"></a>Examples<a aria-hidden="true" tabindex="-1" class="hash-link" href="#examples" title="Direct link to heading">#</a></h3><p>Given the following render:</p><div class="mdxCodeBlock_1XEh"><div class="codeBlockContent_1u-d"><button type="button" aria-label="Copy code to clipboard" class="copyButton_10dd">Copy</button><div tabindex="0" class="prism-code language-jsx codeBlock_3iAC"><div class="codeBlockLines_b7E3" style="color:#393A34;background-color:#f6f8fa"><div class="token-line" style="color:#393A34"><span class="token function" style="color:#d73a49">render</span><span class="token punctuation" style="color:#393A34">(</span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag class-name" style="color:#00009f">Text</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain">Hello World</span><span class="token tag punctuation" style="color:#393A34">&lt;/</span><span class="token tag class-name" style="color:#00009f">Text</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span></div></div></div></div></div><p>Will <strong>find a match</strong>:</p><div class="mdxCodeBlock_1XEh"><div class="codeBlockContent_1u-d"><button type="button" aria-label="Copy code to clipboard" class="copyButton_10dd">Copy</button><div tabindex="0" class="prism-code language-js codeBlock_3iAC"><div class="codeBlockLines_b7E3" style="color:#393A34;background-color:#f6f8fa"><div class="token-line" style="color:#393A34"><span class="token comment" style="color:#999988;font-style:italic">// Matching a string:</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain">screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token method function property-access" style="color:#d73a49">getByText</span><span class="token punctuation" style="color:#393A34">(</span><span class="token string" style="color:#e3116c">&#x27;Hello World&#x27;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// full string match</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain">screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token method function property-access" style="color:#d73a49">getByText</span><span class="token punctuation" style="color:#393A34">(</span><span class="token string" style="color:#e3116c">&#x27;llo Worl&#x27;</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"> exact</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token boolean" style="color:#36acaa">false</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">}</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// substring match</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain">screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token method function property-access" style="color:#d73a49">getByText</span><span class="token punctuation" style="color:#393A34">(</span><span class="token string" style="color:#e3116c">&#x27;hello world&#x27;</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"> exact</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token boolean" style="color:#36acaa">false</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">}</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// ignore case-sensitivity</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block">
</span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic">// Matching a regex:</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain">screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token method function property-access" style="color:#d73a49">getByText</span><span class="token punctuation" style="color:#393A34">(</span><span class="token regex" style="color:#36acaa">/World/</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// substring match</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain">screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token method function property-access" style="color:#d73a49">getByText</span><span class="token punctuation" style="color:#393A34">(</span><span class="token regex" style="color:#36acaa">/world/i</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// substring match, ignore case</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain">screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token method function property-access" style="color:#d73a49">getByText</span><span class="token punctuation" style="color:#393A34">(</span><span class="token regex" style="color:#36acaa">/^hello world$/i</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// full string match, ignore case-sensitivity</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain">screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token method function property-access" style="color:#d73a49">getByText</span><span class="token punctuation" style="color:#393A34">(</span><span class="token regex" style="color:#36acaa">/Hello W?oRlD/i</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// advanced regex</span></div></div></div></div></div><p>Will <strong>NOT find a match</strong></p><div class="mdxCodeBlock_1XEh"><div class="codeBlockContent_1u-d"><button type="button" aria-label="Copy code to clipboard" class="copyButton_10dd">Copy</button><div tabindex="0" class="prism-code language-js codeBlock_3iAC"><div class="codeBlockLines_b7E3" style="color:#393A34;background-color:#f6f8fa"><div class="token-line" style="color:#393A34"><span class="token comment" style="color:#999988;font-style:italic">// substring does not match</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain">screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token method function property-access" style="color:#d73a49">getByText</span><span class="token punctuation" style="color:#393A34">(</span><span class="token string" style="color:#e3116c">&#x27;llo Worl&#x27;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic">// full string does not match</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain">screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token method function property-access" style="color:#d73a49">getByText</span><span class="token punctuation" style="color:#393A34">(</span><span class="token string" style="color:#e3116c">&#x27;Goodbye World&#x27;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block">
</span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic">// case-sensitive regex with different case</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain">screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token method function property-access" style="color:#d73a49">getByText</span><span class="token punctuation" style="color:#393A34">(</span><span class="token regex" style="color:#36acaa">/hello world/</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span></div></div></div></div></div><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="precision"></a>Precision<a aria-hidden="true" tabindex="-1" class="hash-link" href="#precision" title="Direct link to heading">#</a></h3><p>Queries that take a <code>TextMatch</code> also accept an object as the final argument that can contain options that affect the precision of string matching:</p><ul><li><code>exact</code>: Defaults to <code>true</code>; matches full strings, case-sensitive. When false, matches substrings and is not case-sensitive.<ul><li><code>exact</code> has no effect on regex argument.</li><li>In most cases using a <code>regex</code> instead of a string gives you more control over fuzzy matching and should be preferred over <code>{ exact: false }</code>.</li></ul></li><li><code>normalizer</code>: An optional function which overrides normalization behavior. See <a href="#normalization">Normalization</a>.</li></ul><p><code>exact</code> option defaults to <code>true</code> but if you want to search for a text slice or make text matching case-insensitive you can override it. That being said we advise you to use regex in more complex scenarios.</p><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="normalization"></a>Normalization<a aria-hidden="true" tabindex="-1" class="hash-link" href="#normalization" title="Direct link to heading">#</a></h3><p>Before running any matching logic against text, it is automatically normalized. By default, normalization consists of trimming whitespace from the start and end of text, and collapsing multiple adjacent whitespace characters into a single space.</p><p>If you want to prevent that normalization, or provide alternative normalization (e.g. to remove Unicode control characters), you can provide a <code>normalizer</code> function in the options object. This function will be given a string and is expected to return a normalized version of that string.</p><div class="admonition admonition-info alert alert--info"><div class="admonition-heading"><h5><span class="admonition-icon"><svg xmlns="http://www.w3.org/2000/svg" width="14" height="16" viewBox="0 0 14 16"><path fill-rule="evenodd" d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 0 1 1.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"></path></svg></span>info</h5></div><div class="admonition-content"><p>Specifying a value for <code>normalizer</code> replaces the built-in normalization, but you can call <code>getDefaultNormalizer</code> to obtain a built-in normalizer, either to adjust that normalization or to call it from your own normalizer.</p></div></div><p><code>getDefaultNormalizer</code> take options object which allows the selection of behaviour:</p><ul><li><code>trim</code>: Defaults to <code>true</code>. Trims leading and trailing whitespace.</li><li><code>collapseWhitespace</code>: Defaults to <code>true</code>. Collapses inner whitespace (newlines, tabs repeated spaces) into a single space.</li></ul><h4><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="normalization-examples"></a>Normalization Examples<a aria-hidden="true" tabindex="-1" class="hash-link" href="#normalization-examples" title="Direct link to heading">#</a></h4><p>To perform a match against text without trimming:</p><div class="mdxCodeBlock_1XEh"><div class="codeBlockContent_1u-d"><button type="button" aria-label="Copy code to clipboard" class="copyButton_10dd">Copy</button><div tabindex="0" class="prism-code language-typescript codeBlock_3iAC"><div class="codeBlockLines_b7E3" style="color:#393A34;background-color:#f6f8fa"><div class="token-line" style="color:#393A34"><span class="token plain">screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token method function property-access" style="color:#d73a49">getByText</span><span class="token punctuation" style="color:#393A34">(</span><span class="token plain">node</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">&#x27;text&#x27;</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"> normalizer</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token function" style="color:#d73a49">getDefaultNormalizer</span><span class="token punctuation" style="color:#393A34">(</span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"> trim</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token boolean" style="color:#36acaa">false</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">}</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token punctuation" style="color:#393A34">}</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span></div></div></div></div></div><p>To override normalization to remove some Unicode characters whilst keeping some (but not all) of the built-in normalization behavior:</p><div class="mdxCodeBlock_1XEh"><div class="codeBlockContent_1u-d"><button type="button" aria-label="Copy code to clipboard" class="copyButton_10dd">Copy</button><div tabindex="0" class="prism-code language-typescript codeBlock_3iAC"><div class="codeBlockLines_b7E3" style="color:#393A34;background-color:#f6f8fa"><div class="token-line" style="color:#393A34"><span class="token plain">screen</span><span class="token punctuation" style="color:#393A34">.</span><span class="token method function property-access" style="color:#d73a49">getByText</span><span class="token punctuation" style="color:#393A34">(</span><span class="token plain">node</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">&#x27;text&#x27;</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token function-variable function" style="color:#d73a49">normalizer</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">(</span><span class="token parameter">str</span><span class="token punctuation" style="color:#393A34">)</span><span class="token plain"> </span><span class="token arrow operator" style="color:#393A34">=&gt;</span><span class="token plain"> </span><span class="token function" style="color:#d73a49">getDefaultNormalizer</span><span class="token punctuation" style="color:#393A34">(</span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"> trim</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token boolean" style="color:#36acaa">false</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">}</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">(</span><span class="token plain">str</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">.</span><span class="token method function property-access" style="color:#d73a49">replace</span><span class="token punctuation" style="color:#393A34">(</span><span class="token regex" style="color:#36acaa">/[\u200E-\u200F]*/g</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">&#x27;&#x27;</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"></span></div><div class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token punctuation" style="color:#393A34">}</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">;</span></div></div></div></div></div><h2><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="unit-testing-helpers"></a>Unit testing helpers<a aria-hidden="true" tabindex="-1" class="hash-link" href="#unit-testing-helpers" title="Direct link to heading">#</a></h2><blockquote><p>Use sparingly and responsibly, escape hatches here</p></blockquote><p><code>render</code> from <code>@testing-library/react-native</code> exposes additional queries that <strong>should not be used in component integration testing</strong>, but some users (like component library creators) interested in unit testing some components may find helpful.</p><details><summary>Queries helpful in unit testing</summary><p>The interface is the same as for other queries, but we won&#x27;t provide full names so that they&#x27;re harder to find by search engines.</p><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="unsafe_bytype"></a><code>UNSAFE_ByType</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#unsafe_bytype" title="Direct link to heading">#</a></h3><blockquote><p>UNSAFE_getByType, UNSAFE_getAllByType, UNSAFE_queryByType, UNSAFE_queryAllByType</p></blockquote><p>Returns a <code>ReactTestInstance</code> with matching a React component type.</p><div class="admonition admonition-caution alert alert--warning"><div class="admonition-heading"><h5><span class="admonition-icon"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M8.893 1.5c-.183-.31-.52-.5-.887-.5s-.703.19-.886.5L.138 13.499a.98.98 0 0 0 0 1.001c.193.31.53.501.886.501h13.964c.367 0 .704-.19.877-.5a1.03 1.03 0 0 0 .01-1.002L8.893 1.5zm.133 11.497H6.987v-2.003h2.039v2.003zm0-3.004H6.987V5.987h2.039v4.006z"></path></svg></span>caution</h5></div><div class="admonition-content"><p>This method has been marked unsafe, since it requires knowledge about implementation details of the component. Use responsibly.</p></div></div><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="unsafe_byprops"></a><code>UNSAFE_ByProps</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#unsafe_byprops" title="Direct link to heading">#</a></h3><blockquote><p>UNSAFE_getByProps, UNSAFE_getAllByProps, UNSAFE_queryByProps, UNSAFE_queryAllByProps</p></blockquote><p>Returns a <code>ReactTestInstance</code> with matching props object.</p><div class="admonition admonition-caution alert alert--warning"><div class="admonition-heading"><h5><span class="admonition-icon"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M8.893 1.5c-.183-.31-.52-.5-.887-.5s-.703.19-.886.5L.138 13.499a.98.98 0 0 0 0 1.001c.193.31.53.501.886.501h13.964c.367 0 .704-.19.877-.5a1.03 1.03 0 0 0 .01-1.002L8.893 1.5zm.133 11.497H6.987v-2.003h2.039v2.003zm0-3.004H6.987V5.987h2.039v4.006z"></path></svg></span>caution</h5></div><div class="admonition-content"><p>This method has been marked unsafe, since it requires knowledge about implementation details of the component. Use responsibly.</p></div></div></details></div></article><div class="margin-vert--xl"><div class="row"><div class="col"><a href="https://github.com/callstack/react-native-testing-library/blob/main/docs/Queries.md" target="_blank" rel="noreferrer noopener"><svg fill="currentColor" height="1.2em" width="1.2em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 40 40" style="margin-right:0.3em;vertical-align:sub"><g><path d="m34.5 11.7l-3 3.1-6.3-6.3 3.1-3q0.5-0.5 1.2-0.5t1.1 0.5l3.9 3.9q0.5 0.4 0.5 1.1t-0.5 1.2z m-29.5 17.1l18.4-18.5 6.3 6.3-18.4 18.4h-6.3v-6.2z"></path></g></svg>Edit this page</a></div></div></div><div class="margin-vert--lg"><nav class="pagination-nav" aria-label="Blog list page navigation"><div class="pagination-nav__item"><a class="pagination-nav__link" href="/react-native-testing-library/docs/api"><div class="pagination-nav__sublabel">Previous</div><div class="pagination-nav__label">« API</div></a></div><div class="pagination-nav__item pagination-nav__item--next"><a class="pagination-nav__link" href="/react-native-testing-library/docs/migration-v9"><div class="pagination-nav__sublabel">Next</div><div class="pagination-nav__label">Migration to 9.0 »</div></a></div></nav></div></div></div><div class="col col--3"><div class="tableOfContents_3klQ"><ul class="table-of-contents table-of-contents__left-border"><li><a href="#table-of-contents" class="table-of-contents__link">Table of contents:</a></li><li><a href="#variants" class="table-of-contents__link">Variants</a><ul><li><a href="#getby" class="table-of-contents__link">getBy</a></li><li><a href="#getallby" class="table-of-contents__link">getAllBy</a></li><li><a href="#queryby" class="table-of-contents__link">queryBy</a></li><li><a href="#queryallby" class="table-of-contents__link">queryAllBy</a></li><li><a href="#findby" class="table-of-contents__link">findBy</a></li><li><a href="#findallby" class="table-of-contents__link">findAllBy</a></li></ul></li><li><a href="#queries" class="table-of-contents__link">Queries</a><ul><li><a href="#options" class="table-of-contents__link">Options</a></li><li><a href="#bytext" class="table-of-contents__link"><code>ByText</code></a></li><li><a href="#byplaceholdertext" class="table-of-contents__link"><code>ByPlaceholderText</code></a></li><li><a href="#bydisplayvalue" class="table-of-contents__link"><code>ByDisplayValue</code></a></li><li><a href="#bytestid" class="table-of-contents__link"><code>ByTestId</code></a></li><li><a href="#bylabeltext" class="table-of-contents__link"><code>ByLabelText</code></a></li><li><a href="#byhinttext-bya11yhint-byaccessibilityhint" class="table-of-contents__link"><code>ByHintText</code>, <code>ByA11yHint</code>, <code>ByAccessibilityHint</code></a></li><li><a href="#bya11ystates-byaccessibilitystates" class="table-of-contents__link"><code>ByA11yStates</code>, <code>ByAccessibilityStates</code></a></li><li><a href="#byrole" class="table-of-contents__link"><code>ByRole</code></a></li><li><a href="#bya11ystate-byaccessibilitystate" class="table-of-contents__link"><code>ByA11yState</code>, <code>ByAccessibilityState</code></a></li><li><a href="#bya11value-byaccessibilityvalue" class="table-of-contents__link"><code>ByA11Value</code>, <code>ByAccessibilityValue</code></a></li></ul></li><li><a href="#textmatch" class="table-of-contents__link">TextMatch</a><ul><li><a href="#examples" class="table-of-contents__link">Examples</a></li><li><a href="#precision" class="table-of-contents__link">Precision</a></li><li><a href="#normalization" class="table-of-contents__link">Normalization</a></li></ul></li><li><a href="#unit-testing-helpers" class="table-of-contents__link">Unit testing helpers</a><ul><li><a href="#unsafe_bytype" class="table-of-contents__link"><code>UNSAFE_ByType</code></a></li><li><a href="#unsafe_byprops" class="table-of-contents__link"><code>UNSAFE_ByProps</code></a></li></ul></li></ul></div></div></div></div></main></div></div><footer class="footer footer--dark"><div class="container"><div class="row footer__links"><div class="col footer__col"><h4 class="footer__title">Docs</h4><ul class="footer__items"><li class="footer__item"><a class="footer__link-item" href="/react-native-testing-library/docs/getting-started">Getting started</a></li><li class="footer__item"><a class="footer__link-item" href="/react-native-testing-library/docs/api">API</a></li></ul></div><div class="col footer__col"><h4 class="footer__title">Community</h4><ul class="footer__items"><li class="footer__item"><a href="http://stackoverflow.com/questions/tagged/react-native-testing-library" target="_blank" rel="noopener noreferrer" class="footer__link-item">Stack Overflow</a></li><li class="footer__item"><a href="https://discord.gg/QbGezWe" target="_blank" rel="noopener noreferrer" class="footer__link-item">Discord Channel</a></li></ul></div><div class="col footer__col"><h4 class="footer__title">More</h4><ul class="footer__items"><li class="footer__item"><a href="https://github.com/callstack/react-native-testing-library" target="_blank" rel="noopener noreferrer" class="footer__link-item">GitHub</a></li><li class="footer__item"><a href="https://github.com/callstack/react-native-testing-library" target="_blank" rel="noopener noreferrer" class="footer__link-item">Star</a></li></ul></div></div><div class="text--center"><div>Copyright © 2022 Callstack Open Source</div></div></div></footer></div>
<script src="/react-native-testing-library/styles.ee9a6b2e.js"></script>
<script src="/react-native-testing-library/runtime~main.3040f9f0.js"></script>
<script src="/react-native-testing-library/main.f525795a.js"></script>
<script src="/react-native-testing-library/1.53d2eea7.js"></script>
<script src="/react-native-testing-library/2.5a5ca056.js"></script>
<script src="/react-native-testing-library/20.6761354a.js"></script>
<script src="/react-native-testing-library/23.37974b0a.js"></script>
<script src="/react-native-testing-library/e91cf13d.5c3edbf8.js"></script>
<script src="/react-native-testing-library/17896441.df97c5e9.js"></script>
<script src="/react-native-testing-library/7ad239b9.ec5fad6b.js"></script>
</body>
</html>