Category "react-testing-library"

How to mock react custom hook returned value?

Here is my custom hook: export function useClientRect() { const [scrollH, setScrollH] = useState(0); const [clientH, setClientH] = useState(0); c

How to mock and check that a function from a library in Jest framework?

I have a button with "Download" text on it defined in ReactJS code. Now, I want to write a unit test to check that this function is getting called when this but

How to mock a single value in a React Context provider while keeping the rest of values

Hi I have a context provider which returns like this: return ( <RepeatsSidebarContext.Provider value={{ loading,

Testing a Next.js app with a custom /pages/_app.js in React-Testing-Library

I'm attempting to follow this guide in Reat-Testing-Library documentation to wrap all the components I want to test. I'm doing this because I need access to the

React Testing Library: how to use screen in this case instead of container

in react testing library, as per the conventions, it is better to use screen than to destructure the methods from render. I have a component, where I need to te

mock function error in react-testing-library

Hii Everyone I am new to react testing ,I am trying to do some example for practise , I am getting a Error,Need your help , this is my App Component const[fi

Spy on a function inside functional component using React testing library

I'm trying to spy on a function inside a function component using react testing library. I wanted to test whether handleClick function has been called whenever

How to test if a component is rendered with the right props when using react-testing-library?

I have some components that are rendering another component (FetchNextPageButton) that is already tested in isolation, like these ones: const News = () => (

Consider using the "jsdom" test environment

I have this simple test: import React from 'react' import { render } from '@testing-library/react' import Button from '.' describe('Button', () => { it('

Error running tests - jest.mock is not a function

I am trying to run tests using Jest, however I am getting this error: jest.mock is not a function What am I doing wrong? Here's my CodeSandbox: https://co

Whats the difference between toBeInTheDocument and getBy* in @testing-library/react

Is there a difference between expect(screen.queryByText('<something>')).toBeInTheDocument(); And screen.getByText('<something>'); (The specific ge

Mock Service Worker returns empty

I'm new to react testing library. I am trying to test a simple component that call some apis and then it fills inputs with the data of these apis. But when I ru

Mock Service Worker returns empty

I'm new to react testing library. I am trying to test a simple component that call some apis and then it fills inputs with the data of these apis. But when I ru

How to test a required input field with React Testing Library and Jest?

I tried to test a required input field with React Testing Library and Jest by testing the existence of the popover, but I failed. I tried several variants and n

How to query by text string which contains html tags using React Testing Library?

Current Working Solution Using this html: <p data-testid="foo">Name: <strong>Bob</strong> <em>(special guest)</em></p> I

How to test for document being undefined with RTL?

I have the following react hook which brings focus to a given ref and on unmount returns the focus to the previously focused element. export default function u

React-testing-library: changes due to input

I'm trying to test that a component updates as it should due to changes in an input element. I use the fireEvent.change()-function, and if I then check the valu

@testing-library/react render Error: `target` and `targetRef` props are `undefined`, it' required to use one of them

I am trying to write a unit test for a custom react component that use the Dialog from @fluentui/react-northstar when I try to render the component from the tes

React testing library, how to open a Collapse in Ant Design

I want to write a unit test that opens an antd. Collapse <Panel /> But no matter what combination of fireEvent or userEvent mouse actions I try, I cannot

how to implement page navigation in react testing library (Link, a tag, history.push)

I am trying perform Dom testing at '/test' url page. my application use BrowseRouter from react-router-dom As following user approach, I want to manually chang