algolia / algolia/autocomplete
Unhandled promise rejection in unit tests
- Dominant language
- TypeScript
- Stars
- 5.3k
- Forks
- 341
- Avg merge
- 3d 1h
- Merged PRs (30d)
- 5
Description
## Description
Hi all, I have a question about this custom react renderer example: [examples/react-renderer/src/Autocomplete.tsx](https://github.com/algolia/autocomplete/tree/next/examples/react-renderer).
In out jest unit tests, we got the below error even if the tests passed.

## Reproduction
```
it('should render results when doing a search', async () => {
const { getByTestId, asFragment } = render(Autocomplete, props)
fireEvent.change(getByTestId('autocomplete-input'), {
target: { value: 'a' },
})
const searchButton = getByTestId('search-button')
await waitFor(() => {
fireEvent.click(searchButton)
})
expect(asFragment()).toMatchSnapshot()
})
```
Even if it's just
```
const { getByTestId } = render(Autocomplete, props)
const autocomplete = getByTestId('autocomplete-input')
autocomplete.focus()
```
You will get the below error:
```
node:internal/process/promises:246
triggerUncaughtException(err, true /* fromPromise */);
^
[UnhandledPromiseRejection: This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). The promise rejected with the reason "[object Object]".] {
code: 'ERR_UNHANDLED_REJECTION'
}
```
One way to fix this is to add a `setTiemout`
```
setTimeout(function () {
autocomplete.focus()
}, 100)
```
but this is not ideal.
Could you please advise what is the best way to test?
## Environment
- OS: [e.g. Windows / Linux / macOS / iOS / Android]
- Browser: [e.g. Chrome, Safari]
- Autocomplete version: [e.g. 1.0.0]
Contributor guide
Research direction
Start with examples/react-renderer/src/Autocomplete.tsx and reproduce the focus and search snippets in the unit tests. Trace the rejected promise observed during those interactions and verify that the tests pass without an unhandled promise rejection or a timeout workaround.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend, testing
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 28/100