callstack__react-native-testing-library/static/js/async/9782.4f0472abe1.js

"use strict";(self.rspackChunkwebsite=self.rspackChunkwebsite||[]).push([["9782"],{6469(e,t,n){n.r(t),n.d(t,{default:()=>a});var r=n(4848),s=n(8453);function i(e){let t={a:"a",code:"code",h1:"h1",h2:"h2",li:"li",p:"p",ul:"ul",...(0,s.R)(),...e.components};return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsxs)(t.h1,{id:"faq",children:[(0,r.jsx)(t.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#faq",children:"#"}),"FAQ"]}),"\n",(0,r.jsxs)(t.h2,{id:"can-i-test-the-native-features-of-react-native-apps",children:[(0,r.jsx)(t.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#can-i-test-the-native-features-of-react-native-apps",children:"#"}),"Can I test the native features of React Native apps?"]}),"\n",(0,r.jsx)(t.p,{children:"Short answer: no."}),"\n",(0,r.jsx)(t.p,{children:"React Native Testing Library does not provide an entire React Native runtime since that would require running on a physical device\nor iOS simulator/Android emulator to provision the underlying OS and platform APIs."}),"\n",(0,r.jsxs)(t.p,{children:["Instead of using React Native renderer, it simulates only the JavaScript part of its runtime\nusing ",(0,r.jsx)(t.a,{href:"https://reactjs.org/docs/test-renderer.html",rel:"noopener noreferrer",target:"_blank",children:"React Test Renderer"})," while providing queries\nand event APIs (",(0,r.jsx)(t.a,{href:"/12.x/docs/api/events/user-event.html",children:"User Event"}),", ",(0,r.jsx)(t.a,{href:"/12.x/docs/api/events/fire-event.html",children:"Fire Event"}),") that mimicking certain behaviors from the actual runtime."]}),"\n",(0,r.jsxs)(t.p,{children:["You can learn more about our testing environment ",(0,r.jsx)(t.a,{href:"/12.x/docs/advanced/testing-env.html",children:"here"}),"."]}),"\n",(0,r.jsx)(t.p,{children:"This approach has specific benefits and shortfalls. On the positive side:"}),"\n",(0,r.jsxs)(t.ul,{children:["\n",(0,r.jsx)(t.li,{children:"it allows testing most of the logic of regular React Native apps"}),"\n",(0,r.jsx)(t.li,{children:"it allows running tests on any OS supported by Jest or other test runners, e.g., on CI"}),"\n",(0,r.jsx)(t.li,{children:"it uses much less resources than full runtime simulation"}),"\n",(0,r.jsx)(t.li,{children:"you can use Jest fake timers"}),"\n"]}),"\n",(0,r.jsx)(t.p,{children:"On the negative side:"}),"\n",(0,r.jsxs)(t.ul,{children:["\n",(0,r.jsx)(t.li,{children:"you cannot test native features"}),"\n",(0,r.jsx)(t.li,{children:"it might not perfectly simulate certain JavaScript features, but we are working on it"}),"\n"]}),"\n",(0,r.jsxs)(t.p,{children:["The ",(0,r.jsx)(t.a,{href:"/12.x/docs/api/events/user-event.html",children:"User Event interactions"})," solve some of the simulation issues, as they offer more realistic event handling than the basic ",(0,r.jsx)(t.a,{href:"/12.x/docs/api/events/fire-event.html",children:"Fire Event API"}),"."]}),"\n",(0,r.jsxs)(t.h2,{id:"should-i-usemigrate-to-screen-queries",children:[(0,r.jsx)(t.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#should-i-usemigrate-to-screen-queries",children:"#"}),"Should I use/migrate to ",(0,r.jsx)(t.code,{children:"screen"})," queries?"]}),"\n",(0,r.jsxs)(t.p,{children:["There is no need to migrate existing test code to use ",(0,r.jsx)(t.code,{children:"screen"}),"-bases queries. You can still use\nqueries and other functions returned by ",(0,r.jsx)(t.code,{children:"render"}),". The ",(0,r.jsx)(t.code,{children:"screen"})," object captures the latest ",(0,r.jsx)(t.code,{children:"render"})," result."]}),"\n",(0,r.jsxs)(t.p,{children:["For new code, you are encouraged to use ",(0,r.jsx)(t.code,{children:"screen"})," as there are some good reasons for that, which are described in ",(0,r.jsx)(t.a,{href:"https://kentcdodds.com/blog/common-mistakes-with-react-testing-library#not-using-screen",rel:"noopener noreferrer",target:"_blank",children:"this article"})," by Kent C. Dodds."]}),"\n",(0,r.jsxs)(t.h2,{id:"should-i-usemigrate-to-user-event-interactions",children:[(0,r.jsx)(t.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#should-i-usemigrate-to-user-event-interactions",children:"#"}),"Should I use/migrate to User Event interactions?"]}),"\n",(0,r.jsxs)(t.p,{children:["We encourage you to migrate existing tests to use the ",(0,r.jsx)(t.a,{href:"/12.x/docs/api/events/user-event.html",children:"User Event interactions"}),", which offer more realistic event handling than the basic ",(0,r.jsx)(t.a,{href:"/12.x/docs/api/events/fire-event.html",children:"Fire Event API"}),". Hence, it will provide more confidence in the quality of your code."]})]})}function a(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},{wrapper:t}={...(0,s.R)(),...e.components};return t?(0,r.jsx)(t,{...e,children:(0,r.jsx)(i,{...e})}):i(e)}a.__RSPRESS_PAGE_META={},a.__RSPRESS_PAGE_META["12.x%2Fdocs%2Fguides%2Ffaq.mdx"]={toc:[{id:"can-i-test-the-native-features-of-react-native-apps",text:"Can I test the native features of React Native apps?",depth:2},{id:"should-i-usemigrate-to-screen-queries",text:"Should I use/migrate to `screen` queries?",depth:2},{id:"should-i-usemigrate-to-user-event-interactions",text:"Should I use/migrate to User Event interactions?",depth:2}],title:"FAQ",headingTitle:"FAQ",frontmatter:{}}}}]);