algolia / algolia/autocomplete

onSelect item should trigger store.pendingRequests.cancelAll();

Open
#1,207 1 comment 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
5.3k
Forks
341
Avg merge
3d 1h
Merged PRs (30d)
5

Description

## Description

Following of this issue : #806, when we programatically call `setIsOpen(false)` to the `Autocomplete` instance, the current requests are not cancelled and the panel re-open when queries finish.

## Reproduction

[**Preview →**](https://codesandbox.io/s/algolia-autocomplete-example-react-renderer-forked-997sxn?file=/src/index.tsx)

**Steps**

1. Go to the code sandbox
2. Click on the Search and type 'd', wait for results to display
3. Pass your browser network in slow mode
4. Type 'deb' in the search bar and immediately select an item from the previous search (that will trigger a `setIsOpen(false)` + `history.push` to bring you to the item subpage)
5. React router change the components of the user, the search is correctly closed
6. As requests are not cancelled, when one finish, the autocomplete panel re-open

## Expected behavior

When the autocomplete `isOpen` become false, all existing queries should be cancelled so the autocomplete panel re-open only if the input take focus again.

## Environment

- OS: Windows 10
- Browser: Chrome
- Autocomplete version: 1.11.1

Contributor guide

Open the contributing guide

Research direction

Start with the Autocomplete onSelect flow and the setIsOpen(false) behavior described in the reproduction, then trace how store.pendingRequests is managed when the panel closes. Reproduce the slow-network case in the linked CodeSandbox; done means selecting an item cancels outstanding requests and the panel does not reopen when they finish.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend, search
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.