Stack Overflow
Stack Overflow

Questions tagged [react-native-testing-library]

The react-native-testing-library is a lightweight solution for testing your React Native components. It provides light utility functions on top of react-test-renderer letting you always be up to date with latest React features and write any component tests you like.

The react-native-testing-library is a lightweight solution for testing your React Native components. It provides light utility functions on top of react-test-renderer letting you always be up to date with latest React features and write any component tests you like.

This library is a replacement for Enzyme. It is tested to work with Jest, but it should work with other test runners as well.

https://github.com/callstack/react-native-testing-library

177 questions
0
votes
1 answer

NativeBase showing error while using in Jest testing

I want to test a basic component name TitleHeader which uses HStack and VStack from native base. The component:- import {Center, HStack, VStack} from 'native-base'; import React from 'react'; import {View, Text} from 'react-native'; import appColors…
Rahul Thakur
  • 25
  • 1
  • 8
0
votes
2 answers

React Native Testing Library shows a warning for using `waitFor`

I have this test with Jest and react-native-testing-library it('submits form on submit button press', async () => { const onSubmit = jest.fn(); const values = { username: 'jack' }; const { getByRole } = render(
Ahmed Mahmoud
  • 148
  • 1
  • 6
0
votes
1 answer

React & React Native Testing Library wait for async state update caused by useEffect on mount

I can't seem to get this simple test to work in react-testing-library & react-native-testing-library. I've tried various combinations of wrapping the render function in act, or using waitFor and other async utils, but the test never waits for the…
conor909
  • 1,475
  • 14
  • 29
0
votes
1 answer

Why does Jest sometimes prints "pretty" error messages with line pointers, and sometimes not?

I have jest 27 installed, and I see that sometimes I get pretty error messages like this (with visual pointer to the failing line): And sometimes it prints the errors like this (plain error, without pointer): I am trying to understand why it…
niryo
  • 1,275
  • 4
  • 15
  • 26
0
votes
1 answer

react native typescript screen test returning Test suite failed to run AsyncStorage is null

I am experiencing difficulty writing tests for react-native typescript screen using instructions from the URL below https://react-native-async-storage.github.io/async-storage/docs/advanced/jest/ I keep getting the below error FAIL …
MIike Eps
  • 421
  • 7
  • 24
0
votes
2 answers

React-Navigation V6 Drawer.Item drawerItemStyle: { display: "none" } still renders DrawerItem in react-test-renderer

I am trying to write a test where Drawer item goes from invisible to visible. The way I am implementing the visibility switch is by toggling the drawerItemStyle prop on the Drawer item from display: "none" to display: "flex". This works in an…
Joey Gough
  • 2,753
  • 2
  • 21
  • 42
0
votes
0 answers

Passing props while using React Native Testing and TypeScript

Hey I am trying to implement the react-native-testing-library for a project which is also using TypeScript. My question involves the best way to pass props to my tests. For example if my src/example.tsx is: import React from 'react'; import {…
lil_dippa
  • 147
  • 1
  • 11
0
votes
1 answer

how to test component with setState hook inside async api call in useEffect(func, [])

I'm facing a problem unit-testing a component with react-native-testing-library. I have a component like this: // components/TestComponent.js function TestComponent() { const [data, setData] = useState(); useEffect(() => { …
gretchelin
  • 1
  • 2
0
votes
1 answer

Enzyme element.props() in react native testing library

I need to refactor all enzyme unit test to react native testing library. In Enzyme, to get the props of the children elements I can use some thing like : ((rootElement.props() as Props).prop).toBe(value). The prop() function returns the props hash…
Michael
  • 429
  • 5
  • 22
0
votes
0 answers

React-Native Testing Library/Jest:Cannot read property 'TouchableOpacity'

im doing some testing using jest and react-native testing, the problem is the TouchableOpacity is not recognized and cause errors Card.test.js import Card from "../Card" import React from 'react'; import { TouchableOpacity } from…
Martin Cavanagh
  • 1
  • 3
0
votes
0 answers

how to test react-native-qrcode-scanner with @testing-library/react-native and jest

I have used this qr scanner in my application but I'm having trouble doing unit testing on the qr scanner. how to do unit testing on this qr scanner? should i mock that or there is a way to send values to onRead props? before, I have tried to mock…
JURAGAN_GANTENG
  • 1
  • 3
0
votes
0 answers

React Native Testing Library get by access role

I am really newReact Native Testing Library. My app basically works like this: it fetched the data and display on my to my as Text format, I used jsonplace holder api. This is app-demo. I have have created one Text where I define test role="header".…
Krisna
  • 2,854
  • 2
  • 24
  • 66
0
votes
0 answers

why @testing-library/react-native render do not respect !== undefined/ !==null if clause?

I am writing a test using @testing-library/react-native to render my component and test the event onPress when the user press on a flatlist element. I have a list with a couple of elements, however, during its execution, it changes its value to…
sperardt
  • 11
  • 1
  • 4
0
votes
2 answers

How to use styled-components theme with react-native testing-library

I've got a simple component: import React, { FunctionComponent } from 'react'; import { ViewStyle, StyleProp, StyleSheet } from 'react-native'; import { RoundedCardBackground, } from './index'; type RoundedCardProps = { style?:…
pbrune
  • 348
  • 1
  • 17
0
votes
1 answer

react-native-testing-library how to getByText when using react-intl FromattedMessage?

getByText method by react-native-testing-library doesn't seem to find text when it's inside react-intl's const messages = { SOME_KEY: 'some key' } const { getByText } = render(
Nir Ben-Yair
  • 1,566
  • 3
  • 14
  • 18
1 2 3
…
11
12