algolia / instantsearch

⚡️ Libraries for building performant and instant search experiences with Algolia. Compatible with JavaScript, TypeScript, React and Vue.

Home Page:https://www.algolia.com/doc/guides/building-search-ui/what-is-instantsearch/js/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Samsung Note 20 Chrome has erratic behavior

DogByteMarketing opened this issue · comments

🐛 Current behavior

When using Chrome on the Note 20 Ultra using the demo link provided in documentation it doesn't let you see results until you press enter. There's also an issue when pressing enter and changing the search query that it causes old results to display.

🔍 Steps to reproduce

Load chrome on a Note 20 (possibly other Samsung devices)
Pull up reproduction site
Start typing and you'll notice nothing displays
Hit enter and results appear
Delete results and type something else to see old results instead of new

Live reproduction

https://codesandbox.io/p/sandbox/github/algolia/instantsearch/tree/master/examples/js/getting-started?file=%2Fsrc%2Fapp.js

💭 Expected behavior

The results to display properly as the data is typed how it performs in other mobile devices.

Package version

4.63.0

Operating system

No response

Browser

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

I don't have access to a device to reproduce this right now, but I wonder if it possibly (although I don't really see how) could be related to #5963, do you mind trying out 4.62.0 and seeing if it still behaves wrongly?

Hi, thanks for your feedback! It seems Samsung's keyboard "suggestion strip" feature acts as an IME. You can downgrade to 4.62.0 while we're working on a fix.

I created a test page for testing keyboard events.

https://tats-u.github.io/kbdevents/

I recommend to use compositionstart to start caching the value in the most recent changed event until compositionend. If we receive compositionend and have a cached value, we can trigger a search by it.

Screenshot_20240121-032128.png

↑Here is Firefox and Gboard US layout example (input "gut"→correct it as "got")

We want to favor an "as you type search" experience for latin alphabets. The issue here (which we believe is not specific to Samsung but affects all Android IMEs) is that with predictive text enabled, inputs are sent as composition events instead of direct change events. The workflow we implemented to account for indirect composition breaks our intended experience in this case.

In #6009 we're reverting the default behaviour to accept all input events (change and composition) by default, with an option to prevent composition from updating the state if customers are in a relevant use-case (ie: non-latin dataset).

Hi, this issue has been fixed and it's available in the latest version of InstantSearch:

  • instantsearch.js@4.64.2
  • react-instantsearch@7.5.4
  • vue-instantsearch@4.13.6