I'm using React 18, React Testing Library 14.0.0, and React Query 3.3. Everything is working like a charm in the browser (real user) context. But while testing I am experiencing some problems. My c...

[For question purpose, I make dummy example to make it easier to understand] Let's say I have this homepage component that will toggle color when reach 1/3 of page height. // Homepage.js const Ho...

I was experimenting with tRCP and diligently followed the setup for my Next.js project described in the official docs over here: https://trpc.io/docs/nextjs However I noticed that a simple componen...

I'm testing a react Material UI Menu component using react-testing-library with an onClose prop that is triggered when the menu loses focus. I cannot trigger this state though even when I add a cli...

I'm working on test cases with react testing library. To write the test case I need to mock the useQuery and useMutation method of react query. If anyone knows the solution please guide me. I'm add...

I want to test onDrop method from react-dropzone library in React component. I am using Jest, React Testing Library. I'm creating mock file and I'm trying to drop this files in input, but in consol...

So I am writing unit test using "react-testing-library" on Jest and I have this error: Test suite failed to run ReferenceError: global is not defined at Object.<anonymous> (nod...

I have created a simple counter app for learning react testing library. But I got stuck when I was testing whether a paragraph is rendered or not with {count} text. Main.jsx function Main() { cons...

Running React Testing Library to generate snapshots on JSX which uses the Emotion css prop results in no CSS being rendered. I have tried using the "@emotion/jest/serializer" but still no...

I have a React component with Ant Design Modal inside it and I am trying to test that modal gets opened when a button it clicked: The component: const ModalComponent = () => { const [visible, s...

I'm using react with ViteJS and Vitest for testing. I have set up the config for vitest and the test setup file too as you can see in the screenshots below. vite.config.js src/test/setup.ts src/a...

I am working on a CMS project and I just came across an issue. _userEvent.default.clear is not a function. import user from '@testing-library/user-event' test('can edit label', async () => { ...

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

Seems like the way Material UI works is it renders a different SVG when the checkbox is clicked, and not changing the attributes or anything on the actual input element. So how do I actually test t...

I am using Redux Toolkit approach by creating: slices with reducer and extra reducers thunks with createAsyncThunk API I Want to understand what is the best way to test with React Testing Library...

I am using react testing library and by its conventions, elements should be accessed by getByRole. When I had input type="text" the role was textarea which was fine. Now I have input with...

When testing components with React Testing Library, I find myself starting with getBy*, and occasionally needing to replace it with queryBy* (for example if I need to check for the non-existence of...

I am trying to test for the existence of my modal using React Testing Library with findByRole. I keep getting an error saying: Unable to find role="dialog" even though I can see clearly s...

I am using React-testing-library and getting an error on the last line which is: expect (title.value).toBe("testtitle");})}) . The error message is Property 'value' does not exist on type 'HTMLE...

I want to test my custom hook but in React 18 @testing-library/react-hooks library is not working, instead I am using @testing-library/react it has renderHook function and it works fine, but this l...

I am having an error when I build my application in react. I noticed this error only when I tried to build application. When I stopped dev server and ran it again, it showed the same error. It seem...

All of my components get data and methods from the Context. I want to test -at least- "component renders" case but of course, when I try to render component in a test case, it cannot find...

I'm trying to use jest-dom to test a component's styles, and I'm having the error: "TypeError: expect(...).toHaveStyle is not a function" My component is a simple link with styled-compon...

import React from 'react'; import { Provider } from 'react-redux'; import configureStore from 'redux-mock-store'; import { render, screen, fireEvent } from '@testing-library/react'; import My...

I created some basic tests and followed the getting started guide on Jests website, but toHaveAttribute is not a function apparently import React from "react"; import { fireEvent, render ...