Unable to find the suggestion items during a unit test

[gazpachu]

I get a Timed out in waitForElement.

it('calls "onSelect" prop when an item is selected', async () => {
  const onSelect = jest.fn();
  const { getByPlaceholderText, container } = customRender(<AutoComplete placeholder="test" data={data} onSelect={onSelect} />);
  const inputNode = getByPlaceholderText('test');

  // This will write `pete` in the input field
  fireEvent.change(inputNode, { target: { value: 'pete' } });

  const items = await waitForElement(() => {
    container.querySelectorAll('.react-autosuggest__suggestion');
  });

  console.log(items);

  // Fire the click on the first item
  // fireEvent.click(items[0]);
  expect(onSelect).toHaveBeenCalled();
});

More info here: https://spectrum.chat/react-testing-library/help?thread=68e5c2dc-21fa-4b8d-9c6d-3bf2c0613c4a

Any help would be much appreciated.

[andrastothtw]

Actually Readme.md should be expanded on how to (and what to) test using the component. I'm also struggling to check if a change in input causes my mock client to be called. :|

[gazpachu]

Here is sandbox that another user made to show the issue: https://codesandbox.io/s/5yzq54p8yl

[dallin-christensen]

if anyone's still interested in this... I got that codepen working by inserting

inputNode.focus()

into line 17 in Autocomplete.test.js
👍

[TimPerry]

Legend. Thank you fo much for this. Saved me a lot of time.

[toantd90]

inputNode.focus() doesn't work for me :(

[gaurav5430]

Has anyone figured out how to test this using react testing library ? I have the same issue where even after focusing or clicking on the input or the combobox, it just doesn't call the onSuggestionsFetchRequested

EDIT: I was able to make it work using userEvent library in my RTL tests to type into the textbox. Did not need the extra input.focus