Issues with fireEvent or userEvent Not Working in Unit Tests for Components Using useComboBox from react-aria

[ryanpark]

Hi

I am trying to write unit tests for a component built using useComboBox, but it seems that fireEvent or userEvent is not triggering the input changes as expected. Specifically, I want to verify that when I type in the input field, the suggestions are displayed correctly.

my test :

it.only('should allow typing in the input and show suggestions', async () => {
    render(<AutoComplete items={mockItems} />);
    const inputElement = screen.getByRole('textbox');

    console.log(prettyDOM(inputElement));

    inputElement.focus();

    fireEvent.change(inputElement, { target: { value: 'liv' } }); // or
    userEvent.type(inputElement, 'liv', { delay: 100 });

    await waitFor(() => {
      const popover = screen.getByTestId('popover');
      expect(popover.length).toBeGreaterThan(0);
    });

    screen.debug();
  });

Obviously, it works as expected at the browser level functionally, but not in the unit tests. Is there something I might be missing in my setup, or is there a specific way I should be using fireEvent or userEvent with components that use useComboBox from react-aria ?

[silviuaavram]

react-aria is not downshift, I think you created an issue in the wrong repo. you may refer to useComboBox from react-aria which is owned by adobe. please check there thanks!

https://github.com/adobe/react-spectrum