I have a React component that returns its children to be rendered by React if the prop isTrue is truth-y. If its prop isTrue is false-y, then the component returns null, and React doesn't render an...

I have two ant design date pickers in a component. I am trying to change and test the value of date picker but not able to find the calendar input in the test environment dom. Date Pickers Compone...

My react component renders a <script> tag using nextJS Head. When trying to query the element with testing-libary's getByTestId method and I get the message below: TestingLibraryElementError:...

Here is my custom hook: export function useClientRect() { const [scrollH, setScrollH] = useState(0); const [clientH, setClientH] = useState(0); const ref = useCallback(node => { if (node !...

I want to test if a sidebar that I have created for navigation works or not, this is a simple example of what I have made <ul> <li><Link to="/location1">location 1</...

I'm trying to simulate the scrolling in a element contained in a div, which is the one passed to render function. I'm trying with something like this, but it seems that the div is not scrolling as...

i want to get the div element within parent element with some test-id what i am trying to do? I have a parent div with test-id "parent-2" and it has a div element within it that has text Remove. ...

I’m unclear on how to mock my api response when using the following setup. I have the following test: import React from 'react'; import { cleanup, render, wait } from '@testing-library/react'; impo...

I'm trying to test my component if it displays the right value in my h1. Below is my component that will be tested. const Title = () => { return ( <> <h1 aria-label='Title of the pr...

I would like to add React Testing Library to a project that uses mocha and chai for unit tests. I am a bit stumped when it comes to writing assertions, most examples make use of jest and jest...

I am using Next.JS 13, and have a component which is using import { cookies } from 'next/headers'; The simplified component: import { cookies } from 'next/headers'; function Simple() { console.l...

There are multiple ways of getting an element's text content: getByText vs findByText vs queryByText. Sometimes I get confused about which one to use. I have the following example in react-native: ...

trying to run the first test with redux-toolkit rtk query and got error that api is undefined. What I did wrong? ● Test suite failed to run TypeError: Cannot read property 'injectEndpoints' of u...

I have an element with an onClick handler which may be disabled by adding pointer-events: none to parent (parent disables children click). Now I want to test that my child is not clickable, how can...

I have a <UserProvider /> component that provides context which has a login method in its value. In my test I want to check if that method has been called. How can I check to make sure this m...

Im having a problem with a query, I'm trying to get two radio inputs, I don't have any problem with one of them, but with the other one React Testing Library thrown an error: It Found multiple elem...

What is the best way to test the value of an <input> element in dom-testing-library/react-testing-library? The approach I've taken is to fetch the raw input element itself via the closest() m...

I have an svg inside a React component that renders conditionally. <div className='avatar'> {gender === true ? <MaleAvatar /> : <FemaleAvatar />} </div> MaleAvatar and Fe...

I'm trying to test a Slider component created with Material-UI, but I cannot get my tests to pass. I would like test the the value changes using the fireEvent with @testing-library/react. I've been...

I have a normal select list. I need to test handleChoice gets called when I choose an option. How can I do this with React Testing Library? <select onChange={handleChoice} data-testid="selec...

I need some help understanding how one can test an application using React Context. Here's my sample setup. context.js import React from 'react' export const AppContext = React.createContext() ...

After updating to React 18 or creating a new React 18 app from create-react-app, when I run the yarn test command, it gives a console.error as a Warning for each of the render methods used in any o...

I am trying to test a workflow with a React app. When all fields are filled within a workflow step, the user is able to click the "next" button. This action registers a state in a reducer...

Testing library react does not catch 'toHaveStyle'. When I clicked on the 'Content', its children which have a blue color were changed to the red color. However, in my test, they always have the bl...

I am hoping to get some expert advice and guidance from the React Testing Library community on the best way to ensure a Material UI ripple animation has been completed prior to taking a snapshot. T...