callstack__react-native-testing-library/static/js/async/2184.e84c7edf97.js

"use strict";(self.rspackChunkwebsite=self.rspackChunkwebsite||[]).push([["2184"],{2139(e,s,n){n.r(s),n.d(s,{default:()=>t});var r=n(4848),i=n(8453);function o(e){let s={a:"a",code:"code",h1:"h1",h2:"h2",h3:"h3",p:"p",pre:"pre",span:"span",...(0,i.R)(),...e.components};return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsxs)(s.h1,{id:"migration-to-11x",children:[(0,r.jsx)(s.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#migration-to-11x",children:"#"}),"Migration to 11.x"]}),"\n",(0,r.jsx)(s.p,{children:"Migration to React Native Testing Library version 11 from version 9.x or 10.x should be a relatively easy task due small amount of breaking changes."}),"\n",(0,r.jsxs)(s.h2,{id:"breaking-changes",children:[(0,r.jsx)(s.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#breaking-changes",children:"#"}),"Breaking changes"]}),"\n",(0,r.jsxs)(s.h3,{id:"update-to-jest-28-if-you-use-fake-timers",children:[(0,r.jsx)(s.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#update-to-jest-28-if-you-use-fake-timers",children:"#"}),"Update to Jest 28 if you use fake timers"]}),"\n",(0,r.jsxs)(s.p,{children:["If you use fake timers in any of your tests you should update your Jest dependencies to version 28. This is due to the fact that ",(0,r.jsxs)(s.a,{href:"https://jestjs.io/docs/jest-object#jestusefaketimersfaketimersconfig",rel:"noopener noreferrer",target:"_blank",children:[(0,r.jsx)(s.code,{children:"jest.useFakeTimers()"})," config structure"]})," has changed."]}),"\n",(0,r.jsxs)(s.h3,{id:"refactor-legacy-waitforoptions-position",children:[(0,r.jsx)(s.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#refactor-legacy-waitforoptions-position",children:"#"}),"Refactor legacy ",(0,r.jsx)(s.code,{children:"waitForOptions"})," position"]}),"\n",(0,r.jsxs)(s.p,{children:["In version 9 we introducted query ",(0,r.jsx)(s.code,{children:"options"})," parameters for each query type. This affected all ",(0,r.jsx)(s.code,{children:"findBy"})," and ",(0,r.jsx)(s.code,{children:"findAllBy"})," queries because their signatures changed e.g. from:"]}),"\n",(0,r.jsx)(r.Fragment,{children:(0,r.jsx)(s.pre,{className:"shiki css-variables",style:{backgroundColor:"var(--shiki-background)",color:"var(--shiki-foreground)"},tabIndex:"0",lang:"ts",children:(0,r.jsxs)(s.code,{children:[(0,r.jsxs)(s.span,{className:"line",children:[(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:"function"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-function)"},children:" findByText"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"(text"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:":"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-function)"},children:" TextMatch"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-punctuation)"},children:","}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:" waitForOptions"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:"?:"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-function)"},children:" WaitForOptions"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:");"})]}),"\n",(0,r.jsxs)(s.span,{className:"line",children:[(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:"function"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-function)"},children:" findAllByText"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"(text"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:":"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-function)"},children:" TextMatch"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-punctuation)"},children:","}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:" waitForOptions"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:"?:"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-function)"},children:" WaitForOptions"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:");"})]})]})})}),"\n",(0,r.jsx)(s.p,{children:"to"}),"\n",(0,r.jsx)(r.Fragment,{children:(0,r.jsx)(s.pre,{className:"shiki css-variables",style:{backgroundColor:"var(--shiki-background)",color:"var(--shiki-foreground)"},tabIndex:"0",lang:"ts",children:(0,r.jsxs)(s.code,{children:[(0,r.jsxs)(s.span,{className:"line",children:[(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:"function"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-function)"},children:" findByText"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"(text"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:":"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-function)"},children:" TextMatch"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-punctuation)"},children:","}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:" options"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:"?:"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-function)"},children:" TextMatchOptions"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-punctuation)"},children:","}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:" waitForOptions"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:"?:"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-function)"},children:" WaitForOptions"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:");"})]}),"\n",(0,r.jsxs)(s.span,{className:"line",children:[(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:"function"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-function)"},children:" findAllByText"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"("})]}),"\n",(0,r.jsxs)(s.span,{className:"line",children:[(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"  text"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:":"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-function)"},children:" TextMatch"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-punctuation)"},children:","})]}),"\n",(0,r.jsxs)(s.span,{className:"line",children:[(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"  options"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:"?:"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-function)"},children:" TextMatchOptions"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-punctuation)"},children:","})]}),"\n",(0,r.jsxs)(s.span,{className:"line",children:[(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"  waitForOptions"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:"?:"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-function)"},children:" WaitForOptions"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-punctuation)"},children:","})]}),"\n",(0,r.jsx)(s.span,{className:"line",children:(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:");"})})]})})}),"\n",(0,r.jsxs)(s.p,{children:["In order to facilitate transition, in version 9 and 10, we provided a temporary possibility to pass ",(0,r.jsx)(s.code,{children:"WaitForOptions"})," like ",(0,r.jsx)(s.code,{children:"timeout"}),", ",(0,r.jsx)(s.code,{children:"interval"}),", etc inside ",(0,r.jsx)(s.code,{children:"options"})," argument. From this release we require passing these as the proper third parameter."]}),"\n",(0,r.jsx)(s.p,{children:"This change is easy to implement:"}),"\n",(0,r.jsx)(r.Fragment,{children:(0,r.jsx)(s.pre,{className:"shiki css-variables",style:{backgroundColor:"var(--shiki-background)",color:"var(--shiki-foreground)"},tabIndex:"0",lang:"ts",children:(0,r.jsx)(s.code,{children:(0,r.jsxs)(s.span,{className:"line",children:[(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-function)"},children:"findByText"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"("}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-string-expression)"},children:"/Text/"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-punctuation)"},children:","}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:" { timeout"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:":"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-constant)"},children:" 1000"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:" });"})]})})})}),"\n",(0,r.jsx)(s.p,{children:"should become"}),"\n",(0,r.jsx)(r.Fragment,{children:(0,r.jsx)(s.pre,{className:"shiki css-variables",style:{backgroundColor:"var(--shiki-background)",color:"var(--shiki-foreground)"},tabIndex:"0",lang:"ts",children:(0,r.jsx)(s.code,{children:(0,r.jsxs)(s.span,{className:"line",children:[(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-function)"},children:"findByText"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:"("}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-string-expression)"},children:"/Text/"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-punctuation)"},children:","}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:" {}"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-punctuation)"},children:","}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:" { timeout"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-keyword)"},children:":"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-token-constant)"},children:" 1000"}),(0,r.jsx)(s.span,{style:{color:"var(--shiki-foreground)"},children:" });"})]})})})}),"\n",(0,r.jsxs)(s.h3,{id:"triggering-non-touch-events-on-targets-with-pointereventsbox-none-prop",children:[(0,r.jsx)(s.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#triggering-non-touch-events-on-targets-with-pointereventsbox-none-prop",children:"#"}),"Triggering non-touch events on targets with ",(0,r.jsx)(s.code,{children:'pointerEvents="box-none"'})," prop"]}),"\n",(0,r.jsxs)(s.p,{children:["Up to version 10, RNTL disables all events for a target with ",(0,r.jsx)(s.code,{children:'pointerEvents="box-none"'}),". This behavior is counter to how React Native itself functions."]}),"\n",(0,r.jsxs)(s.p,{children:["From version 11, RNTL continues to disable ",(0,r.jsx)(s.code,{children:"press"})," event for these targets but allows triggering other events, e.g. ",(0,r.jsx)(s.code,{children:"layout"}),"."]}),"\n",(0,r.jsxs)(s.h2,{id:"full-changelog",children:[(0,r.jsx)(s.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#full-changelog",children:"#"}),"Full Changelog"]}),"\n",(0,r.jsx)(s.p,{children:(0,r.jsx)(s.a,{href:"https://github.com/callstack/react-native-testing-library/compare/v10.1.1...v11.0.0",rel:"noopener noreferrer",target:"_blank",children:"https://github.com/callstack/react-native-testing-library/compare/v10.1.1...v11.0.0"})})]})}function t(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},{wrapper:s}={...(0,i.R)(),...e.components};return s?(0,r.jsx)(s,{...e,children:(0,r.jsx)(o,{...e})}):o(e)}t.__RSPRESS_PAGE_META={},t.__RSPRESS_PAGE_META["13.x%2Fdocs%2Fmigration%2Fprevious%2Fv11.mdx"]={toc:[{id:"breaking-changes",text:"Breaking changes",depth:2},{id:"update-to-jest-28-if-you-use-fake-timers",text:"Update to Jest 28 if you use fake timers",depth:3},{id:"refactor-legacy-waitforoptions-position",text:"Refactor legacy `waitForOptions` position",depth:3},{id:"triggering-non-touch-events-on-targets-with-pointereventsbox-none-prop",text:'Triggering non-touch events on targets with `pointerEvents="box-none"` prop',depth:3},{id:"full-changelog",text:"Full Changelog",depth:2}],title:"Migration to 11.x",headingTitle:"Migration to 11.x",frontmatter:{}}}}]);