Questions tagged [react-testing-library]

Questions about testing React components with the react-testing-library utility.

React Testing Library is a lightweight library for testing components. This library is built on top of Testing Library, which can be used for a number of other frontend libraries/frameworks, such as , , and more.

Guiding Principle

The more your tests resemble the way your software is used, the more confidence they can give you.

The library tests on DOM Nodes, primarily using JSDOM/Jest rather than instances of React components

3635 questions
1
vote
1 answer

Testing hooks which throw errors

The [deprecated?] react-hooks-testing-library would return any errors thrown by the hook under test. Probably my misunderstanding, but it looks like implementation now in the main @testing-library/react lost this feature? Here's what I'm…
1
vote
0 answers

How do you test top-level await?

Simple top-level await. and testing throwing ReferenceError: await is not defined const { Select } = await import('shell/Select'); render() { return Test: const input = screen.getByRole('textbox', { name: /duration/i, }); When I set the input type to…
Abaga
  • 451
  • 1
  • 8
  • 18
1
vote
1 answer

Testing error boundary using react test Library / Jest :

I am trying to write test for my error boundary hoc. But when I mock throwing error in my wrapped component my test gets fail because of the same error I throw, like it seems like it doesnt recognize that this error was intended for testing. I am…
1
vote
0 answers

Is there a way to mock the state in react for unit testing without using enzyme

I've been using jest and have been reading through the @testing-library/react docs but so far found nothing relating to mocking state in react. I know mocking state in react is possible with enzyme. But I'm using react 18 and there is no…
arp
  • 331
  • 4
  • 11
1
vote
2 answers

Dom does is not updated while testing redirection with react-testing library and react-router v6

I'm trying to test the redirection page when the user clicks on the button (I don't want to user jest.mock()). I created the wrapper according to test-react-library documentation: import { FC, ReactElement, ReactNode } from "react"; import { render,…
Slim
  • 5,527
  • 13
  • 45
  • 81
1
vote
1 answer

react-testing-library: Verify text truncation

I have a component "Label" which has rudimentary truncation support: import "./styles.css"; export default function Label(props) { const className = props.truncate ? "truncate" : ""; return
Jonathan.Brink
  • 23,757
  • 20
  • 73
  • 115
1
vote
1 answer

Jest function fails to fire after network request in react component

Full Repo https://github.com/brianbancroft/sample-testing-msw-sb-jest-rtl Using mock service worker (msw) to respond to a network request, I have a React login component. On submit it sends a network request and on success it is supposed to trigger…
brianbancroft
  • 463
  • 3
  • 17
1
vote
2 answers

React Testing library - simulate iFrame onLoad

I have a component that renders iFrame inside of it. I want to test iFrame's onLoad functionality but it doesn't triggers simply with the testing library's render function. Can I programmatically simulate iFrame's onLoad event with testing library.
Cagri Uysal
  • 255
  • 3
  • 11
1
vote
1 answer

Is it necessary to call unmount after each test cases in react testing libarary?

describe('', () => { it('should show tooltip text', async () => { const { container, unmount } = render() userEvent.hover(container.querySelector('svg')) await…
Henok Tesfaye
  • 8,287
  • 13
  • 47
  • 84
1
vote
0 answers

Multiple Warnings when testing a component with React Testing Library and Jest

I am new in the testing world and I have spent days trying to figure out how to unit test a signup screen in React Native (with Expo) using React Testing Library. When i run my script to run the tests npm run test I get an endless list of warnings…
1
vote
1 answer

How to simulate window.location change with react-testing-library

I'm migrating from enzyme to react-testing-library. I have a component called that just checks if window.location has changed since the last component update and scrolls to the top if it has. ScrollToTop.jsx import React from…
rg_
  • 401
  • 1
  • 4
  • 19
1
vote
1 answer

React Testing Library clears hash after click on tag

In our single-page application, switching between pages is realized with window.location.hash. And I found a problem in React Testing Library unit-tests - triggering click on tag clears window.location.hash. For example, when I am on the "Info"…
Yoskutik
  • 1,859
  • 2
  • 17
  • 43
1
vote
1 answer

TypeError: Cannot read property 'disabled' of null in react-testing-library

I am using react testing library to test my login pages. I was done with the testing of should all fields must be empty initially The next thing was i need to check when someone type a wrong email it shows an error Email is invalid which will gives…
1 2 3
99
100