Questions about testing React components with the react-testing-library utility.
Questions tagged [react-testing-library]
1608 questions
0
votes
1 answer
onChange function is not getting called on fireEvent.change()
I have an autoComplete like this
setExportLanguageId(newValue && newValue.value)
}
options={languageDropDownData}
value={exportLanguageId}
width={'80%'}
/>
and Button below it like…
Prakash Reddy Potlapadu
- 743
- 1
- 7
- 11
0
votes
1 answer
react-test-library render a functional component that is declared in the test
Is it not possible to declare some react function components that nest and render one of them via the react-testing-libary?
Here is my attempt:
RestaurantIdContext.js
import React from "react"
const RestaurantIdContext =…
Norfeldt
- 5,230
- 13
- 70
- 118
0
votes
1 answer
Compose single render helper from two testing library render helpers in React
Cheers. Quick question on using @testing-library/react and creating render helpers similar to the below.
const renderWithRouter = (
ui,
{
route = '/',
history = createMemoryHistory({ initialEntries: [route] })
} = {}
)…
Tom Siwik
- 792
- 7
- 21
0
votes
1 answer
How to "clear mocks" for the "@testing-library/react" fireEvent?
I'm using @testing-library/react for testing an app with legacy code. Basically, each time I click a button is shown a message component. The message is the legacy code. This legacy component injects HTML in the DOM.
When a Test my application, I…
Pablo Darde
- 3,855
- 6
- 29
- 47
0
votes
1 answer
Jest intergation testing react components with multiple saga fetch calls
I'm trying to use Jest to integration test some of our more complex react components which are made up of a number of sub components, the theory being to test high up the stack of components to be closer to how the user experiences the…
mattb
- 131
- 12
0
votes
1 answer
How to avoid testing implementation details when testing that an action creator is called?
I'm new to testing, and I'm writing tests for a large React app that uses Redux, and I'm trying to follow the "Avoid testing implementation details" philosophy of React Testing Library.
But I'm not sure how to proceed when testing that action…
Jimmy-P
- 1
0
votes
0 answers
How to assert on callback functions inside objects in jest?
I have a react redux setup and react-testing-library for testing.
My component dispatches an action with the required info as well as a callback on finish. But when trying to mock the dispatch call jest seems to compare references to functions…
Grigory Bogush
- 93
- 1
- 11
0
votes
1 answer
Component rendered in `describe` is not visible in `it` using react-testing-library
When I render a component in it block everything works as expected.
it("when user inputs more characters it displays suggestions", async () => {
const { getByLabelText, findByText } = render(
mazikwyry
- 197
- 1
- 10
0
votes
1 answer
Return types for utility functions of React Testing Library
I'm trying to figure out what should the return type be (instead of generic : any) for the utilities returned by Testing Library React.
For example, with the following, I get TS error (Unexpected any. Specify a different type.)
const setup = (): any…
skube
- 4,813
- 7
- 47
- 64
0
votes
1 answer
How to test outcome based on the value of useState
I have a component like this:
const Component = ({callback}) => {
const [selected, setSelected] = useState(false);
const increment = () => {
if(selected) {
callback()
} else {
do something else...
}
}
}
How can I…
L-R
- 369
- 1
- 5
- 17
0
votes
1 answer
How to test child component method without Enzyme?
I need to access and test a method of a child component in react using Jest. I am not using Enzyme, so this is not a duplicate of this question or this question. I would like to use React Testing Library instead of Enzyme.
Earlier I was happily…
Adam D
- 1,370
- 1
- 13
- 29
0
votes
1 answer
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://codesandbox.io/s/polling-hook-demo-9yo8c
Note that I am configuring Jest inside my…
Naresh
- 18,757
- 25
- 99
- 162
0
votes
1 answer
Invalid hook call when dynamically importing components
I've got this setup:
Component A that uses a hook
Component B that imports component A
When testing B I'm dynamically reimporting it with a require(B) on a beforeEach and resetting modules via jest.resetModules()
Doing the dynamic import to update…
Klemensas
- 9
- 1
0
votes
0 answers
Custom Hook: how to test set state is not called on component unmount
Test set state is not called when component is unmounted
I have got a custom hook which calls a promise on page load to set the data. To make sure that set state on data/error is not called when if the the component unmount I am using cancel request…
reactdesign
- 121
- 9
0
votes
1 answer
Error when trying to mock third party library in jest
I'm running into the following error when doing jest.Mock on a third party library. The library in question is react-email-editor.
jest.mock("react-email-editor", () => {
return {
Editor:
Email Editor
,
};
});
Error with…
blankface
- 3,319
- 10
- 40
- 78