Questions about testing React components with the react-testing-library utility.
Questions tagged [react-testing-library]
1608 questions
0
votes
1 answer
How do we add a data-testid to an error field of a textField component
I tried this
![](../../users/profiles/9189465.webp)
Kimaya
- 782
- 1
- 10
- 26
0
votes
1 answer
Testing Actions, Reducers, & Contexts in React
I've built multiple React functional components using Hooks and Context. Everything works fine. Now I need to write tests for everything. I'm confused about how to move forward with some of them so wanted to reach out to the…
![](../../users/profiles/11838970.webp)
robertwerner_sf
- 711
- 2
- 21
0
votes
1 answer
react testing library rendering , child prop is undefined
Let's say I want to check this component render its child with the right initial props
const { container } = render( )
Where is
Before I can try to check anything…
![](../../users/profiles/4142811.webp)
François Richard
- 6,111
- 10
- 34
- 66
0
votes
1 answer
How can click twice same position in React testing?
I am writing test code. I don't know how to make test code with @testing-library/react. Scenario is
1. click and open select
2. click open target
3. click again without mouse moving
4. I want to look whether error occur
const…
0
votes
2 answers
Is it possible to wrap each individual test in a wrapper component?
I am using material-UI components in my React components. Therefore I will need to apply the component around all my components in my tests.
My components are located in individual…
![](../../users/profiles/2489480.webp)
Remi
- 2,517
- 3
- 26
- 43
0
votes
0 answers
The given element does not have a value setter
I have a react component I would like to do a unit test on.
I keep getting an error: "The given element does not have a value setter"
Here is my code:
/slider.js
...
![](../../users/profiles/11575257.webp)
theastronomist
- 568
- 3
- 18
0
votes
0 answers
Why am I getting `When testing, code that causes React state updates should be wrapped into act ` in one case but not another?
I'm doing some testing with jest and react-testing-library
I've boiled this down so it's obviously not my full test.
Why does this code:
test('Share renders', () => {
const { getByText } = render( )
})
Give me this console error:
When…
![](../../users/profiles/10730264.webp)
Ryan
- 150
- 6
0
votes
1 answer
Testing Ionic components with react testing library
I've recently started working with the new ionic 4, which introduces react instead of angular as a language. In my recent projects I was testing my components with react-testing-library for react. Especially when it comes to forms and the submission…
![](../../users/profiles/7156223.webp)
Dominik Spiertz
- 81
- 1
- 4
0
votes
1 answer
React + Jest + testing-library: "Please upgrade to at least react-dom@16.9.0 to remove this warning." ...but react-dom is 16.9.0 already
I'm writing tests for my React app using Jest and testing-library/react
My tests pass but I can't get rid of this error:
It looks like you're using a version of react-dom that supports the "act" function, but not an awaitable version of "act" which…
![](../../users/profiles/1141918.webp)
emersonthis
- 30,934
- 52
- 191
- 328
0
votes
0 answers
Struggling with mock
This is the given code I am using to test my react component. I am testing AddCorporateBeneficiaryDetailsForm and addNewBeneficiaryDetails is the function I am calling when user submits the form. If I pass
addNewBeneficiaryDetails = () =>…
![](../../users/profiles/6416252.webp)
Srinivas
- 206
- 1
- 12
0
votes
1 answer
How to test react component with hooks using react testing library
I am trying to test a component which use useTheme hook provided by emotion.js. The theme is set during the app initialization.
Now when I write my test cases, the useTheme hook is unable to fetch the styles data as only header component is getting…
![](../../users/profiles/2801563.webp)
Shamanth
- 206
- 3
- 11
0
votes
0 answers
How can I test a method that removes items from a list?
I have this component that gets added items from the apollo cache. I have a method that removes an item from the added items array
I'm struggling to write a test for it.. So below is the component that I wrote:
const GET_ADDED_ITEMS = gql`
query…
![](../../users/profiles/2916803.webp)
drifterOcean19
- 314
- 1
- 12
0
votes
1 answer
Is it possible to use to use the DOM Testing library to do end to end testing for react applications
I am working on writing end to end tests for a react application using Selenium and Protractor. I was wondering if there is a way to use the Testing library to access elements from the DOM (in a real browser).
0
votes
1 answer
Trying to test a component using the useQuery hook but onCompleted causing issues
I am trying to test the following component, but cannot get it to render in Jest once data is fetched due to an error on the query's onCompleted prop. I have another component that is essentially the same, but does not utilise onCompleted at all and…
![](../../users/profiles/8785312.webp)
Mike Hurl
- 11
- 3
0
votes
1 answer
On updating @testing-library/jest-dom version from 4.0.0 to 4.2.0 react test case is failing
On updating @testing-library/jest-dom version from 4.0.0 to 4.2.0 react test cases which are used to check styles by using toHaveStyles are failing.
Test using react-testing-library:
test('renders component', () => {
const { getByTestId } =…
![](../../users/profiles/11747630.webp)
Swetha D
- 103
- 1
- 9