Autocomplete" (dropdown) options list behaves unexpectedly under certain conditions (v14.x issue)

Tags: #<Tag:0x00007efc6b5fee48>
#1

Hi,

I’m reaching out to highlight an observation regarding the latest releases of the @handsontable/react library, particularly versions 14.1 onwards.

Description of the Issue:
When utilizing the select functionality within a cell that includes a search dropdown option, I noticed an unexpected behavior. If a user searches for a string that is not present in the dropdown list and then removes some characters from the search string, the element of the dropdown that matches the search string disappears. However, the height of the dropdown remains the same, which is not the expected behavior.

Steps to Reproduce:

  1. Access the provided JSFiddle example for version 14.x.
  2. Navigate to the column containing the select dropdown, specifically the “classic color” column.
  3. Within the dropdown, input any string that is not present in the options. For instance, type “ex”.
  4. Manually delete the last character of the input string by pressing the backspace/delete key.
  5. Take note of the behavior exhibited by the dropdown at this point.

Issue with latest version 14.x :

image

expected behaviour:

image

Observation:
This issue persists in version 14.x of the library but is not present in versions 13.x or earlier.

Live Examples:
To provide a clear demonstration of the issue:

Version 13.x (no issue): https://jsfiddle.net/kzoa3d2n/
Version 14.x (issue present): https://jsfiddle.net/janhum84/1/

We are an existing customer and this is creating issues in our live product environment. It would be great if this could be fixed.

Thanks!

#2

Oh my, this looks really bad. I will report it to the team right away! (and, of course, keep you updated).

I will also reach out if I find any workaround before the official fix.

#3

Hi @aleksandra_budnik
It’s been a week we have raised the issue. Just wanted to know what is the ETA & Can we also have link of GitHub to track the progress ?
Thanks

#4

Hi @siddhantjain15298

This issue has already been fixed on the develop branch. Here https://jsfiddle.net/nq5xz1w4/ you can test it (the demo has the pre-release build applied).

I will also update this thread upon the release.

#5

Hi @aleksandra_budnik
Just wanted to follow up on the status of the issue. I see that it has been fixed on the develop branch and tested on the provided JSFiddle demo.

Could you please provide an update on when this fix will be released?
Thanks

#6

Hi @siddhantjain15298

This issue is already fixed and waiting for the release. We plan to push the next version this/next week.

Here https://jsfiddle.net/nq5xz1w4/ is a demo with the latest build that you can test.

#7

Hi @siddhantjain15298

Sorry for the late reply. I lost this forum link.

We have fixed this issue in v14.4.0 :slight_smile:

Hopefully, it also works well for you.

1 Like
#8

Hi @aleksandra_budnik
I wanted to let you know that the updated version of Handsontable has resolved the issue.
Thanks

2 Likes
#9

I am more than happy to hear that, @siddhantjain15298

Thank you for the update.

#10