skills/callstack__react-native-testing-library
1
0
Fork 0
mirror of https://github.com/callstack/react-native-testing-library.git synced 2026-09-18 23:09:04 +08:00
Code Issues Packages Projects Releases Wiki Activity
Files
b86816d87b6a47783445bbdb400bb23e9f9984ec
callstack__react-native-tes…/docs/api/misc/render-hook.html
T
github-actions[bot] b86816d87b deploy: 692c55b3ba
2025-01-13 09:24:51 +00:00

86 lines
75 KiB
HTML
Raw Blame History

<!doctype html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="generator" content="Rspress v1.20.1"><title data-rh="true">`renderHook` function - React Native Testing Library</title><meta data-rh="true" name="description" content="Helps you to write better tests with less effort."/><script>{const e=localStorage.getItem("rspress-theme-appearance"),t=window.matchMedia("(prefers-color-scheme: dark)").matches,a=e&&"auto"!==e?"dark"===e:t;document.documentElement.classList.toggle("dark",a),document.documentElement.style.colorScheme=a?"dark":"light"}</script><title>React Native Testing Library</title><meta property="og:url" content="https://callstack.github.io/react-native-testing-library/"><meta property="og:type" content="website"><meta property="og:title" content="React Native Testing Library"><meta property="og:description" content="Helps you to write better tests with less effort."><link rel="icon" href="/react-native-testing-library/owl.png"><script defer="defer" src="/react-native-testing-library/static/js/styles.5953416f.js"></script><script defer="defer" src="/react-native-testing-library/static/js/lib-lodash.d3865399.js"></script><script defer="defer" src="/react-native-testing-library/static/js/lib-polyfill.1311aac4.js"></script><script defer="defer" src="/react-native-testing-library/static/js/lib-react.ab52540d.js"></script><script defer="defer" src="/react-native-testing-library/static/js/lib-router.2cfa7486.js"></script><script defer="defer" src="/react-native-testing-library/static/js/5539.1503e16d.js"></script><script defer="defer" src="/react-native-testing-library/static/js/index.160b18fb.js"></script><link href="/react-native-testing-library/static/font/open-sans.b9e06949.woff2" rel="preload" as="font" crossorigin=""><link href="/react-native-testing-library/static/css/styles.313fd107.css" rel="stylesheet"></head><body ><div id="root"><div><div class="navContainer_f6cde rspress-nav px-6 " style="position:sticky"><div class="container_f6cde flex justify-between items-center h-full"><div class="navBarTitle_f6cde"><a href="/react-native-testing-library/" class="flex items-center w-full h-full text-base font-semibold transition-opacity duration-300 hover:opacity-60"><img src="/react-native-testing-library/img/owl.png" alt="logo" id="logo" class="mr-4 rspress-logo"/><span>React Native Testing Library</span></a></div><div class="flex flex-1 justify-end items-center"><div class="rightNav_f6cde"><div class="flex sm:flex-1 items-center sm:pl-4 sm:pr-2"><div class="rspress-nav-search-button navSearchButton_6e282"><button><svg width="18" height="18" viewBox="0 0 32 32"><path fill="var(--rp-c-gray)" d="m29 27.586-7.552-7.552a11.018 11.018 0 1 0-1.414 1.414L27.586 29ZM4 13a9 9 0 1 1 9 9 9.01 9.01 0 0 1-9-9Z"></path></svg><p class="searchWord_6e282">Search Docs</p><div style="opacity:0"><span></span><span>K</span></div></button></div><div class="mobileNavSearchButton_6e282"><svg width="24" height="24" viewBox="0 0 32 32"><path fill="var(--rp-c-gray)" d="m29 27.586-7.552-7.552a11.018 11.018 0 1 0-1.414 1.414L27.586 29ZM4 13a9 9 0 1 1 9 9 9.01 9.01 0 0 1-9-9Z"></path></svg></div></div><div class="rspress-nav-menu menu h-14"><a class="link_03735 undefined rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/start/intro"><div class="rspress-nav-menu-item singleItem_f6cde activeItem_f6cde text-sm font-medium mx-1.5 px-3 py-2 flex items-center">Docs</div></a><a class="link_03735 undefined rspress-link cursor-pointer" target="" href="/react-native-testing-library/cookbook/index"><div class="rspress-nav-menu-item singleItem_f6cde text-sm font-medium mx-1.5 px-3 py-2 flex items-center">Cookbook</div></a><a href="https://github.com/callstack/react-native-testing-library/tree/main/examples" target="_blank" rel="noopener noreferrer" class="link_03735 undefined rspress-link"><div class="rspress-nav-menu-item singleItem_f6cde text-sm font-medium mx-1.5 px-3 py-2 flex items-center">Examples</div></a></div><div class="flex-center flex-row"><div class="translation menu-item_f6cde flex text-sm font-bold items-center px-3 py-2"><div><div class="relative flex-center h-14"><button class="rspress-nav-menu-group-button flex-center items-center font-medium text-sm text-text-1 hover:text-text-2 transition-colors duration-200"><span class="text-sm font-medium flex" style="margin-right:2px">12.x</span><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M16 22 6 12l1.4-1.4 8.6 8.6 8.6-8.6L26 12z"></path></svg></button><div class="rspress-nav-menu-group-content absolute mx-0.8 transition-opacity duration-300" style="opacity:0;visibility:hidden;right:0;top:52px"><div class="p-3 pr-2 w-full h-full max-h-100vh whitespace-nowrap" style="box-shadow:var(--rp-shadow-3);z-index:100;border:1px solid var(--rp-c-divider-light);border-radius:var(--rp-radius-large);background:var(--rp-c-bg)"><div><div class="rounded-2xl my-1 flex" style="padding:0.4rem 1.5rem 0.4rem 0.75rem"><span class="text-brand">12.x</span></div></div><div><div class="font-medium my-1"><a class="link_03735 undefined rspress-link cursor-pointer" target="" href="/react-native-testing-library/13.x-next/docs/api/misc/render-hook"><div class="rounded-2xl hover:bg-mute" style="padding:0.4rem 1.5rem 0.4rem 0.75rem"><div class="flex"><span>13.x-next</span></div></div></a></div></div></div></div></div></div></div><div class="mx-2"><div class="md:mr-2 rspress-nav-appearance"><div class="p-1 border border-solid border-gray-300 text-gray-400 cursor-pointer rounded-md hover:border-gray-600 hover:text-gray-600 dark:hover:border-gray-200 dark:hover:text-gray-200 transition-all duration-300 w-7 h-7"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" viewBox="0 0 24 24" class="dark:hidden" width="18" height="18" fill="currentColor"><path d="M12 18c-3.3 0-6-2.7-6-6s2.7-6 6-6 6 2.7 6 6-2.7 6-6 6zm0-10c-2.2 0-4 1.8-4 4s1.8 4 4 4 4-1.8 4-4-1.8-4-4-4zM12 4c-.6 0-1-.4-1-1V1c0-.6.4-1 1-1s1 .4 1 1v2c0 .6-.4 1-1 1zM12 24c-.6 0-1-.4-1-1v-2c0-.6.4-1 1-1s1 .4 1 1v2c0 .6-.4 1-1 1zM5.6 6.6c-.3 0-.5-.1-.7-.3L3.5 4.9c-.4-.4-.4-1 0-1.4s1-.4 1.4 0l1.4 1.4c.4.4.4 1 0 1.4-.1.2-.4.3-.7.3zM19.8 20.8c-.3 0-.5-.1-.7-.3l-1.4-1.4c-.4-.4-.4-1 0-1.4s1-.4 1.4 0l1.4 1.4c.4.4.4 1 0 1.4-.2.2-.5.3-.7.3zM3 13H1c-.6 0-1-.4-1-1s.4-1 1-1h2c.6 0 1 .4 1 1s-.4 1-1 1zM23 13h-2c-.6 0-1-.4-1-1s.4-1 1-1h2c.6 0 1 .4 1 1s-.4 1-1 1zM4.2 20.8c-.3 0-.5-.1-.7-.3-.4-.4-.4-1 0-1.4l1.4-1.4c.4-.4 1-.4 1.4 0s.4 1 0 1.4l-1.4 1.4c-.2.2-.4.3-.7.3zM18.4 6.6c-.3 0-.5-.1-.7-.3-.4-.4-.4-1 0-1.4l1.4-1.4c.4-.4 1-.4 1.4 0s.4 1 0 1.4l-1.4 1.4c-.2.2-.5.3-.7.3z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" viewBox="0 0 24 24" class="hidden dark:block" width="18" height="18" fill="currentColor"><path d="M12.1 22h-.9c-5.5-.5-9.5-5.4-9-10.9.4-4.8 4.2-8.6 9-9 .4 0 .8.2 1 .5.2.3.2.8-.1 1.1-2 2.7-1.4 6.4 1.3 8.4 2.1 1.6 5 1.6 7.1 0 .3-.2.7-.3 1.1-.1.3.2.5.6.5 1-.2 2.7-1.5 5.1-3.6 6.8-1.9 1.4-4.1 2.2-6.4 2.2zM9.3 4.4c-2.9 1-5 3.6-5.2 6.8-.4 4.4 2.8 8.3 7.2 8.7 2.1.2 4.2-.4 5.8-1.8 1.1-.9 1.9-2.1 2.4-3.4-2.5.9-5.3.5-7.5-1.1-2.8-2.2-3.9-5.9-2.7-9.2z"></path></svg></div></div></div><div class="social-links menu-item_93d67 flex-center relative"><div class="flex-center h-full gap-x-4 transition-colors duration-300 md:mr-2"><a href="https://github.com/callstack/react-native-testing-library" target="_blank" rel="noopener noreferrer" class="social-links"><div class="social-links-icon_93d67"><svg role="img" viewBox="0 0 24 24" width="24" height="24" xmlns="http://www.w3.org/2000/svg"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></div></a></div></div></div></div><div class="mobileNavMenu_f6cde"><div class="navScreen_457e8 " id="navScreen"><div class="container_457e8"><div class="navMenu_457e8"><div class="navMenuItem_457e8 w-full"><a class="link_03735 undefined rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/start/intro"><div class="rspress-nav-menu-item singleItem_f6cde activeItem_f6cde text-sm font-medium mx-1.5 px-3 py-2 flex items-center">Docs</div></a></div><div class="navMenuItem_457e8 w-full"><a class="link_03735 undefined rspress-link cursor-pointer" target="" href="/react-native-testing-library/cookbook/index"><div class="rspress-nav-menu-item singleItem_f6cde text-sm font-medium mx-1.5 px-3 py-2 flex items-center">Cookbook</div></a></div><div class="navMenuItem_457e8 w-full"><a href="https://github.com/callstack/react-native-testing-library/tree/main/examples" target="_blank" rel="noopener noreferrer" class="link_03735 undefined rspress-link"><div class="rspress-nav-menu-item singleItem_f6cde text-sm font-medium mx-1.5 px-3 py-2 flex items-center">Examples</div></a></div></div><div class="flex-center flex-col gap-2"><div class="mt-2 navAppearance_457e8 flex justify-center"></div><div class="undefined flex text-sm font-bold justify-center"><div class="mx-1.5 my-1"><div class=" navScreenMenuGroup_457e8 relative"><button class="button_457e8"><span class="buttonSpan_457e8">12.x</span><svg width="1em" height="1em" viewBox="0 0 32 32" class=" down_457e8 "><path fill="currentColor" d="M16 22 6 12l1.4-1.4 8.6 8.6 8.6-8.6L26 12z"></path></svg></button><div><div class="items_457e8"><div><div class="p-1 text-center"><span class="text-brand">12.x</span></div></div><div><div class="py-1 font-medium"><a class="link_03735 undefined rspress-link cursor-pointer" target="" href="/react-native-testing-library/13.x-next/docs/api/misc/render-hook"><div><div class="flex justify-center"><span>13.x-next</span></div></div></a></div></div></div></div></div></div></div><div class="social-links menu-item_93d67 flex-center relative"><div class="flex-center h-full gap-x-4 transition-colors duration-300 md:mr-2"><a href="https://github.com/callstack/react-native-testing-library" target="_blank" rel="noopener noreferrer" class="social-links"><div class="social-links-icon_93d67"><svg role="img" viewBox="0 0 24 24" width="24" height="24" xmlns="http://www.w3.org/2000/svg"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></div></a></div></div></div></div></div><button aria-label="mobile hamburger" class=" navHamburger_e7b06 text-gray-500"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="currentColor"><circle cx="8" cy="16" r="2" fill="currentColor"></circle><circle cx="16" cy="16" r="2" fill="currentColor"></circle><circle cx="24" cy="16" r="2" fill="currentColor"></circle></svg></button></div></div></div></div><section><div class="docLayout_edeb4 pt-0"><div class="rspress-sidebar-menu"><button class="flex-center mr-auto"><div class="text-md mr-2"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M4 6h24v2H4zm0 18h24v2H4zm0-12h24v2H4zm0 6h24v2H4z"></path></svg></div><span class="text-sm">Menu</span></button><button class="flex-center ml-auto"><span class="text-sm">Contents</span><div class="text-md mr-2" style="transform:rotate(0deg);transition:transform 0.2s ease-out;margin-top:2px"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></button></div><aside class="sidebar_71eca rspress-sidebar "><div class="sidebarContainer_71eca"><div class="navTitleMask_71eca"><div class="navBarTitle_f6cde"><a href="/react-native-testing-library/" class="flex items-center w-full h-full text-base font-semibold transition-opacity duration-300 hover:opacity-60"><img src="/react-native-testing-library/img/owl.png" alt="logo" id="logo" class="mr-4 rspress-logo"/><span>React Native Testing Library</span></a></div></div><div class="mt-1 sidebarContent_71eca"><div class="rspress-scrollbar" style="max-height:calc(100vh - var(--rp-nav-height) - 8px);overflow:auto"><nav class="pb-2"><section class="mt-0.5 block" style="margin-left:0"><div class="flex justify-between items-center menuItem_71eca" style="border-radius:0 var(--rp-radius) var(--rp-radius) 0;cursor:pointer"><h2 class="py-2 px-3 text-sm font-medium flex" style="font-size:14px;padding-left:24px;font-weight:bold"><span class="flex-center">Getting started</span></h2><div class="collapseContainer_71eca p-2 rounded-xl"><div style="cursor:pointer;transition:transform 0.2s ease-out;transform:rotate(90deg)"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></div></div><div class="transition-all duration-300 ease-in-out" style="overflow:hidden"><div class="rspress-sidebar-group transition-opacity duration-500 ease-in-out" style="opacity:1;margin-left:12px"><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/start/intro"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Introduction</span></div></a></div><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/start/quick-start"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Quick Start</span></div></a></div></div></div></section><section class="mt-0.5 block" style="margin-left:0"><div class="flex justify-between items-center menuItem_71eca" style="border-radius:0 var(--rp-radius) var(--rp-radius) 0;cursor:pointer"><h2 class="py-2 px-3 text-sm font-medium flex" style="font-size:14px;padding-left:24px;font-weight:bold"><span class="flex-center">API reference</span></h2><div class="collapseContainer_71eca p-2 rounded-xl"><div style="cursor:pointer;transition:transform 0.2s ease-out;transform:rotate(90deg)"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></div></div><div class="transition-all duration-300 ease-in-out" style="overflow:hidden"><div class="rspress-sidebar-group transition-opacity duration-500 ease-in-out" style="opacity:1;margin-left:12px"><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/api/render"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Render function</span></div></a></div><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/api/screen"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Screen object</span></div></a></div><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/api/queries"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Queries</span></div></a></div><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/api/jest-matchers"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Jest matchers</span></div></a></div><div><section class="mt-0.5 block" style="margin-left:18px"><div class="flex justify-between items-center menuItem_71eca" style="cursor:pointer"><h2 class="py-2 px-3 text-sm font-medium flex"><span class="flex-center">Triggering events</span></h2><div class="collapseContainer_71eca p-2 rounded-xl"><div style="cursor:pointer;transition:transform 0.2s ease-out;transform:rotate(90deg)"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></div></div><div class="transition-all duration-300 ease-in-out" style="overflow:hidden"><div class="rspress-sidebar-group transition-opacity duration-500 ease-in-out" style="opacity:1;margin-left:0"><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/api/events/user-event"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>User Event</span></div></a></div><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/api/events/fire-event"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Fire Event</span></div></a></div></div></div></section></div><div><section class="mt-0.5 block" style="margin-left:18px"><div class="flex justify-between items-center menuItem_71eca" style="cursor:pointer"><h2 class="py-2 px-3 text-sm font-medium flex"><span class="flex-center">Miscellaneous</span></h2><div class="collapseContainer_71eca p-2 rounded-xl"><div style="cursor:pointer;transition:transform 0.2s ease-out;transform:rotate(90deg)"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></div></div><div class="transition-all duration-300 ease-in-out" style="overflow:hidden"><div class="rspress-sidebar-group transition-opacity duration-500 ease-in-out" style="opacity:1;margin-left:0"><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/api/misc/render-hook"><div class="menuItemActive_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Render Hook function</span></div></a></div><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/api/misc/async"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Async utilities</span></div></a></div><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/api/misc/config"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Configuration</span></div></a></div><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/api/misc/accessibility"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Accessibility</span></div></a></div><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/api/misc/other"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Other helpers</span></div></a></div></div></div></section></div></div></div></section><section class="mt-0.5 block" style="margin-left:0"><div class="flex justify-between items-center menuItem_71eca" style="border-radius:0 var(--rp-radius) var(--rp-radius) 0;cursor:pointer"><h2 class="py-2 px-3 text-sm font-medium flex" style="font-size:14px;padding-left:24px;font-weight:bold"><span class="flex-center">Guides</span></h2><div class="collapseContainer_71eca p-2 rounded-xl"><div style="cursor:pointer;transition:transform 0.2s ease-out;transform:rotate(90deg)"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></div></div><div class="transition-all duration-300 ease-in-out" style="overflow:hidden"><div class="rspress-sidebar-group transition-opacity duration-500 ease-in-out" style="opacity:1;margin-left:12px"><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/guides/how-to-query"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>How should I query?</span></div></a></div><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/guides/troubleshooting"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Troubleshooting</span></div></a></div><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/guides/faq"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>FAQ</span></div></a></div><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/guides/community-resources"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Community resources</span></div></a></div></div></div></section><section class="mt-0.5 block" style="margin-left:0"><div class="flex justify-between items-center menuItem_71eca" style="border-radius:0 var(--rp-radius) var(--rp-radius) 0;cursor:pointer"><h2 class="py-2 px-3 text-sm font-medium flex" style="font-size:14px;padding-left:24px;font-weight:bold"><span class="flex-center">Advanced Guides</span></h2><div class="collapseContainer_71eca p-2 rounded-xl"><div style="cursor:pointer;transition:transform 0.2s ease-out;transform:rotate(90deg)"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></div></div><div class="transition-all duration-300 ease-in-out" style="overflow:hidden"><div class="rspress-sidebar-group transition-opacity duration-500 ease-in-out" style="opacity:1;margin-left:12px"><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/advanced/testing-env"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Testing environment</span></div></a></div><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/advanced/understanding-act"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Understanding <code>act</code> function</span></div></a></div></div></div></section><section class="mt-0.5 block" style="margin-left:0"><div class="flex justify-between items-center menuItem_71eca" style="border-radius:0 var(--rp-radius) var(--rp-radius) 0;cursor:pointer"><h2 class="py-2 px-3 text-sm font-medium flex" style="font-size:14px;padding-left:24px;font-weight:bold"><span class="flex-center">Migration Guides</span></h2><div class="collapseContainer_71eca p-2 rounded-xl"><div style="cursor:pointer;transition:transform 0.2s ease-out;transform:rotate(0deg)"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></div></div><div class="transition-all duration-300 ease-in-out" style="overflow:hidden;max-height:0"><div class="rspress-sidebar-group transition-opacity duration-500 ease-in-out" style="opacity:0;margin-left:12px"><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/migration/v12"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Migration to 12.x</span></div></a></div><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/migration/jest-matchers"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Migration to built-in Jest matchers</span></div></a></div><div><section class="mt-0.5 block" style="margin-left:18px"><div class="flex justify-between items-center menuItem_71eca" style="cursor:pointer"><h2 class="py-2 px-3 text-sm font-medium flex"><span class="flex-center">Previous versions</span></h2><div class="collapseContainer_71eca p-2 rounded-xl"><div style="cursor:pointer;transition:transform 0.2s ease-out;transform:rotate(0deg)"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></div></div><div class="transition-all duration-300 ease-in-out" style="overflow:hidden;max-height:0"><div class="rspress-sidebar-group transition-opacity duration-500 ease-in-out" style="opacity:0;margin-left:0"><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/migration/previous/v11"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Migration to 11.x</span></div></a></div><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/migration/previous/v9"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Migration to 9.x</span></div></a></div><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/migration/previous/v7"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Migration to 7.x</span></div></a></div><div><a class="link_03735 menuLink_71eca rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/migration/previous/v2"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Migration to 2.x</span></div></a></div></div></div></section></div></div></div></section></nav></div></div></div></aside><div class="content_edeb4 rspress-doc-container flex flex-shrink-0 mx-auto"><div class="w-full flex-1"><div><div class="rspress-doc"><!--$--><h1 id="renderhook-function" class="text-3xl mb-10 leading-10 tracking-tight title_3b154"><code>renderHook</code> function<a class="link_3b154 header-anchor" aria-hidden="true" href="#renderhook-function">#</a></h1>
<div class="language-ts"><div class="rspress-code-content rspress-scrollbar"><div><pre class="code" style="background-color:inherit"><code class="language-ts" style="white-space:pre"><span style="display:block;padding:0 1.25rem"><span class="token" style="color:var(--code-token-keyword)">function</span><span> </span><span class="token generic-function" style="color:var(--code-token-function)">renderHook</span><span class="token generic-function generic class-name operator">&lt;</span><span class="token generic-function generic class-name">Result</span><span class="token generic-function generic class-name" style="color:var(--code-token-punctuation)">,</span><span class="token generic-function generic class-name"> Props</span><span class="token generic-function generic class-name operator">&gt;</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token function-variable" style="color:var(--code-token-function)">callback</span><span class="token operator">:</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">(</span><span>props</span><span class="token operator">?</span><span class="token operator">:</span><span> Props</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token operator">=&gt;</span><span> Result</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> options</span><span class="token operator">?</span><span class="token operator">:</span><span> RenderHookOptions</span><span class="token operator">&lt;</span><span>Props</span><span class="token operator">&gt;</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span></span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token operator">:</span><span> RenderHookResult</span><span class="token operator">&lt;</span><span>Result</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span> Props</span><span class="token operator">&gt;</span><span class="token" style="color:var(--code-token-punctuation)">;</span></span></code></pre></div><div class="code-button-group_15153"><button><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrapped_15153"><path fill="#22a041" d="M21 5H3v2h18zM3 19h7v-2H3zm0-6h15c1 0 2 .43 2 2s-1 2-2 2h-2v-2l-4 3 4 3v-2h2c2.95 0 4-1.27 4-4 0-2.72-1-4-4-4H3z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrap_15153"><path fill="currentColor" d="M16 7H3V5h13v2M3 19h13v-2H3v2m19-7-4-3v2H3v2h15v2l4-3Z"></path></svg></button><button class="code-copy-button_15153"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 30 30" class="icon-copy_15153"><path fill="currentColor" d="M28 10v18H10V10h18m0-2H10a2 2 0 0 0-2 2v18a2 2 0 0 0 2 2h18a2 2 0 0 0 2-2V10a2 2 0 0 0-2-2Z"></path><path fill="currentColor" d="M4 18H2V4a2 2 0 0 1 2-2h14v2H4Z"></path></svg><svg width="32" height="32" viewBox="0 0 30 30" class="icon-success_15153"><path fill="#49cd37" d="m13 24-9-9 1.414-1.414L13 21.171 26.586 7.586 28 9 13 24z"></path></svg></button></div></div></div>
<p class="my-4 leading-7">Renders a test component that will call the provided <code>callback</code>, including any hooks it calls, every time it renders. Returns <a href="#renderhookresult" class="link_3b154 "><code>RenderHookResult</code></a> object, which you can interact with.</p>
<div class="language-ts"><div class="rspress-code-content rspress-scrollbar"><div><pre class="code" style="background-color:inherit"><code class="language-ts" style="white-space:pre"><span style="display:block;padding:0 1.25rem"><span class="token" style="color:var(--code-token-keyword)">import</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span> renderHook </span><span class="token" style="color:var(--code-token-punctuation)">}</span><span> </span><span class="token" style="color:var(--code-token-keyword)">from</span><span> </span><span class="token" style="color:var(--code-token-string)">&#x27;@testing-library/react-native&#x27;</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span></span><span class="token" style="color:var(--code-token-keyword)">import</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span> useCount </span><span class="token" style="color:var(--code-token-punctuation)">}</span><span> </span><span class="token" style="color:var(--code-token-keyword)">from</span><span> </span><span class="token" style="color:var(--code-token-string)">&#x27;../useCount&#x27;</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem">
</span><span style="display:block;padding:0 1.25rem"><span></span><span class="token" style="color:var(--code-token-function)">it</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-string)">&#x27;should increment count&#x27;</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token operator">=&gt;</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-keyword)">const</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span> result </span><span class="token" style="color:var(--code-token-punctuation)">}</span><span> </span><span class="token operator">=</span><span> </span><span class="token" style="color:var(--code-token-function)">renderHook</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token operator">=&gt;</span><span> </span><span class="token" style="color:var(--code-token-function)">useCount</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem">
</span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-function)">expect</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span>result</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span>current</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span>count</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span class="token" style="color:var(--code-token-function)">toBe</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token number">0</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-function)">act</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token operator">=&gt;</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-comment)">// Note that you should wrap the calls to functions your hook returns with `act` if they trigger an update of your hook&#x27;s state to ensure pending useEffects are run before your next assertion.</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> result</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span>current</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span class="token" style="color:var(--code-token-function)">increment</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-punctuation)">}</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-function)">expect</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span>result</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span>current</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span>count</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span class="token" style="color:var(--code-token-function)">toBe</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token number">1</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span></span><span class="token" style="color:var(--code-token-punctuation)">}</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span></span></code></pre></div><div class="code-button-group_15153"><button><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrapped_15153"><path fill="#22a041" d="M21 5H3v2h18zM3 19h7v-2H3zm0-6h15c1 0 2 .43 2 2s-1 2-2 2h-2v-2l-4 3 4 3v-2h2c2.95 0 4-1.27 4-4 0-2.72-1-4-4-4H3z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrap_15153"><path fill="currentColor" d="M16 7H3V5h13v2M3 19h13v-2H3v2m19-7-4-3v2H3v2h15v2l4-3Z"></path></svg></button><button class="code-copy-button_15153"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 30 30" class="icon-copy_15153"><path fill="currentColor" d="M28 10v18H10V10h18m0-2H10a2 2 0 0 0-2 2v18a2 2 0 0 0 2 2h18a2 2 0 0 0 2-2V10a2 2 0 0 0-2-2Z"></path><path fill="currentColor" d="M4 18H2V4a2 2 0 0 1 2-2h14v2H4Z"></path></svg><svg width="32" height="32" viewBox="0 0 30 30" class="icon-success_15153"><path fill="#49cd37" d="m13 24-9-9 1.414-1.414L13 21.171 26.586 7.586 28 9 13 24z"></path></svg></button></div></div></div>
<div class="language-ts"><div class="rspress-code-content rspress-scrollbar"><div><pre class="code" style="background-color:inherit"><code class="language-ts" style="white-space:pre"><span style="display:block;padding:0 1.25rem"><span class="token" style="color:var(--code-token-comment)">// useCount.js</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span></span><span class="token" style="color:var(--code-token-keyword)">export</span><span> </span><span class="token" style="color:var(--code-token-keyword)">const</span><span> </span><span class="token function-variable" style="color:var(--code-token-function)">useCount</span><span> </span><span class="token operator">=</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token operator">=&gt;</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-keyword)">const</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">[</span><span>count</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span> setCount</span><span class="token" style="color:var(--code-token-punctuation)">]</span><span> </span><span class="token operator">=</span><span> </span><span class="token" style="color:var(--code-token-function)">useState</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token number">0</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-keyword)">const</span><span> </span><span class="token function-variable" style="color:var(--code-token-function)">increment</span><span> </span><span class="token operator">=</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token operator">=&gt;</span><span> </span><span class="token" style="color:var(--code-token-function)">setCount</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span>previousCount</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token operator">=&gt;</span><span> previousCount </span><span class="token operator">+</span><span> </span><span class="token number">1</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem">
</span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-keyword)">return</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span> count</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span> increment </span><span class="token" style="color:var(--code-token-punctuation)">}</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span></span><span class="token" style="color:var(--code-token-punctuation)">}</span><span class="token" style="color:var(--code-token-punctuation)">;</span></span></code></pre></div><div class="code-button-group_15153"><button><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrapped_15153"><path fill="#22a041" d="M21 5H3v2h18zM3 19h7v-2H3zm0-6h15c1 0 2 .43 2 2s-1 2-2 2h-2v-2l-4 3 4 3v-2h2c2.95 0 4-1.27 4-4 0-2.72-1-4-4-4H3z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrap_15153"><path fill="currentColor" d="M16 7H3V5h13v2M3 19h13v-2H3v2m19-7-4-3v2H3v2h15v2l4-3Z"></path></svg></button><button class="code-copy-button_15153"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 30 30" class="icon-copy_15153"><path fill="currentColor" d="M28 10v18H10V10h18m0-2H10a2 2 0 0 0-2 2v18a2 2 0 0 0 2 2h18a2 2 0 0 0 2-2V10a2 2 0 0 0-2-2Z"></path><path fill="currentColor" d="M4 18H2V4a2 2 0 0 1 2-2h14v2H4Z"></path></svg><svg width="32" height="32" viewBox="0 0 30 30" class="icon-success_15153"><path fill="#49cd37" d="m13 24-9-9 1.414-1.414L13 21.171 26.586 7.586 28 9 13 24z"></path></svg></button></div></div></div>
<p class="my-4 leading-7">The <code>renderHook</code> function accepts the following arguments:</p>
<p class="my-4 leading-7">Callback is a function that is called each <code>render</code> of the test component. This function should call one or more hooks for testing.</p>
<p class="my-4 leading-7">The <code>props</code> passed into the callback will be the <code>initialProps</code> provided in the <code>options</code> to <code>renderHook</code>, unless new props are provided by a subsequent <code>rerender</code> call.</p>
<h2 id="options" class="mt-12 mb-6 pt-8 text-2xl tracking-tight border-t-[1px] border-divider-light title_3b154"><code>options</code><a class="link_3b154 header-anchor" aria-hidden="true" href="#options">#</a></h2>
<p class="my-4 leading-7">A <code>RenderHookOptions&lt;Props&gt;</code> object to modify the execution of the <code>callback</code> function, containing the following properties:</p>
<h3 id="initialprops" class="mt-10 mb-2 leading-7 text-xl title_3b154"><code>initialProps</code><a class="link_3b154 header-anchor" aria-hidden="true" href="#initialprops">#</a></h3>
<p class="my-4 leading-7">The initial values to pass as <code>props</code> to the <code>callback</code> function of <code>renderHook</code>. The <code>Props</code> type is determined by the type passed to or inferred by the <code>renderHook</code> call.</p>
<h3 id="wrapper" class="mt-10 mb-2 leading-7 text-xl title_3b154"><code>wrapper</code><a class="link_3b154 header-anchor" aria-hidden="true" href="#wrapper">#</a></h3>
<p class="my-4 leading-7">A React component to wrap the test component in when rendering. This is usually used to add context providers from <code>React.createContext</code> for the hook to access with <code>useContext</code>.</p>
<h2 id="renderhookresult" class="mt-12 mb-6 pt-8 text-2xl tracking-tight border-t-[1px] border-divider-light title_3b154"><code>RenderHookResult</code><a class="link_3b154 header-anchor" aria-hidden="true" href="#renderhookresult">#</a></h2>
<div class="language-ts"><div class="rspress-code-content rspress-scrollbar"><div><pre class="code" style="background-color:inherit"><code class="language-ts" style="white-space:pre"><span style="display:block;padding:0 1.25rem"><span class="token" style="color:var(--code-token-keyword)">interface</span><span> </span><span class="token class-name">RenderHookResult</span><span class="token class-name operator">&lt;</span><span class="token class-name">Result</span><span class="token class-name" style="color:var(--code-token-punctuation)">,</span><span class="token class-name"> Props</span><span class="token class-name operator">&gt;</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> result</span><span class="token operator">:</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span> current</span><span class="token operator">:</span><span> Result </span><span class="token" style="color:var(--code-token-punctuation)">}</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token function-variable" style="color:var(--code-token-function)">rerender</span><span class="token operator">:</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">(</span><span>props</span><span class="token operator">:</span><span> Props</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token operator">=&gt;</span><span> </span><span class="token" style="color:var(--code-token-keyword)">void</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token function-variable" style="color:var(--code-token-function)">unmount</span><span class="token operator">:</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token operator">=&gt;</span><span> </span><span class="token" style="color:var(--code-token-keyword)">void</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span></span><span class="token" style="color:var(--code-token-punctuation)">}</span></span></code></pre></div><div class="code-button-group_15153"><button><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrapped_15153"><path fill="#22a041" d="M21 5H3v2h18zM3 19h7v-2H3zm0-6h15c1 0 2 .43 2 2s-1 2-2 2h-2v-2l-4 3 4 3v-2h2c2.95 0 4-1.27 4-4 0-2.72-1-4-4-4H3z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrap_15153"><path fill="currentColor" d="M16 7H3V5h13v2M3 19h13v-2H3v2m19-7-4-3v2H3v2h15v2l4-3Z"></path></svg></button><button class="code-copy-button_15153"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 30 30" class="icon-copy_15153"><path fill="currentColor" d="M28 10v18H10V10h18m0-2H10a2 2 0 0 0-2 2v18a2 2 0 0 0 2 2h18a2 2 0 0 0 2-2V10a2 2 0 0 0-2-2Z"></path><path fill="currentColor" d="M4 18H2V4a2 2 0 0 1 2-2h14v2H4Z"></path></svg><svg width="32" height="32" viewBox="0 0 30 30" class="icon-success_15153"><path fill="#49cd37" d="m13 24-9-9 1.414-1.414L13 21.171 26.586 7.586 28 9 13 24z"></path></svg></button></div></div></div>
<p class="my-4 leading-7">The <code>renderHook</code> function returns an object that has the following properties:</p>
<h3 id="result" class="mt-10 mb-2 leading-7 text-xl title_3b154"><code>result</code><a class="link_3b154 header-anchor" aria-hidden="true" href="#result">#</a></h3>
<p class="my-4 leading-7">The <code>current</code> value of the <code>result</code> will reflect the latest of whatever is returned from the <code>callback</code> passed to <code>renderHook</code>. The <code>Result</code> type is determined by the type passed to or inferred by the <code>renderHook</code> call.</p>
<h3 id="rerender" class="mt-10 mb-2 leading-7 text-xl title_3b154"><code>rerender</code><a class="link_3b154 header-anchor" aria-hidden="true" href="#rerender">#</a></h3>
<p class="my-4 leading-7">A function to rerender the test component, causing any hooks to be recalculated. If <code>newProps</code> are passed, they will replace the <code>callback</code> function&#x27;s <code>initialProps</code> for subsequent rerenders. The <code>Props</code> type is determined by the type passed to or inferred by the <code>renderHook</code> call.</p>
<h3 id="unmount" class="mt-10 mb-2 leading-7 text-xl title_3b154"><code>unmount</code><a class="link_3b154 header-anchor" aria-hidden="true" href="#unmount">#</a></h3>
<p class="my-4 leading-7">A function to unmount the test component. This is commonly used to trigger cleanup effects for <code>useEffect</code> hooks.</p>
<h2 id="examples" class="mt-12 mb-6 pt-8 text-2xl tracking-tight border-t-[1px] border-divider-light title_3b154">Examples<a class="link_3b154 header-anchor" aria-hidden="true" href="#examples">#</a></h2>
<p class="my-4 leading-7">Here we present some extra examples of using <code>renderHook</code> API.</p>
<h3 id="with-initialprops" class="mt-10 mb-2 leading-7 text-xl title_3b154">With <code>initialProps</code><a class="link_3b154 header-anchor" aria-hidden="true" href="#with-initialprops">#</a></h3>
<div class="language-ts"><div class="rspress-code-content rspress-scrollbar"><div><pre class="code" style="background-color:inherit"><code class="language-ts" style="white-space:pre"><span style="display:block;padding:0 1.25rem"><span class="token" style="color:var(--code-token-keyword)">const</span><span> </span><span class="token function-variable" style="color:var(--code-token-function)">useCount</span><span> </span><span class="token operator">=</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">(</span><span>initialCount</span><span class="token operator">:</span><span> </span><span class="token" style="color:var(--code-token-symbol)">number</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token operator">=&gt;</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-keyword)">const</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">[</span><span>count</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span> setCount</span><span class="token" style="color:var(--code-token-punctuation)">]</span><span> </span><span class="token operator">=</span><span> </span><span class="token" style="color:var(--code-token-function)">useState</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span>initialCount</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-keyword)">const</span><span> </span><span class="token function-variable" style="color:var(--code-token-function)">increment</span><span> </span><span class="token operator">=</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token operator">=&gt;</span><span> </span><span class="token" style="color:var(--code-token-function)">setCount</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span>previousCount</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token operator">=&gt;</span><span> previousCount </span><span class="token operator">+</span><span> </span><span class="token number">1</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem">
</span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-function)">useEffect</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token operator">=&gt;</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-function)">setCount</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span>initialCount</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-punctuation)">}</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">[</span><span>initialCount</span><span class="token" style="color:var(--code-token-punctuation)">]</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem">
</span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-keyword)">return</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span> count</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span> increment </span><span class="token" style="color:var(--code-token-punctuation)">}</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span></span><span class="token" style="color:var(--code-token-punctuation)">}</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem">
</span><span style="display:block;padding:0 1.25rem"><span></span><span class="token" style="color:var(--code-token-function)">it</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-string)">&#x27;should increment count&#x27;</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token operator">=&gt;</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-keyword)">const</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span> result</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span> rerender </span><span class="token" style="color:var(--code-token-punctuation)">}</span><span> </span><span class="token operator">=</span><span> </span><span class="token" style="color:var(--code-token-function)">renderHook</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span>initialCount</span><span class="token operator">:</span><span> </span><span class="token" style="color:var(--code-token-symbol)">number</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token operator">=&gt;</span><span> </span><span class="token" style="color:var(--code-token-function)">useCount</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span>initialCount</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> initialProps</span><span class="token operator">:</span><span> </span><span class="token number">1</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-punctuation)">}</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem">
</span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-function)">expect</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span>result</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span>current</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span>count</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span class="token" style="color:var(--code-token-function)">toBe</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token number">1</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem">
</span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-function)">act</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token operator">=&gt;</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> result</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span>current</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span class="token" style="color:var(--code-token-function)">increment</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-punctuation)">}</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem">
</span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-function)">expect</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span>result</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span>current</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span>count</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span class="token" style="color:var(--code-token-function)">toBe</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token number">2</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-function)">rerender</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token number">5</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-function)">expect</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span>result</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span>current</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span>count</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span class="token" style="color:var(--code-token-function)">toBe</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token number">5</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span></span><span class="token" style="color:var(--code-token-punctuation)">}</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span></span></code></pre></div><div class="code-button-group_15153"><button><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrapped_15153"><path fill="#22a041" d="M21 5H3v2h18zM3 19h7v-2H3zm0-6h15c1 0 2 .43 2 2s-1 2-2 2h-2v-2l-4 3 4 3v-2h2c2.95 0 4-1.27 4-4 0-2.72-1-4-4-4H3z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrap_15153"><path fill="currentColor" d="M16 7H3V5h13v2M3 19h13v-2H3v2m19-7-4-3v2H3v2h15v2l4-3Z"></path></svg></button><button class="code-copy-button_15153"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 30 30" class="icon-copy_15153"><path fill="currentColor" d="M28 10v18H10V10h18m0-2H10a2 2 0 0 0-2 2v18a2 2 0 0 0 2 2h18a2 2 0 0 0 2-2V10a2 2 0 0 0-2-2Z"></path><path fill="currentColor" d="M4 18H2V4a2 2 0 0 1 2-2h14v2H4Z"></path></svg><svg width="32" height="32" viewBox="0 0 30 30" class="icon-success_15153"><path fill="#49cd37" d="m13 24-9-9 1.414-1.414L13 21.171 26.586 7.586 28 9 13 24z"></path></svg></button></div></div></div>
<h3 id="with-wrapper" class="mt-10 mb-2 leading-7 text-xl title_3b154">With <code>wrapper</code><a class="link_3b154 header-anchor" aria-hidden="true" href="#with-wrapper">#</a></h3>
<div class="language-tsx"><div class="rspress-code-content rspress-scrollbar"><div><pre class="code" style="background-color:inherit"><code class="language-tsx" style="white-space:pre"><span style="display:block;padding:0 1.25rem"><span class="token" style="color:var(--code-token-function)">it</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-string)">&#x27;should use context value&#x27;</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token operator">=&gt;</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-keyword)">function</span><span> </span><span class="token" style="color:var(--code-token-function)">Wrapper</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">{</span><span> children </span><span class="token" style="color:var(--code-token-punctuation)">}</span><span class="token operator">:</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span> children</span><span class="token operator">:</span><span> ReactNode </span><span class="token" style="color:var(--code-token-punctuation)">}</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-keyword)">return</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">&lt;</span><span class="token class-name" style="color:var(--code-token-function)">Context.Provider</span><span class="token" style="color:var(--code-token-function)"> </span><span class="token" style="color:var(--code-token-symbol)">value</span><span class="token attr-equals" style="color:var(--code-token-punctuation)">=</span><span class="token" style="color:var(--code-token-punctuation)">&quot;</span><span class="token" style="color:var(--code-token-string-expression)">provided</span><span class="token" style="color:var(--code-token-punctuation)">&quot;</span><span class="token" style="color:var(--code-token-punctuation)">&gt;</span><span class="token" style="color:var(--code-token-punctuation)">{</span><span>children</span><span class="token" style="color:var(--code-token-punctuation)">}</span><span class="token" style="color:var(--code-token-punctuation)">&lt;/</span><span class="token class-name" style="color:var(--code-token-function)">Context.Provider</span><span class="token" style="color:var(--code-token-punctuation)">&gt;</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-punctuation)">}</span><span>
</span></span><span style="display:block;padding:0 1.25rem">
</span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-keyword)">const</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span> result </span><span class="token" style="color:var(--code-token-punctuation)">}</span><span> </span><span class="token operator">=</span><span> </span><span class="token" style="color:var(--code-token-function)">renderHook</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token operator">=&gt;</span><span> </span><span class="token" style="color:var(--code-token-function)">useHook</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span> wrapper</span><span class="token operator">:</span><span> Wrapper </span><span class="token" style="color:var(--code-token-punctuation)">}</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-comment)">// ...</span><span>
</span></span><span style="display:block;padding:0 1.25rem"><span></span><span class="token" style="color:var(--code-token-punctuation)">}</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span></span></code></pre></div><div class="code-button-group_15153"><button><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrapped_15153"><path fill="#22a041" d="M21 5H3v2h18zM3 19h7v-2H3zm0-6h15c1 0 2 .43 2 2s-1 2-2 2h-2v-2l-4 3 4 3v-2h2c2.95 0 4-1.27 4-4 0-2.72-1-4-4-4H3z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrap_15153"><path fill="currentColor" d="M16 7H3V5h13v2M3 19h13v-2H3v2m19-7-4-3v2H3v2h15v2l4-3Z"></path></svg></button><button class="code-copy-button_15153"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 30 30" class="icon-copy_15153"><path fill="currentColor" d="M28 10v18H10V10h18m0-2H10a2 2 0 0 0-2 2v18a2 2 0 0 0 2 2h18a2 2 0 0 0 2-2V10a2 2 0 0 0-2-2Z"></path><path fill="currentColor" d="M4 18H2V4a2 2 0 0 1 2-2h14v2H4Z"></path></svg><svg width="32" height="32" viewBox="0 0 30 30" class="icon-success_15153"><path fill="#49cd37" d="m13 24-9-9 1.414-1.414L13 21.171 26.586 7.586 28 9 13 24z"></path></svg></button></div></div></div><!--/$--></div><div class="rspress-doc-footer"><footer class="mt-8"><div class="xs:flex pb-5 px-2 justify-end items-center"></div><div class="flex flex-col"></div><div class="flex flex-col sm:flex-row sm:justify-around gap-4 pt-6"><div class="prev_e7091 flex flex-col"><a class="link_03735 pager-link_9b9a7 rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/api/events/fire-event"><span class="desc_9b9a7">Previous Page</span><span class="title_9b9a7">Fire Event</span></a></div><div class="next_e7091 flex flex-col"><a class="link_03735 pager-link_9b9a7 next_9b9a7 rspress-link cursor-pointer" target="" href="/react-native-testing-library/docs/api/misc/async"><span class="desc_9b9a7">Next page</span><span class="title_9b9a7">Async utilities</span></a></div></div></footer></div></div></div><div class="aside-container_edeb4"><div><div class="flex flex-col"><div class="&lt;lg:hidden"><div id="aside-container" class="relative text-sm font-medium"><div class="leading-7 block text-sm font-semibold pl-3">Contents</div><nav class="mt-1"><ul class="relative"><li><a href="#options" title="options" class="aside-link transition-all duration-300 hover:text-text-1 text-text-2 block" style="padding-left:0;font-weight:semibold"><span class="aside-link-text block"><code>options</code></span></a></li><li><a href="#initialprops" title="initialProps" class="aside-link transition-all duration-300 hover:text-text-1 text-text-2 block" style="padding-left:12px;font-weight:semibold"><span class="aside-link-text block"><code>initialProps</code></span></a></li><li><a href="#wrapper" title="wrapper" class="aside-link transition-all duration-300 hover:text-text-1 text-text-2 block" style="padding-left:12px;font-weight:semibold"><span class="aside-link-text block"><code>wrapper</code></span></a></li><li><a href="#renderhookresult" title="RenderHookResult" class="aside-link transition-all duration-300 hover:text-text-1 text-text-2 block" style="padding-left:0;font-weight:semibold"><span class="aside-link-text block"><code>RenderHookResult</code></span></a></li><li><a href="#result" title="result" class="aside-link transition-all duration-300 hover:text-text-1 text-text-2 block" style="padding-left:12px;font-weight:semibold"><span class="aside-link-text block"><code>result</code></span></a></li><li><a href="#rerender" title="rerender" class="aside-link transition-all duration-300 hover:text-text-1 text-text-2 block" style="padding-left:12px;font-weight:semibold"><span class="aside-link-text block"><code>rerender</code></span></a></li><li><a href="#unmount" title="unmount" class="aside-link transition-all duration-300 hover:text-text-1 text-text-2 block" style="padding-left:12px;font-weight:semibold"><span class="aside-link-text block"><code>unmount</code></span></a></li><li><a href="#examples" title="Examples" class="aside-link transition-all duration-300 hover:text-text-1 text-text-2 block" style="padding-left:0;font-weight:semibold"><span class="aside-link-text block">Examples</span></a></li><li><a href="#with-initialprops" title="With initialProps" class="aside-link transition-all duration-300 hover:text-text-1 text-text-2 block" style="padding-left:12px;font-weight:semibold"><span class="aside-link-text block">With <code>initialProps</code></span></a></li><li><a href="#with-wrapper" title="With wrapper" class="aside-link transition-all duration-300 hover:text-text-1 text-text-2 block" style="padding-left:12px;font-weight:semibold"><span class="aside-link-text block">With <code>wrapper</code></span></a></li></ul></nav></div></div></div></div></div></div></div></section></div></div><div id="search-container"></div></body></html>
Reference in New Issue View Git Blame Copy Permalink