Questions about testing events with the user-event utility.
Questions tagged [user-event]
65 questions
16
votes
1 answer
Cant find setup() on userEvent
I am trying to use the user-event utility in testing library as described here :
https://testing-library.com/docs/user-event/intro
Unfortunatley when I try and call the setup function
userEvent.setup()
My IDE says that it cannot be found :
Why is…
Oliver Watkins
- 12,575
- 33
- 119
- 225
10
votes
2 answers
How to use user-event library in conjunction with Jest's fake timers?
I'm writing Jest tests for a React component, and using the @testing-library/user-event library to simulate user interaction. This works great, except in tests that use Jest's fake timers.
Here's a sample test:
it(`fires onClick prop function when…
Tom
- 8,509
- 7
- 49
- 78
7
votes
1 answer
Errors when updating @testing-library/user-event to v.14
I was following all the instructions for the newest version of @testing-library/user-event.
BEFORE:
test('request support action',() => {
render(
jake-ferguson
- 315
- 3
- 11
- 32
6
votes
1 answer
Calling userEvent.setup() in beforeEach() - is it a good or bad pattern?
In a test suite that needs to call userEvent.setup() in multiple tests, sometimes I'll do the userEvent.setup() in a beforeEach and then just reference the same user var in multiple tests
let user: UserEvent
beforeEach(() => {
user =…
minorgod
- 652
- 6
- 7
6
votes
2 answers
Why clear method not exist on @testing-library/user-event
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 () => {
createArticleMock()
await…
cooskun
- 558
- 1
- 5
- 20
5
votes
1 answer
What element should userEvent.type(...) target to be used with MUI's DesktopDatePicker TextField?
How can I type into the TextField input in the MUI datepicker with react-testing-library's user-event? I can see there is a mask being applied
I've tried userEvent.type(inputEl, '1') and userEvent.keyboard('1'). In both cases, the input remains…
Remy
- 822
- 12
- 18
4
votes
1 answer
Why would fireEvent work but userEvent not work?
In short, I have a table row with an onclick event. I am getting this via
const row = screen.getByRole('row', { name: /My row/i })
await userEvent.click(row)
This does not trigger the event handler. However, if I do:
const row =…
plusheen
- 1,128
- 1
- 8
- 23
4
votes
1 answer
Does userEvent.hover() not works with mouseEnter event when testing react components?
I am using tippy js library to handle tooltips in my app. Now I want to test whether the components shows a tooltip content when hover over an element. The tippy js library says that the tooltip is triggered by either mouseEnter or focus event.
When…
Subrato Pattanaik
- 5,331
- 6
- 21
- 52
4
votes
1 answer
React Testing Library userEvent.type recognizing only the first letter
I'm using "@testing-library/user-event": "^14.2.0" with Next.js 12.
Here is my test
it('test search input', async () => {
const searchInput = screen.getByPlaceholderText('Search assets');
expect(searchInput).toBeInTheDocument();
await…
anv
- 81
- 1
- 6
4
votes
0 answers
Why does react user-event type and react-hook-form fail?
I am using react-testing to test typing into the input field that uses react-hook-form
Here is my test setup:
import { render, screen, waitFor } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import selectEvent…
wick3d
- 1,164
- 14
- 41
3
votes
1 answer
Cannot simulate user type in Input using Jest unit test. fireEvent, userEvent do not work
I have an input field and wish to stimulate the type-in during a unit test. Tried all the methods recommended on internet but still no luck, here is my code:
// In component
snowfall
- 31
- 3
3
votes
1 answer
Unable to update text area with new value using @testing-library/user-event
I need to test a graphql-react component using @testing-library/react. I want to display text area based on a result value from query. [am able to get that]. But, unable to update the text area with the new value using…
Ashwini
- 381
- 6
- 23
2
votes
1 answer
How do I test for a tooltip appearing on hover in recharts x react testing library x vitest?
I'm trying to write a test and can't work out why my hover isn't working. The full code is here. I have a recharts chart element, which renders, is responsive, and shows a tooltip containing the expected data (here, amino acid name and ratio of…
Chris Cozens
- 29
- 4
2
votes
1 answer
How do I use userEvent to test a component that renders a MUI Select?
I'm writing unit tests for a component that renders a Material UI Select. But userEvent.selectOption does not seem to be working. In the example below, both getByRole calls seem to be selecting the correct components, but the validation with…
Tom Faber
- 131
- 1
- 6
2
votes
1 answer
React testing Library | .toHaveAttribute()
I'm trying to test a component but having issue with unit testing.
The component have tabs provided via props. It's an array of object.
When the component first render, the first tab is supposed to be selected :
aria-selected set to true
inline…
Jonathan Nadeau
- 23
- 1
- 3